html簡述
1.html結構
<!DOCTYPE html><!-- 宣告此html版本為html5 -->
<html>
<head><!-- 頭部標簽(包含mate和title)-->
<meta charset="utf-8"><!-- 處理網頁的亂碼問題:設定統一的編碼格式 -->
<title>[標簽內容]</title><!-- 設定網站的標題 -->
</head>
<body>
<!-- 網頁內容 -->
</body>
</html>
2.行級標簽
1.行級標簽
? (默認占用一行)
標題標簽
? < h >(內容)< h >
? < h1 >到< h6 >共6個等級
段落標簽
? < p >
塊元素
? < div >(可以包含行級元素)
串列
? (屬于塊元素,由內容撐開)
<!-- 有序串列-->
<ol style="background: greenyellow; ">
<li>第一行</li>
<li>第二行</li>
<li>第三行</li>
</ol>
<!-- 無序串列-->
<ul>
<li>漢中</li>
<li>西安</li>
<li>北京</li>
</ul>
<!-- 串列嵌套-->
<ol>
<li>
陜西省
<ul>
<li>漢中市</li>
<li>西安市</li>
</ul>
</li>
<li>
山西省
<ul>
<li>太原市</li>
<li>運城市區</li>
</ul>
</li>
</ol>

2.行內元素
? < i >斜體 < u >下劃線 < strong >加粗 < img >圖片標簽
? < span >我是一整塊< span > 在行內把某些文字作為塊元素
<p><strong>陜西<u>省</strong>西安</u>市</p>
圖片標簽
<img src="(圖片的路徑)" alt="(對圖片的描述,圖片無法顯示時提示)">
<!-- 絕對路徑:從計算機的根目錄開始向下查找的某一個檔案下的某一個資源:D:/file/1.png,如果資源存在那么一定可以找到該資源, 也可以直接復制網頁圖片的地址
相對路徑:使用一個參照物,來定位某一個資源 上級目錄加 ../>
超鏈接
? 跳轉網頁
<a href="https://www.baidu.com" >百度</a><!-- 默認在此視窗打開 -->
<a href="https://www.taobao.com" target="_blank" >淘寶</a><!-- target:目標 再開一個視窗打開 -->
<a href="demo01.html">demo02</a><!-- 跳轉到其他網頁 -->
? 錨點
<a name="xxx">我是錨點</a><!-- 設定錨點 -->
<a href="#xxx">點擊回到錨點</a><!-- 回到錨點 -->
3.表格
? < tr >行 < td >列 < border >線寬 < width >寬度 < algin >對齊方式
? < rowspan >跨行 < colspan >跨列 < cellpandding >單元格內邊距
? < cellspacing >單元格之間的編劇
<table border="" cellspacing="" cellpadding="">
<thead><!-- 表頭 -->
<tr>
<th>編號</th>
<th>名稱</th>
<th>金額</th>
</tr>
</thead>
<tbody style="color: red;"><!-- 表身 -->
<tr><td>001</td><td>滑鼠</td><td>50</td></tr>
<tr><td>002</td><td>鍵盤</td><td>150</td></tr>
</tbody>
<tfoot><!-- 表尾 -->
<tr><td colspan="2">合計</td><td>200</td></tr><!-- 跨列合并 -->
</tfoot>
</table>

4.表單
表單元素
- action : url統一資源定位符
- method : 提交方式,(get / post)
- enctype : 編碼方式
表單控制元件
input元素 :普通文本框,密碼框,單選框,復選框,按鈕,隱藏域,檔案選擇框
其他元素 :標簽,文本域,下拉框
文本框
? value:給文本框設定的值
? maxlength:文本框的最大長度
? readonly:是否只讀,默認為true
? placeholder:設定用戶提示資訊
<form action="" method="">
用戶名:<input type="text" value="" maxlength="12" placeholder="請輸入用戶名!"/><br>
密 碼:<input type="password" value="" maxlength="16" placeholder="請輸入密碼" /><br>
手機號:<input type="text" name="" id="" value="15991629438" readonly />
</form>

選擇框(單選框;復選框)
? name:單選框和復選框的必須屬性,依靠name來實作分組的,一組單選框或者復選框name屬性值必須相同
? value:單選框或者是復選框提交到服務器時的實際值
? checked:設定默認被選中
<form action="" method="">
性別:<input type="radio" name="sex" id="" value="1" checked />男 <input type="radio" name="sex" id="" value="0" />女<br>
興趣:<input type="checkbox" name="like" id="" value="1" checked />lol <input type="checkbox" name="like" id="" value="2" />dota <input type="checkbox" name="like" id="" value="3" />cf <br>
</form>

按鈕
<form action="" method="">
<input type="button" name="" id="" value="點擊" />
<input type="submit" name="" id="" value="登錄" /><!-- 提交按鈕-->
<input type="reset" name="" id="" value="重置" /> <br><!-- 充值按鈕-->
<input type="file" name="" id="" value="" /><br><!-- 檔案選擇框-->
<input type="hidden" name="" id="" value="123" /><br><!-- 隱藏域 -->
</form>

文本域
? rows :指定文本域的行數
? cols : 指定文本域的列數
? readonly : 是否只讀
下拉框
<form action="" method="">
語言:<select>
<option value ="1">java</option>
<option value ="2">c</option>
<option value ="3">php</option>
</select><br>
</form>

標簽
? label : 關聯控制元件
? for : 給定關聯控制元件的id
<label for="rem">記住我</label>
<input type="checkbox" name="" id="rem" value="" />
(點“記住我”也能√)
轉載請註明出處,本文鏈接:https://www.uj5u.com/qianduan/246576.html
標籤:其他
