資訊專欄INFORMATION COLUMN
摘要：的個人理解一概念層疊樣式表，主要由屬性和屬性值組成。如何應用內聯樣式優先級最高，但由于會造成代碼冗余及代碼更新任務龐大，一般不采用。聲明塊格式的丟失最易導致錯誤。當浮動元素無法承載子元素的時候，子元素會在下一行顯示。浮動元素的無法合并。
CSS的個人理解 一、概念
層疊樣式表，主要由屬性和屬性值（value）組成。（雖然HTML、CSS對代碼大小寫不敏感，但是屬性和屬性值對代碼大小寫是敏感的）
二、工作方式 1.工作原理由瀏覽器將CSS和html分別轉化為文檔對象，組合為DOM文檔對象模型，標記語言中的每個元素、屬性、文字片段都是DOM樹中的一個節點，再由瀏覽器轉換顯示。
2.如何應用 （1）內聯樣式優先級最高，但由于會造成代碼冗余及代碼更新任務龐大，一般不采用。
My CSS experiment
Hello World!
This is my first CSS example
（2）內部樣式表
My CSS experiment
Hello World!
This is my first CSS example
（3）外部樣式表
多帶帶建立一個.css文檔
易于代碼更新，減少代碼冗余。作為新手，這一點也是必須要做到的。
My CSS experiment
Hello World!
This is my first CSS example
三、語法內容
1.css聲明
格式：“property : value”
屬性（property）與屬性值（value）單詞拼寫采用美式標準。
格式：“{property : value; property : value;}”
“;”的丟失最易導致錯誤。
格式：“selector {property : value; property : value;}”
（1）層疊（cascade）元素選擇器 p
類選擇器 .class
ID選擇器 #id
通用選擇器 *
并且選擇器 p.class#id
并列選擇器 p,.class,#id
后代選擇器 parent son，使用空格分割兩個選擇器
子代選擇器 parent>son，使用>分割兩個選擇器
下一個兄弟選擇器 selector+selector，使用+分割兩個選擇器
之后所有兄弟選擇器 selector~selector，使用~分割兩個選擇器
selector[property]
selector[property=value]
selector[property*=value]
selector[property^=value]
selector[property$=value]
selector[property~=value]
子元素
:first-child
:nth-child()
:first-of-type
狀態
:hover
:active
(順序LVHA:link visited hover active)
:focus
::after 常用于清除浮動
::before
::first-letter
::first-line
！important（改變了CSS方式，盡量繞開！）
放在一段style中（1000）
id（100）
.class或偽類或屬性選擇器（10）
元素選擇器或偽元素選擇器（1）
后者覆蓋前者（按照順序）
這里不多敘述…………
4.布局 （1）正常布局流1）div行及元素
2）span塊級元素
float:left;
float:right;
clear:both;（清除左右浮動，該元素會換行）
*塊級元素一旦浮動之后:
1）脫離了當前文檔流，對父級元素失去了支撐的作用，后面的非浮動元素會插入到浮動元素的下面。
2）浮動元素的寬高默認由其內容所決定，但是我們可以為其指定寬高。
3）當浮動元素無法承載子元素的時候，子元素會在下一行顯示。
4）浮動元素的margin無法合并。
*浮動引發的問題:
1）子元素浮動會失去對父元素的支撐
解決方案：在所有子元素的末尾添加一個空元素，該空元素須clear:both;
2）如果為子元素的寬度指定絕對值，并且子元素具有邊框，在縮放瀏覽器的時候會錯位
解決方案：
1.box-sizing:border-box;
2..right {margin-left:100px;}
（3）定位布局
1）靜態定位
2）相對定位
相對于該元素原先位置進行移動
relative: top right bottom left
3）絕對定位
相對于該元素最近的定位父元素位置進行移動
absolute: top right bottom left
4）固定定位
fixed（4）伸縮盒布局
display:flex;
文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。
轉載請注明本文地址：http://m.hztianpu.com/yun/115903.html
摘要：前言月份開始出沒社區，現在差不多月了，按照工作的說法，就是差不多過了三個月的試用期，準備轉正了一般來說，差不多到了轉正的時候，會進行總結或者分享會議那么今天我就把看過的一些學習資源主要是博客，博文推薦分享給大家。 1.前言 6月份開始出沒社區，現在差不多9月了，按照工作的說法，就是差不多過了三個月的試用期，準備轉正了！一般來說，差不多到了轉正的時候，會進行總結或者分享會議！那么今天我就...
摘要：從現在開始，養成寫技術博客的習慣，或許可以在你的職業生涯發揮著不可忽略的作用。如果想了解更多優秀的前端資料，建議收藏下前端英文網站匯總這個網站，收錄了國外一些優質的博客及其視頻資料。 前言 寫文章是一個短期收益少，長期收益很大的一件事情，人們總是高估短期收益，低估長期收益。往往是很多人堅持不下來，特別是寫文章的初期，剛寫完文章沒有人閱讀會有一種挫敗感，影響了后期創作。 從某種意義上說，...
閱讀 1901·2021-11-15 11:38
閱讀 4972·2021-09-22 15:33
閱讀 2541·2021-08-30 09:46
閱讀 2438·2019-08-30 15:43
閱讀 1059·2019-08-30 14:16
閱讀 2318·2019-08-30 13:09
閱讀 1500·2019-08-30 11:25
閱讀 920·2019-08-29 16:42
