一，什么是前端
1.解決人機互動問題
2.跨終端
3.web技術堆疊
HTML（結構）
css（表現）
JavaScript（行為）
二，什么是html?
html是超文本標記語言,是用來描述web檔案的一種標記語言,使用HTML，將所需要表達的資訊按某種規則寫成HTML檔案，通過專用的瀏覽器來識別，并將這些HTML檔案“翻譯”成可以識別的資訊，即現在所見到的網頁，
三，HTML的語法
四，HTML的主體結構，
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>標題</title>
</head>
<body>
</body>
</html>
注：其中DOCTYPE是告訴瀏覽器，當前當前的文本是HTML5，html標簽 是HTML的開頭和結尾標簽，lang="en"表示語言是英文，也可以lang="zh"中文，也可以不寫，不影響，
head是HTML的頭部標簽，里面可以寫標題以及編碼等，body則是HTML的主體內容，
四，HTML的常用標簽，
1.標題標簽
從h1~h6,大小不同，例如：
<h1> h1</h1>
2.串列標簽
有序串列
<ol>
<li>阿凡達</li>
<li>泰坦尼克號</li>
<li>復仇者</li>
</ol>
無序串列
<ul>
<li>阿凡達</li>
<li>泰坦尼克號</li>
<li>復仇者</li>
</ul>
自定義串列（dt是標題，dd是內容）
<dl>
<dt>代言人</dt>
<dd>阿牛</dd>
<dt>日期</dt>
<dd>2001-07-06</dd>
</dl>
3.鏈接
<a href="https://www.baidu.com">百度</a> <!--默認在當前視窗打開鏈接-->
<a href="https://www.baidu.com" target="_blank">百度</a> <!--默認在新視窗打開鏈接-->
target屬性還有_top,_self,_parent等
4.多媒體標簽
<img src="./123.png" alt="截圖" width="400">
<audio src="./半生雪_是七叔呢.mp3" controls></audio>
<video src="./video.mp4" controls></video>
他們都是單標簽，src屬性放多媒體檔案的網址，controls屬性：播放器是否顯示控制欄，該屬性是布爾屬性，不用賦值，只要寫上屬性名，就表示打開，如果不想使用瀏覽器默認的播放器，而想使用自定義播放器，就不要使用該屬性，
5.輸入標簽
(1).input標簽
<input placeholder="請輸入name">
<input type="range">
<input type="number" min ="1",max="10" >
<input type="date">
<textarea name="" id="" cols="30" rows="10">1223</textarea>
(2).多選框
<p>
<label><input type="checkbox"></label>
<label><input type="checkbox" checked></label>
</p>
(3).單選框
<p>
<label><input type="radio" name="sport"></label>
<label><input type="radio" name="sport"></label>
</p>
注：是name在控制，給name相同屬性值，只能選一個，不能去掉，去掉后會變成多選
(4).下拉框
<p>
<select name="" id="">
<option value="">1</option>
<option value="">2</option>
<option value="">3</option>
</select>
</p>
6.文本標簽
p標簽：行標簽
em和strong:都是強調標簽，em注重語氣，strong注重內容
code:引入代碼的標簽
還有一些參考標簽，像cite,q標簽等
7.其他標簽
div和span：div和span都是容器，沒有什么意義，div常用來布局，div是塊標簽，span是行內標簽
nav：導航欄標簽
···
轉載請註明出處，本文鏈接：https://www.uj5u.com/qianduan/413458.html
標籤：其他