學習HTML的第三次課

来源:http://www.cnblogs.com/Fkuennhvo/archive/2017/05/15/6854553.html
-Advertisement-
Play Games

3.下拉列表:<select name="" id=""> <option value=""></option> </select> 屬性:name="" 指定獲取輸入的名字。 value="" 不知道有什麼用。但我知道它有用。 在option標簽中預設選中屬性為 selected 在input標簽 ...



瀏覽器的地址欄中有字數限制,大約為200個字元。



1.表單:<form action="" method=""></form>
    屬性: action=“” 提交路徑 method="" 傳輸類型, 有get/post兩種類型,即,以明文/密文的方式傳輸提交的數據



2.文本框:<input type="" name="" value="" id="">
    屬性:type="" 其中有很值分別代表不同的意義,常用的有,submit(提交)、password(密碼)、reset(重置)、radio(單選)、checkbox(多選)、button(按鈕)、text(普通文本框)
name="" 添加該屬性,並指定值,才能收集用戶的輸入信息傳入後臺。
                               但對於不同的type屬性也有不同的意義,當用於radio時,多個name一樣,radio就有互斥性。
value=""用於不同的type類型,有不同的意義。如用於text和password中,即用收穫取用戶輸入的具體數值。
id="" ID全局唯一,用於索引。其它用處不知道。


 

3.下拉列表:<select name="" id="">
         <option value=""></option>
      </select>

          屬性:name="" 指定獲取輸入的名字。
          value="" 不知道有什麼用。但我知道它有用。
          在option標簽中預設選中屬性為 selected
          在input標簽中預設選中屬性為 checked

 


option[value=$]{$}*6 == 6個<option value=""></option>

 

 

 


 


4.多行文本框:
<textarea name="" id="" cols="30" rows="10"></textarea>
   屬性: name 指定獲取輸入的值的名字。
      cols 指定輸入的最小的列數。
     rows 指定輸入的最小的行數。



5.<label for=""></label>
屬性:for="" 其中的值與input id="" 中的值一致,可將label標簽中的值與input相關連
例如: <input type="radio" id="radio"><label for="radio">radio</label>







 1 <!DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8"/>
 5     <meta name="keyword" content="關鍵字"/>
 6     <meta name="discraption" content="描述"/>
 7     <title>Sign in</title>
 8 </head>
 9 
10 <body bgcolor="#fff8dc">
11     <center>
12         <h1>登錄</h1>
13     <form action="#" method="post">
14 
15         帳號:<input type="text" name="User" >     <br/><br/>
16 
17         密碼:<input type="password" name="Pwd" >      <br/><br/>
18 
19         <a href="questionnaire.html" target="_blank">
20             <input type="button" value="登錄" width="50" height="10">
21         </a>
22 
23         <!--<br/> https://wj.qq.com/s/1333447/4afc/?pgv_ref=aio2015&ptlang=2052-->
24      </form>
25     </center>
26 
27 </body>
28 </html>
登錄




  1 <!DOCTYPE html>
  2 <html lang="en">
  3 <head>
  4     <meta charset="UTF-8"/>
  5     <meta name="keyword" content="關鍵字"/>
  6     <meta name="discraption" content="描述"/>
  7     <title>Registed</title>
  8 </head>
  9 
 10 <body bgcolor="#fff8dc">
 11     <marquee behavior="alternate" direction="right">
 12         <a href="Registed.html" target="_blank" style="float: right">&nbsp;&nbsp;&nbsp;註冊</a>
 13         <a href="Sign.html" target="_blank" style="float: right">登錄</a>
 14     </marquee>
 15 
 16     <h1 align="center">註冊</h1>
 17 
 18     <center>
 19         <form action="#" method="post">
 20             帳號:<input type="text" name="User"value="" >     <br/><br/>
 21             
 22             密碼:<input type="password" name="Pwd" value="">      <br/><br/>
 23             
 24             性別:<input type="radio" name="gender" value="male" id="male" checked>
 25                  <label for="male"></label>
 26                  <input type="radio" name="gender" value="female" id="female">
 27                  <label for="male"></label>  <br>
 28 
 29             生日:
 30                 <select name="year" id="">
 31                     <option value="1991" selected>1991</option>
 32                     <option value="1992">1992</option>
 33                     <option value="1993">1993</option>
 34                     <option value="1994">1994</option>
 35                     <option value="1995">1995</option>
 36                     <option value="1996">1996</option>
 37                     <option value="1997">1997</option>
 38                     <option value="1998">1998</option>
 39                     <option value="1999">1999</option>
 40                 </select>&nbsp;&nbsp;
 41 
 42                 <select name="month" id="">
 43                     <option value="01" selected>01</option>
 44                     <option value="02">02</option>
 45                     <option value="03">03</option>
 46                     <option value="04">04</option>
 47                     <option value="05">05</option>
 48                     <option value="06">06</option>
 49                     <option value="07">07</option>
 50                     <option value="08">08</option>
 51                     <option value="09">09</option>
 52                     <option value="10">10</option>
 53                     <option value="11">11</option>
 54                     <option value="12">12</option>
 55                 </select>&nbsp;&nbsp;
 56 
 57                 <select name="day" id="">
 58                     <option value="01" selected>01</option>
 59                     <option value="02">02</option>
 60                     <option value="03">03</option>
 61                     <option value="04">04</option>
 62                     <option value="05">05</option>
 63                     <option value="06">06</option>
 64                     <option value="07">07</option>
 65                     <option value="08">08</option>
 66                     <option value="09">09</option>
 67                     <option value="10">10</option>
 68                     <option value="11">11</option>
 69                     <option value="12">12</option>
 70                     <option value="13">13</option>
 71                     <option value="14">14</option>
 72                     <option value="15">15</option>
 73                     <option value="16">16</option>
 74                     <option value="17">17</option>
 75                     <option value="18">18</option>
 76                     <option value="19">19</option>
 77                     <option value="20">20</option>
 78                     <option value="21">21</option>
 79                     <option value="22">22</option>
 80                     <option value="23">23</option>
 81                     <option value="24">24</option>
 82                     <option value="25">25</option>
 83                     <option value="26">26</option>
 84                     <option value="27">27</option>
 85                     <option value="28">28</option>
 86                     <option value="29">29</option>
 87                     <option value="30">30</option>
 88                     <option value="31">31</option>
 89                 </select><br>
 90 
 91             郵箱:<input type="text" name="E-mail" >   <br/><br/>
 92             
 93             手機號:<input type="text" name="Number" >      <br/><br/>
 94 
 95 
 96             <a href="Sign.html" target="_blank">
 97                 <input type="submit" value="提交">
 98             </a>
 99 
100             <input type="reset" value="重置">
101 
102             <!--<br/> https://wj.qq.com/s/1333447/4afc/?pgv_ref=aio2015&ptlang=2052-->
103         </form>
104     </center>
105 
106 </body>
107 
108 </html>
註冊

 



 
 1 <!DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title>questionnaire</title>
 6     <style>
 7 
 8     div{margin-left:10%}
 9     div{margin-right:10%}
10     </style>
11 </head>
12 
13 <body bgcolor="#faebd7">
14 
15     <div align="center" >
16         <hr>
17         <h1 align="center">大學聲調查 | 大學生實習兼職情況調查</h1>
18         <hr>
19 
20        <p> 大學生在校期間,一般都會參與某些形式的兼職或者實習經歷,但不同高校的學生能夠得到的實習機會也頗有不同。<br>
21 
22         大學聲聯合騰訊教育,進行了這次大學生實習情況調查,期待你的參與能發出大學生自己的聲音。<br>
23 
24         本調查共有21道選擇題,花3-4分鐘即可完成。<br>
25 
26         (本調查問卷中提到的“實習”指大學生在校期間為提高就業競爭力,賺生活費,以及社會實踐等目的進行的各類實習及兼職工作行為)
27         </p>
28 
29 
30     </div
              
您的分享是我們最大的動力!

-Advertisement-
Play Games
更多相關文章
  • ConcurrentHashMap實現原理 ConcurrentHashMap源碼分析 總結 ConcurrentHashMap是Java併發包中提供的一個線程安全且高效的HashMap實現(若對HashMap的實現原理還不甚瞭解,可參考我的另一篇文章HashMap實現原理及源碼分析),Concur ...
  • 題目描述 “低價購買”這條建議是在奶牛股票市場取得成功的一半規則。要想被認為是偉大的投資者,你必須遵循以下的問題建議:“低價購買;再低價購買”。每次你購買一支股票,你必須用低於你上次購買它的價格購買它。買的次數越多越好!你的目標是在遵循以上建議的前提下,求你最多能購買股票的次數。你將被給出一段時間內 ...
  • 1、www.bejson.com線上json格式校驗工具 2、關聯兩種方式:正則表達式和json path 名稱+$. 3、charles 抓包工具,獲取介面請求方式、response、cookies和報文等信息,方便進行測試 連接手機端:proxy setting 獲取電腦的ip 修改手機 操作手 ...
  • 類與對象是不同的,類是對象的藍本,你創建出來的是對象,而它的結構由類預先定義。對象是一些操作(方法)和信息(屬性)的集合,並占據記憶體中的一塊存儲空間,你可以通過函數調用的方式讓它對它的屬性執行默寫操作。 摘自 [美】 Alasdair Allan <Learning iOS Programming> ...
  • 本篇博客是《JWebFileTrans(JDownload):一款可以從網路上下載文件的小程式》系列博客的第三篇,本篇博客的內容主要是在前兩篇的基礎上增加多線程的功能。簡言之,本篇博客截止目前所達到的功能是:基於HTTP協議的多線程斷點遠程下載小程式 ...
  • 1.所有的標記都必須要有一個相應的結束標記 以前在HTML中,你可以打開許多標簽,例如<p>和<li>而不一定寫對應的</p>和</li>來關閉它們。但在XHTML中這是不合法的。XHTML要求有嚴謹的結構,所有標簽必須關閉。如果是單獨不成對的標簽,在標簽最後加一個"/"來關閉它。 2.所有標簽的元 ...
  • 示例html代碼: 獲得id為test的DOM對象,下麵就不一一獲取了。 test.innerHTML 描述:也就是從對象的起始位置到終止位置的全部內容,包括Html標簽。 上例中的test.innerHTML的值也就是“<span style="color:red">test1</span> te ...
  • 一、安裝node.js 方式很多npm,git等,新手建議從官網上直接去下載node的安裝包。一鍵安裝. 二、創建一個web伺服器。 三、讀取文件的方式(同步,非同步) 1.同步 2.非同步 三、事件迴圈 四、數據緩衝區 1.向緩存區寫入數據 2.讀取緩衝區的內容 3.Buffer 轉為JSON對象 4 ...
一周排行
    -Advertisement-
    Play Games
  • 示例項目結構 在 Visual Studio 中創建一個 WinForms 應用程式後,項目結構如下所示: MyWinFormsApp/ │ ├───Properties/ │ └───Settings.settings │ ├───bin/ │ ├───Debug/ │ └───Release/ ...
  • [STAThread] 特性用於需要與 COM 組件交互的應用程式,尤其是依賴單線程模型(如 Windows Forms 應用程式)的組件。在 STA 模式下,線程擁有自己的消息迴圈,這對於處理用戶界面和某些 COM 組件是必要的。 [STAThread] static void Main(stri ...
  • 在WinForm中使用全局異常捕獲處理 在WinForm應用程式中,全局異常捕獲是確保程式穩定性的關鍵。通過在Program類的Main方法中設置全局異常處理,可以有效地捕獲並處理未預見的異常,從而避免程式崩潰。 註冊全局異常事件 [STAThread] static void Main() { / ...
  • 前言 給大家推薦一款開源的 Winform 控制項庫,可以幫助我們開發更加美觀、漂亮的 WinForm 界面。 項目介紹 SunnyUI.NET 是一個基於 .NET Framework 4.0+、.NET 6、.NET 7 和 .NET 8 的 WinForm 開源控制項庫,同時也提供了工具類庫、擴展 ...
  • 說明 該文章是屬於OverallAuth2.0系列文章,每周更新一篇該系列文章(從0到1完成系統開發)。 該系統文章,我會儘量說的非常詳細,做到不管新手、老手都能看懂。 說明:OverallAuth2.0 是一個簡單、易懂、功能強大的許可權+可視化流程管理系統。 有興趣的朋友,請關註我吧(*^▽^*) ...
  • 一、下載安裝 1.下載git 必須先下載並安裝git,再TortoiseGit下載安裝 git安裝參考教程:https://blog.csdn.net/mukes/article/details/115693833 2.TortoiseGit下載與安裝 TortoiseGit,Git客戶端,32/6 ...
  • 前言 在項目開發過程中,理解數據結構和演算法如同掌握蓋房子的秘訣。演算法不僅能幫助我們編寫高效、優質的代碼,還能解決項目中遇到的各種難題。 給大家推薦一個支持C#的開源免費、新手友好的數據結構與演算法入門教程:Hello演算法。 項目介紹 《Hello Algo》是一本開源免費、新手友好的數據結構與演算法入門 ...
  • 1.生成單個Proto.bat內容 @rem Copyright 2016, Google Inc. @rem All rights reserved. @rem @rem Redistribution and use in source and binary forms, with or with ...
  • 一:背景 1. 講故事 前段時間有位朋友找到我,說他的窗體程式在客戶這邊出現了卡死,讓我幫忙看下怎麼回事?dump也生成了,既然有dump了那就上 windbg 分析吧。 二:WinDbg 分析 1. 為什麼會卡死 窗體程式的卡死,入口門檻很低,後續往下分析就不一定了,不管怎麼說先用 !clrsta ...
  • 前言 人工智慧時代,人臉識別技術已成為安全驗證、身份識別和用戶交互的關鍵工具。 給大家推薦一款.NET 開源提供了強大的人臉識別 API,工具不僅易於集成,還具備高效處理能力。 本文將介紹一款如何利用這些API,為我們的項目添加智能識別的亮點。 項目介紹 GitHub 上擁有 1.2k 星標的 C# ...