1.什么是HTML?
全稱:HyperText Markup Language(超文本標記語言)。
2.空標簽
空標簽即不能包含子元素的標簽。
如:input;img;meta;link;hr;br;col;colgroup;frame;base;等。
3.可替換標簽
CSS 里,可替換元素(replaced element)的展現不是由CSS來控制的。這些元素是一類外觀渲染獨立于CSS的 外部對象。
如:img;object;video;textarea;input
audio;canvas有時候也是。
4.a
超鏈接,方法為get
常用的可選屬性如下:
href 錨(必須屬性)
<a href="url"></a> url可是絕對路徑,可相對路徑
<a href="#top"></a> 返回頁面頂部
<a href="#"> </a>刷新頁面
<a href="http://"></a> 無協議,使用當前文件協議
<a href="javascripit:;"></a>偽js協議
target
<a href="#" target="aaa"> 在aaa窗口打開
<a href="#"? target="_self"></a> 當前頁面加載
<a href="#" target="_blank"></a> 新窗口加載
<a href="#" target="_parent"></a> 父頁面加載
<a href="#" target="_top"></a> 頂級頁面加載,如祖父級,父級
download 下載
<a href="xxx.com" download>
5.ifame
鑲嵌頁面
<iframe src="xxx.com" name="xxx"><iframe>
6.form
表單
常用屬性:
action:提交到哪兒 (必須)
methoh:方法 (必須)
get:URI中以?作為分隔符,發送給服務器(會暴露)
post:發送內容出現在http第四部分。
target:
同a標簽的target
7.input
type屬性:
text:輸入文本
<input type="text">
<input type="text"? placeholder="abcd"> #默認輸入abcd
password:輸入密碼
<input type="password">
checkbox:多選
<input type="checkbox" name="g1" value="1" checked>#默認選1
<input type="checkbox" name="g1" value="2">
radio:單選
<input type="radio" name="g2" value="1" checked>#默認選1
<input type="radio" name="g2" value="2">
select:下拉選項
<select name="select" multiple>可多選
? <option value="2">1</option>
<option value="2" selected>2</option> #默認選2
<option value="3" disabled>3</option>#不能選3
</select>
file:上傳文件(accept屬性控制類型)
range:用于輸入不精確值空間
reset:將表達所有內容設置為缺省值的按鈕
search:搜索,換行會自動移除
button:當沒有submit時才會變成提交按鈕
<input type=“button” value=“button”>
<button>button</button>
sumbit:提交按鈕
<input type="sumbit" value="button">
img:圖片提交按鈕,必須使用sirc屬性以及alt代替文本
color:選擇顏色
date:選擇日期(年月日,不包括時間)
datetime:基于UTC時區的日期時間輸入空間
email:輸入email
tel:電話
textarea:文本框
<textarea>ABCD</textarea>
其他屬性:
name:控件名稱,用于提交到服務器,后端會識別
max:最大值
mix:最小值
maxlength:最大長度
disabled:不可選
accept:控制file的類型,形式如下accept=".jpg,png,doc"? 點-格式-逗號
laber
關聯input:
1.for屬性關聯input的name屬性
<laber for="xxx">XXX<laber><input type="text" name="xxx">
2.包裹inputype
<laber><input type="text"></laber>
8.table
表格
例:
<table>
???? <colgroup>
?????????? <col width=100>
???? </colgroup>
????? <thead>
??????????? <tr>
???????????????? <th>Head<1/th>
????????????????? <th>Head2</th>
???????????? </tr>
?????? </thead>
?????? <tbody>
????????????? <tr>
?????????????????? <td>1</td>
??????????????????? <td>2</td>
????????????? </tr>
?????? </tobdy>
?????? <tfoot></tfoot>
</table>
9.head
head標簽包含以下標簽:
meta:<meta charset="utf-8">
titile:窗口的標題。
base:指定一個文檔包含所有相對URL的基本URL,只能有一個。
<base href="http;//xxx.com">
<base target="_blank" >
link:引入css
<link href="xxx.css" rel="stylesheet" title="xxx">
style:使用css
<style type="text/css">
h1{color:red}
</style>
script:使用js
<script type="text/javascript">document.write("Hi")</script>
noscript :當瀏覽器不能允許js時允許。