HTML基礎標籤及css基礎
css基礎
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title></title>
<!-- css:層疊樣式表
特點：
1.繼承性，繼承父級的某些樣式
2.層疊性，可被後來者覆蓋 -->
<link rel="stylesheet" type="text/css" href="css/main.css">
<style type="text/css">/*尖頭括號是html*/
/*頭部樣式表*/
ul{
background: yellow;
}/*此為css*/
</style>
</head>
<body>
<div style="width:100px;height:100px;background:lightblue;">
<!-- 行內樣式表，極差，不允許使用 在專案中絕對不允許這樣使用-->
</div>
<ul>
<li>aaaaaa</li>
<li class="aaa">bbbbbb</li>
<li class="aaa" id="li3">cccccc</li>
<li class="aaa">dddddd</li>
<!-- class名可以重複，id名不可以重複，當需要選中多個時用class -->
<li>eeeeee</li>
</ul>
</body>
</html>
最終效果
由此得到一個命名的方法
<!-- 駝峰命名法
大駝峰命名法XiaoMing
小駝峰命名法xiaoMing
xiao_ming
xiao-ming -->
css外部連結
li{
color: red;
}
#li3{
background: green;
color: red;
}
.aaa{
background: pink;
color: purple;
}
li{
color: lightblue !important;
}
css特徵
/*css優先順序：
1.後來者居上，越往後越說了算；
2.id>class>標籤；
3. !important優先順序最最高，不可能被後者覆蓋，不到最迫不得已不要使用；
4.頭部樣式和外部樣式
*/
/*.代表class*/
/*#代表id*/