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