資訊專欄INFORMATION COLUMN
摘要：是也是一種標記語言主要用于設置頁面中的文本內容字體大小對齊方式等圖片的外形寬高邊框樣式邊距等以及版面的布局和外觀顯示樣式。規則由兩個主要的部分構成選擇器以及一條或多條聲明。選擇器和類選擇器最大的不同在于使用次數上。
CSS 是層疊樣式表 ( Cascading Style Sheets ) 的簡稱.
有時我們也會稱之為 CSS 樣式表或級聯樣式表。
CSS 是也是一種標記語言
CSS 主要用于設置 HTML 頁面中的文本內容（字體、大小、對齊方式等）、圖片的外形（寬高、邊框樣式、邊距等）以及版面的布局和外觀顯示樣式。
CSS 讓我們的網頁更加豐富多彩，布局更加靈活自如。簡單理解：CSS 可以美化 HTML , 讓 HTML 更漂亮， 讓頁面布局更簡單。
CSS 最大價值: 由 HTML 專注去做結構呈現，樣式交給 CSS，即 結構 ( HTML ) 與樣式( CSS ) 相分離
1.使用 HTML 時，需要遵從一定的規范，CSS 也是如此。要想熟練地使用 CSS 對網頁進行修飾，首先需要了解CSS 樣式規則。
2.CSS 規則由兩個主要的部分構成：選擇器以及一條或多條聲明。
1.選擇器是用于指定 CSS 樣式的 HTML 標簽，花括號內是對該對象設置的具體樣式
2.屬性和屬性值以“鍵值對”的形式出現
3.屬性是對指定的對象設置的樣式屬性，例如字體大小、文本顏色等
4.屬性和屬性值之間用英文“:”分開
5.多個“鍵值對”之間用英文“;”進行區分
例如：
所有的樣式，都包含在 <style> 標簽內，表示是樣式表。<style> 一般寫到 </head> 上方
<head>
<style>
h4 {
color: blue;
font-size: 100px;
}
</style>
</head> 1. 樣式格式書寫
1.緊湊格式
h3 { color: deeppink;font-size: 20px;}
2.展開格式
h3 {
color: pink;
font-size: 20px;
}
強烈推薦第二種格式， 因為更直觀。
2. 樣式大小寫風格
1.小寫格式
h3 {
color: pink;
}
2.大寫格式
H3 {
COLOR: PINK;
}
強烈推薦樣式選擇器，屬性名，屬性值關鍵字全部使用小寫字母，特殊情況除外。
3. 樣式空格風格
1. h3 {
color: pink;
}
屬性值前面，冒號后面，保留一個空格
選擇器（標簽）和大括號中間保留空格答：選擇器(選擇符)就是根據不同需求把不同的標簽選出來這就是選擇器的作用。 簡單來說，就是選擇標簽用的。
找到所有的 h1 標簽。 選擇器（選對人） 設置這些標簽的樣式，比如顏色為紅色（做對事）。
基礎選擇器又包括：標簽選擇器、類選擇器、id 選擇器和通配符選擇器
標簽選擇器：
標簽選擇器（元素選擇器）是指用 HTML 標簽名稱作為選擇器，按標簽名稱分類，為頁面中某一類標簽指定統一的 CSS 樣式。
標簽選擇器（元素選擇器）是指用 HTML 標簽名稱作為選擇器，按標簽名稱分類，為頁面中某一類標簽指定統一的 CSS 樣式。
類選擇器：
如果想要差異化選擇不同的標簽，多帶帶選一個或者某幾個標簽，可以使用類選擇器.
語法：
.類名 {
屬性1: 屬性值1;
...
}
結構需要用class屬性來調用 class 類的意思
<div class="類名"> 變紅色 </div>1.如果想要差異化選擇不同的標簽，多帶帶選一個或者某幾個標簽，可以使用類選擇器。
2.類選擇器在 HTML 中以 class 屬性表示，在 CSS 中，類選擇器以一個點“.”號顯示。
3.類選擇器使用“.”（英文點號）進行標識，后面緊跟類名（自定義，我們自己命名的）。
4.可以理解為給這個標簽起了一個名字，來表示。
5.長名稱或詞組可以使用中橫線來為選擇器命名。
6.不要使用純數字、中文等命名，盡量使用英文字母來表示。
7.命名要有意義，盡量使別人一眼就知道這個類名的目的。
8.命名規范：見附件（ Web 前端開發規范手冊.doc）
我們可以給一個標簽指定多個類名，從而達到更多的選擇目的。 這些類名都可以選出這個標簽.
簡單理解就是一個標簽有多個名字.
多類名的具體使用： 1. <div class="red font20">亞瑟</div> 注意： 1.在標簽class 屬性中寫 多個類名 2.多個類名中間必須用空格分開 3.這個標簽就可以分別具有這些類名的樣式
id 選擇器可以為標有特定 id 的 HTML 元素指定特定的樣式。
HTML 元素以 id 屬性來設置 id 選擇器，CSS 中 id 選擇器以“#" 來定義。
語法：
#id名 {
屬性1: 屬性值1;
...
}注意：id 屬性只能在每個 HTML 文檔中出現一次
id選擇器和類選擇器的區別：
1.類選擇器（class）好比人的名字，一個人可以有多個名字，同時一個名字也可以被多個人使用。
2.id 選擇器好比人的身份證號碼，全中國是唯一的，不得重復。
3.id 選擇器和類選擇器最大的不同在于使用次數上。
4.類選擇器在修改樣式中用的最多，id 選擇器一般用于頁面唯一性的元素上，經常和 JavaScript 搭配使用。
* {
屬性1: 屬性值1;
...
}
通配符選擇器不需要調用， 自動就給所有的元素使用樣式
特殊情況才使用，后面講解使用場景(以下是清除所有的元素標簽的內外邊距,后期講)
* {
margin: 0;
padding: 0;
}CSS 使用 font-size 屬性定義字體大小。
語法：
p {
font-size: 20px;
}1.px（像素）大小是我們網頁的最常用的單位
2.谷歌瀏覽器默認的文字大小為16px
3.不同瀏覽器可能默認顯示的字號大小不一致，我們盡量給一個明確值大小，不要默認大小
4.可以給 body 指定整個頁面文字的大小
CSS 使用 font-weight 屬性設置文本字體的粗細。
語法：
p {
font-weight: bold;
}CSS 使用 font-style 屬性設置文本的風格。
p {
font-style: normal;
}body { font: font-style font-weight font-size/line-height font-family;}使用 font 屬性時，必須按上面語法格式中的順序書寫，不能更換順序，并且各個屬性間以空格隔開 不需要設置的屬性可以省略（取默認值），但必須保留 font-size 和 font-family 屬性，否則 font 屬性將不起作用。
文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。
轉載請注明本文地址：http://m.specialneedsforspecialkids.com/yun/1378.html
摘要：注本文首發于個人博客學習筆記。最近看了下變量，又名自定義屬性，跟大家分享一下我的學習筆記。使用自定義屬性來設置變量名，并使用特定的來訪問。二學習筆記聲明調用聲明方式變量聲明的方式非常簡單，如下，聲明了一個名叫的變量。 注：本文首發于個人博客 《CSS Variables學習筆記》。 最近看了下CSS Variables（CSS變量，又名CSS自定義屬性），跟大家分享一下我的學習筆記。 ...
摘要：中添加同樣起作用。說明提供的命令，打包時模塊綁定的加載器為命令，監聽打包的文件，只要改變自動會打包命令窗口顯示打包進度命令窗口列出引入的所有模塊命令窗口顯示打包引入模塊的原因 標注：本筆記來自 imooc-qbaty老師-webpack深入與實戰gitbash（or CMD）進行命令操作 一、準備工作 lenovo@lenovo-PC MINGW64 ~ $ cd /d/imooc/ ...
摘要：指普通的規則，由選擇器和屬性指定構成的規則。用于跟命名空間配合的一個規則，表示內部的選擇器全都帶上特定命名空間。注意屬性不允許使用連續的兩個中劃線開頭，否則會被認為是變量。 筆記說明 重學前端是程劭非（winter）【前手機淘寶前端負責人】在極客時間開的一個專欄，每天10分鐘，重構你的前端知識體系，筆者主要整理學習過程的一些要點筆記以及感悟，完整的可以加入winter的專欄學習【原文有...
摘要：指普通的規則，由選擇器和屬性指定構成的規則。用于跟命名空間配合的一個規則，表示內部的選擇器全都帶上特定命名空間。注意屬性不允許使用連續的兩個中劃線開頭，否則會被認為是變量。 筆記說明 重學前端是程劭非（winter）【前手機淘寶前端負責人】在極客時間開的一個專欄，每天10分鐘，重構你的前端知識體系，筆者主要整理學習過程的一些要點筆記以及感悟，完整的可以加入winter的專欄學習【原文有...
摘要：指普通的規則，由選擇器和屬性指定構成的規則。用于跟命名空間配合的一個規則，表示內部的選擇器全都帶上特定命名空間。注意屬性不允許使用連續的兩個中劃線開頭，否則會被認為是變量。 筆記說明 重學前端是程劭非（winter）【前手機淘寶前端負責人】在極客時間開的一個專欄，每天10分鐘，重構你的前端知識體系，筆者主要整理學習過程的一些要點筆記以及感悟，完整的可以加入winter的專欄學習【原文有...
閱讀 730·2023-04-25 19:43
閱讀 3974·2021-11-30 14:52
閱讀 3801·2021-11-30 14:52
閱讀 3865·2021-11-29 11:00
閱讀 3796·2021-11-29 11:00
閱讀 3894·2021-11-29 11:00
閱讀 3571·2021-11-29 11:00
閱讀 6154·2021-11-29 11:00
