DIV+CSS笔记(一)
CSS層疊樣式表
1.在HTML中放置CSS的幾種方式
1>內聯樣式表
1 <p style="color:red;font-family:serif">這是內聯樣式表</p>2>嵌入樣式表
1 <head> 2 <style type="text/css"> 3 body{ 4 background-color:red; 5 } 6 </style> 7 </head>3>鏈接到外部樣式表
1 <link rel="stylesheet" href="style.css" type="text/css" />樣式表優先級(就近原則):內聯 > 內嵌 > 外鏈
2.CSS選擇器
1>HTML選擇器
1 h1{color:red}2>類選擇器
1 .class1{font-size:small}3>ID選擇器
1 #id1{text-indent:3em}4>關聯選擇器
1 table a{color:red}5>組合選擇器
1 h1,h2,h3,h4,h5,h6{color:green}6>偽元素選擇器
1 a:link{color:red;} 2 a:hover{color:yellow;font-size:125%} 3 a:active{color:blue;font-size:125%} 4 a:visited{color:green;font-size:85%}選擇器優先級: 關聯選擇器 > ID選擇器 > 類選擇器 > HTML選擇器
3.CSS常見屬性
1>字體屬性
font-family、font-size、font-style、font-weight、font-variant
組合 font:[<字體風格>||<字體變形>||<字體加粗>]?<字體大小>[/<行高>]?<字體族科>
2>顏色屬性
color:blue; color:#000080; color:#0c0;
3>背景屬性
background-color、background-image、background-repeat、background-attachment、background-position
組合 background:<背景顏色>||<背景圖像>||<背景重復>||<背景附件>||<背景位置>
4>文本屬性
letter-spacing、word-spacing、text-decoration、text-align、text-indent、line-height
5>邊框屬性
border-style:none(無邊框)dotted(點線)dashed(破折線)solid(實線)double(雙框線)groove(槽線)ridge(脊線)inset(內嵌效果)outset(突起效果)
border-width邊框寬度
border-color邊框顏色
組合 border:5px solid red;
6>鼠標光標屬性
cursor屬性:?hand(小手)crosshair(交叉十字)text(文本選擇器號)wait(Windows沙漏)help(問號鼠標)
7>列表屬性
list-style-type、list-style-image、list-style-position
轉載于:https://www.cnblogs.com/yexiang520/p/5535760.html
總結
以上是生活随笔為你收集整理的DIV+CSS笔记(一)的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: iOS开发之AFNetworking 3
- 下一篇: iOS之UIview动画