超鏈接
超鏈接是HTML5中常用的鏈接之一,超鏈接可以實現(xiàn)頁面與頁面的對接
超鏈接的規(guī)范寫法
<a href="這里寫跳轉(zhuǎn)網(wǎng)址" target="_blank">給鏈接起名字</a>
關(guān)于超鏈接的小練習
<!DOCTYPE html>
<html>
<head>
<title>一曲相思</title>
<meta charset="utf-8" />
<style type="text/css"></style>
</head>
<body>
<center>
<a id="a" href="#b">去底部</input></a>
<h2>一曲相思.半陽</h2>
<hr></hr>
<h4>《一曲相思》</h4>
<a target="_blank">半陽</a>
<p>這人間裊裊炊煙</p>
<p>和風花雪月浪漫</p>
<p>癡情人多半貪戀</p>
<img src="./img/半陽一曲相思.jpg" alt="半陽組圖" width="300px" height="300px" />
<p>這人間裊裊炊煙</p>
<p>和風花雪月浪漫</p>
<p>癡情人多半貪戀</p>
<img src="https://gss1.bdstatic.com/9vo3dSag_xI4khGkpoWK1HF6hhy/baike/s%3D220/sign=ba01c9ecab1ea8d38e227306a70b30cf/0824ab18972bd407bc01adaa76899e510eb309a6.jpg" alt="半陽組圖" width="146px" height="220px" />
<p>欲問青天這人生有幾何</p>
<p>怕這去日苦多</p>
<p>往事討一杯相思喝</p>
<hr></hr>
<a id="b"href="#a">回頂部</a>
<p>友情鏈接:<a target="_blank">1</a>|<a target="_blank">2</a>|<a target="_blank">3</a></p>
</center>
</body>
</html>
錨鏈接
錨鏈接就是給超鏈接起一個唯一id
其寫法與超鏈接相似,主要用于頁面主頁面的直接跳轉(zhuǎn),比如:直接跳轉(zhuǎn)到底部或頂部。
錨鏈接的規(guī)范寫法
<a id="a" href="#b">去底部</a>
<a id="b" href="#a">去頂部</a>
CSS選擇器
作用:CSS選擇器主要用來對網(wǎng)頁中的元素進行設(shè)置樣式
CSS選擇器的規(guī)范寫法
標簽名{ }
類選擇器
作用:根據(jù)元素的class值進行選取元素
語法
.className { }
ID選擇器
作用:根據(jù)元素的id屬性值選取元素
語法
#id { }
符合選擇器(交集選擇器)
作用:可以同時使用多個選擇器,這樣可以選擇同時滿足多個選擇器的元素。
語法
選擇器1選擇器2 { }
群組選擇器(并集選擇器)
作用:可以同時使用多個選擇器,多個選擇器將被同時應用指定的樣式
語法
選擇器1,選擇器2,選擇器3 { }
通用選擇器
作用:可以選中頁面中所有的元素
語法
* { }
選擇器小練習
1,plate 元素選擇器
2,bento 元素選擇器
3,#fancyID id選擇器
4,plate apple 子元素選擇器
5,#fancy pickle
6,.small 類選擇器
7,bento.small,plate.small
8,bento orange
9,plate,bento,plate
10,*通用選擇器