CSS 指層疊樣式表 (Cascading Style Sheets)
樣式定義如何顯示 HTML 元素
樣式通常存儲在樣式表中
把樣式添加到 HTML 4.0 中,是為了解決內容與表現分離的問題
外部樣式表可以極大提高工作效率
外部樣式表通常存儲在 CSS 文件中
多個樣式定義可層疊為一
通過上面的定義可以知道,CSS就是一層一層的將HTML的進行一個裝飾,樣式通常存儲在樣式表里,外部樣式表,也就是對應微信小程序中的wxss中的內容,能夠極大的提高效率。
2.css中class定義:類選擇器;在css中使用.來命名。
這就是一個最為簡單的寫法
且可以重復的使用這個。以及通常直接命名為類也可。
結合微信小程序中的應用就是:在wxml中使用類來定義格式,在wxss中來定義這個類。
在這里面使用到各種各樣的類
在wxss中使用 .class來對類進行一個定義
以及這里有一個css的專業的教程,可以通過這個來深入的學習CSS 。http://www.w3school.com.cn/css/css_selector_class.asp
現在通過brackets,以及實驗樓平臺來學習CSS:
簡單例子
動手實踐,建立一個css目錄,并在該目錄下建立一個index.html Mycss.css文件
2.CSS高級語法:
image.png
2.繼承:子元素將繼承高級元素
3.派生選擇器:通過元素的上下關系來定義位置
image.png
4.id選擇器:可以為標有ID的HTML元素指定特定的樣式,同時在CSS中以#來定義;目前常用的ID選擇器常用語派生選擇器之下。
image.png
image.png
image.png
<head>
<meta charset="UTF-8">
<title></title>
<link rel="stylesheet" href="Mycss.css" type="text/css">
</head>
<body>
<!-- 通過不同的標簽選擇顏色,以及字體大小,以及能夠看到繼承關系-->
<h1>hello world</h1>
<a>book</a>
<h2>h2</h2>
<h3>h3</h3>
<h4>h4</h4>
<li><strong>red</strong></li>
<!-- ID標簽 -->
<p id = "pid">hello css<a href = "www.shiyanlou.com">shiyanlou</a></p>
<div id = "divid">this is div</div>
</body>
</html>
color:red;font-size:50px;
}
body{
background-repeat: no-repeat;
background-position: center;
background-image: url("man.png")}
h4{color:green;}
li strong{
color:red;
}
/*id 就是指在該文件下是唯一的*/
#pid a {
color: aqua;
}
#divid{
color: aquamarine;
}