WEB前端初學者筆記(2)--基礎標簽語法以及常見標簽


一、HTML基礎標簽語法

  • HTML 元素以開始標簽起始
  • HTML 元素以結束標簽終止
  • 元素的內容是開始標簽與結束標簽之間的內容
  • 某些 HTML 元素具有空內容(empty content)
  • 空元素在開始標簽中進行關閉(以開始標簽的結束而結束)
  • 大多數 HTML 元素可擁有屬性 

 

二、常見標簽

1.<div></div>   無實意標簽

2.<p></p>    段落標簽

3.<span></span>   無實意標簽

4.<img src=" ">  圖片標簽 src后面跟圖片地址

5.<ul> </ul> 無序列表標簽,里面用且只能用li

使用方法如下:

1 <ul> 
2 <li>aaa</li>
3 <li>bbb</li>
4 <li>ccc</li>
5 </ul>

可以使用  type 改變列表樣式(默認為黑圓圈):  type= "square(黑正方體)/ circle(空白圓圈)/ disc(黑圓圈)"-->,list-style: none;去除黑點

6.<ol></ol>有序列表標簽

1 <ol>
2 <li>aaa</li>
3 <li>bbb</li>
4 <li>ccc</li>
5 <li>ddd</li>
6 <li>eee</li>
7 </ol>

可以使用  type 改變列表樣式(默認為123):  type= "I(羅馬數字)/ a(字母表順序排序)/ 1(阿拉伯數字排序)"-->,list-style: none;去除黑點

7. <input>標簽用於搜集用戶信息,type定義不同,具體效果也就不同

例如:

 1 <input type="text" name=""> <!-- 文本框 可輸入任意東西 -->
 2 <input type="number" name=""><!-- 只能輸入數字 e表示科學計數法所以也能輸入 -->
 3 <input type="password" name=""><!-- 密碼框,默認黑點保護 -->
 4 <br><!-- 換行標簽 -->
 5 性別:
 6<input type="radio" name="gender"><!-- 單選框 --><!--name一樣代表一個主題下的單選 -->
 7<input type="radio" name="gender"><!-- 單選框 --><!--name一樣代表一個主題下的單選 -->
 8 <br><!-- 換行標簽 -->
 9 <input type="checkbox" name="gender"><!-- 復選框 --><!-- name一樣代表一個主題下的多選 -->
10 <input type="checkbox" name="gender"><!-- 復選框 --><!-- name一樣代表一個主題下的多選 -->
11 <input type="checkbox" name="gender"><!-- 復選框 --><!-- name一樣代表一個主題下的多選 -->
12 <input type="checkbox" name="gender"><!-- 復選框 --><!-- name一樣代表一個主題下的多選 -->
13 <br><!-- 換行標簽 -->
button 定義可點擊按鈕(多數情況下,用於通過 JavaScript 啟動腳本)。
checkbox 定義復選框。
file 定義輸入字段和 "瀏覽"按鈕,供文件上傳。
hidden 定義隱藏的輸入字段。
image 定義圖像形式的提交按鈕。
password 定義密碼字段。該字段中的字符被掩碼。
radio 定義單選按鈕。
reset 定義重置按鈕。重置按鈕會清除表單中的所有數據。
submit 定義提交按鈕。提交按鈕會把表單數據發送到服務器。
text 定義單行的輸入字段,用戶可在其中輸入文本。默認寬度為 20 個字符

8.<br>換行標簽,換行。

9.<a href=" "></a> 超鏈接標簽  href內寫入超鏈接地址

10.<h1>~<h6>標題標簽 共計六級

1 <h1>一級標題</h1>
2 <h2>二級標題</h2>
3 <h3>三級標題</h3>
4 <h4>四級標題</h4>
5 <h5>五級標題</h5>
6 <h6>六級標題</h6>

 

 

 

 

 

 

 

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM