学点css基础
中午時間學點css，附帶http://www.w3cschool.cc/css/css-tutorial.html這個鏈接！
???????????????????????????????????????? 中午的時間學了這些東西！如下圖:
?????????????????????????? ? ?? ???????
附帶代碼：
?
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>css_1</title> 6 </head> 7 <style> 8 p{ 9 /*這是設置顏色的*/ 10 color: red; 11 /*這是設置對齊方式的*/ 12 text-align: center; 13 14 } 15 /*CSS Id 和 Class */ 16 /*HTML元素以id屬性來設置id選擇器,CSS 中 id 選擇器以 "#" 來定義。ID屬性不要以數字開頭，數字開頭的ID在 Mozilla/Firefox 瀏覽器中不起作用。*/ 17 #para1 18 { 19 text-align: center; 20 color: red; 21 } 22 /*class 選擇器用于描述一組元素的樣式，class 選擇器有別于id選擇器，class可以在多個元素中使用。*/ 23 24 /*class 選擇器在HTML中以class屬性表示, 在 CSS 中，類選擇器以一個點"."號顯示： */ 25 .center 26 { 27 text-align: center; 28 29 } 30 31 /*-- 你也可以指定特定的HTML元素使用class。類名的第一個字符不能使用數字！它無法在 Mozilla 或 Firefox 中起作用。 */ 32 p.center 33 { 34 text-align:center; 35 } 36 /*多重樣式:如果某些屬性在不同的樣式表中被同樣的選擇器定義，那么屬性值將從更具體的樣式表中被繼承過來。/*/ 37 /*多重樣式將層疊為一個:因此，內聯樣式（在 HTML 元素內部）擁有最高的優先權，這意味著它將優先于以下的樣式聲明： 標簽中的樣式聲明，外部樣式表中的樣式聲明，或者瀏覽器中的樣式聲明（缺省值）。*/ 38 39 </style> 40 41 <body> 42 <!-- 調用P這個selector --> 43 <p>Hello World!</p> 44 <p id="para1">Hello World!</p> 45 <!-- 在以下兩個的例子中，所有擁有 center 類的 HTML 元素均為居中。 --> 46 <h1 class="center">標題居中</h1> 47 <p class="center">段落居中</p> 48 <!-- 在以下實例中, 所有的 p 元素使用 class="center" 讓該元素的文本居中: --> 49 <p class="center">This paragraph will be center-aligned</p> 50 <p style="color: sienna;margin-left: 20px;" > This is a paragraph.</p> 51 52 53 54 </body> 55 </html>?
1 /*不要在屬性值與單位之間留有空格。假如你使用 "margin-left: 20 px" 而不是 "margin-left: 20px" ， 2 它僅在 IE 6 中有效，但是在 Mozilla/Firefox 或 Netscape 中卻無法正常工作。*/ 3 hr{color: sienna;} 4 p{margin-left: 20px;} 5 body{border-image: url("/images/back40.gif");}?
轉載于:https://www.cnblogs.com/zzzzw/p/4538228.html
總結
- 上一篇： 基于HTML5手机上下滑动翻页特效
- 下一篇： Informatica bulk与nor