01.HTML基础命令笔记
生活随笔
收集整理的這篇文章主要介紹了
01.HTML基础命令笔记
小編覺(jué)得挺不錯(cuò)的,現(xiàn)在分享給大家,幫大家做個(gè)參考.
目錄
HTML結(jié)構(gòu)
body內(nèi)常用標(biāo)簽
常用
?div與span
img
a標(biāo)簽?超鏈接標(biāo)簽
其他格式標(biāo)簽
列表
表格
表單
select標(biāo)簽
label標(biāo)簽
textarea多行文本
HTML結(jié)構(gòu)
<!DOCTYPE html> <html lang="zh-CN"> <head><meta charset="UTF-8"><title>HTML結(jié)構(gòu)</title> </head> <body></body> </html>通常編輯器輸入！，在按Enter或tab能xia顯示（vs code和pycharm）
body內(nèi)常用標(biāo)簽
常用
<b>加粗</b> <i>斜體</i> <u>下劃線</u> <s>刪除</s><p>段落標(biāo)簽</p><h1>標(biāo)題1</h1> <h2>標(biāo)題2</h2> <h3>標(biāo)題3</h3> <h4>標(biāo)題4</h4> <h5>標(biāo)題5</h5> <h6>標(biāo)題6</h6><!--換行--> <br><!--水平線--><hr>?div與span
<div>標(biāo)簽用來(lái)定義一個(gè)塊級(jí)元素，并無(wú)實(shí)際的意義</div> <div>主要通過(guò)CSS樣式為其賦予不同的表現(xiàn)</div> <span>span標(biāo)簽用來(lái)定義內(nèi)聯(lián)(行內(nèi))元素，并無(wú)實(shí)際的意義</span><span>主要通過(guò)CSS樣式為其賦予不同的表現(xiàn)</span>img
<img src="圖片的路徑" alt="圖片未加載成功時(shí)的提示" title="鼠標(biāo)懸浮時(shí)提示信息" width="寬" height="高(寬高兩個(gè)屬性只用一個(gè)會(huì)自動(dòng)等比縮放)">a標(biāo)簽?超鏈接標(biāo)簽
所謂的超鏈接是指從一個(gè)網(wǎng)頁(yè)指向一個(gè)目標(biāo)的連接關(guān)系，這個(gè)目標(biāo)可以是另一個(gè)網(wǎng)頁(yè)，也可以是相同網(wǎng)頁(yè)上的不同位置，還可以是一個(gè)圖片，一個(gè)電子郵件地址，一個(gè)文件，甚至是一個(gè)應(yīng)用程序。
<a href="http://www.taobo.com" target="_blank" >點(diǎn)我</a>target：
- _blank表示在新標(biāo)簽頁(yè)中打開(kāi)目標(biāo)網(wǎng)頁(yè)
- _self表示在當(dāng)前標(biāo)簽頁(yè)中打開(kāi)目標(biāo)網(wǎng)頁(yè)
其他格式標(biāo)簽
列表
1.無(wú)序列表
<ul type="disc"><li>第一項(xiàng)</li><li>第二項(xiàng)</li> </ul>type屬性：
- disc（實(shí)心圓點(diǎn)，默認(rèn)值）
- circle（空心圓圈）
- square（實(shí)心方塊）
- none（無(wú)樣式）
2.有序列表
<ol type="1" start="2"><li>第一項(xiàng)</li><li>第二項(xiàng)</li> </ol>type屬性：
- 1 數(shù)字列表，默認(rèn)值
- A 大寫(xiě)字母
- a 小寫(xiě)字母
- Ⅰ大寫(xiě)羅馬
- ⅰ小寫(xiě)羅馬
3.標(biāo)題列表
<dl><dt>標(biāo)題1</dt><dd>內(nèi)容1</dd><dt>標(biāo)題2</dt><dd>內(nèi)容1</dd><dd>內(nèi)容2</dd> </dl>結(jié)果為
表格
<table><thead><tr><th>序號(hào)</th><th>姓名</th><th>愛(ài)好</th></tr></thead><tbody><tr><td>1</td><td>Egon</td><td>杠娘</td></tr><tr><td>2</td><td>Yuan</td><td>日天</td></tr></tbody> </table>屬性:
- border: 表格邊框.
- cellpadding: 內(nèi)邊距
- cellspacing: 外邊距.
- width: 像素 百分比.（最好通過(guò)css來(lái)設(shè)置長(zhǎng)寬）
- rowspan: 單元格豎跨多少行
- colspan: 單元格橫跨多少列（即合并單元格）
表單
<form action="form_action.asp" method="get"><p>First name: <input type="text" name="fname" /></p><p>Last name: <input type="text" name="lname" /></p><input type="submit" value="Submit" /> </form>input
<input> 元素會(huì)根據(jù)不同的?type?屬性，變化為多種形態(tài)。
| text | 單行輸入文本 | <input type=text" /> |
| password | 密碼輸入框 | <input type="password"? /> |
| date | 日期輸入框 | <input type="date" /> |
| checkbox | 復(fù)選框 | <input type="checkbox" checked="checked"? /> |
| radio | 單選框 | <input type="radio"? /> |
| submit | 提交按鈕 | <input type="submit" value="提交" /> |
| reset | 重置按鈕 | <input type="reset" value="重置"? /> |
| button | 普通按鈕 | <input type="button" value="普通按鈕"? /> |
| hidden | 隱藏輸入框 | <input type="hidden"? /> |
| file | 文本選擇框 | <input type="file"? /> |
?屬性說(shuō)明:
- name：表單提交時(shí)的“鍵”，注意和id的區(qū)別
- value：表單提交時(shí)對(duì)應(yīng)項(xiàng)的值
- type="button", "reset", "submit"時(shí)，為按鈕上顯示的文本年內(nèi)容
- type="text","password","hidden"時(shí)，為輸入框的初始值
- type="checkbox", "radio", "file"，為輸入相關(guān)聯(lián)的值
- checked：radio和checkbox默認(rèn)被選中的項(xiàng)
- readonly：text和password設(shè)置只讀
- disabled：所有input均適用
select標(biāo)簽
<form action="" method="post"><select name="city" id="city"><option value="1">北京</option><option selected="selected" value="2">上海</option><option value="3">廣州</option><option value="4">深圳</option></select> </form>屬性說(shuō)明：
- multiple：布爾屬性，設(shè)置后為多選，否則默認(rèn)單選
- disabled：禁用
- selected：默認(rèn)選中該項(xiàng)
- value：定義提交時(shí)的選項(xiàng)值
label標(biāo)簽
定義：<label> 標(biāo)簽為 input 元素定義標(biāo)注（標(biāo)記）。
說(shuō)明：
textarea多行文本
<textarea name="memo" id="memo" cols="30" rows="10">默認(rèn)內(nèi)容 </textarea>屬性說(shuō)明：
- name：名稱
- rows：行數(shù)
- cols：列數(shù)
- disabled：禁用
?
摘抄自：https://www.cnblogs.com/liwenzhou/p/7988087.html
總結(jié)
以上是生活随笔為你收集整理的01.HTML基础命令笔记的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。
- 上一篇： C#字符串：转数组、数字
- 下一篇： powershell XML数据保存为H