摘要:整理完了高性能這本書,往下就需要快速處理世界,這本講解特性的書非常值得一讀,內容完整,重點突出,實戰性強,就是語言啰嗦。由于全書內容太多,而且需要一點一點的整理,所以放到了站點上,方便大家查看。
整理完了《高性能JavaScript》這本書,往下就需要快速處理《CSS世界》,這本講解CSS特性的書非常值得一讀,內容完整,重點突出,實戰性強,就是語言啰嗦。由于全書內容太多,而且需要一點一點的整理,所以放到了站點上,方便大家查看。
站點地址:全棧開發CSS世界 第1章 概述
原文鏈接:CSS世界,豆瓣讀書:CSS世界
流體布局
table
CSS3
第2章 術語和概念未定義行為
第3章 流、元素和基本概念
塊級元素
為什么list-item元素會出現項目符號
display: inline-table;的盒子是怎樣組成的
width/height作用在哪個盒子上
width/height作用的具體細節
深藏不漏的width:auto
width值作用的細節
CSS流體布局下的寬度分離原則
改變width/height作用細節的box-sizing
相對簡單的height:auto
關于height:100%
min-width/max-width和min-height/max-height
為流體而生的min-width/max-width
與眾不同的初始值
超越!important,超越最大
任意高度元素的展開收起動畫技術
內聯元素
哪些元素是內聯元素
內聯盒模型
幽靈空白節點
第4章 盒尺寸四大家族
深入理解content
content與替換元素
content內容生成技術
溫和的padding屬性
padding與元素的尺寸
padding的百分比值
標簽元素內置的padding
padding與圖形繪制
激進的margin屬性
margin與元素尺寸以及相關布局
margin的百分比值
margin合并
margin:auto
margin無效情形解析
功勛卓著的border屬性
為什么border-width不支持百分比值
了解各種border-style類型
border-color和color
border與透明邊框技巧
border與圖形構建
border等高布局技術
第5章 內聯元素與流
字母x
字母x與CSS世界的基線
字母x與CSS中的x-height
字母x與CSS中的ex
內聯元素的基石line-height
內聯元素的高度之本——line-height
為什么line-height可以讓內聯元素“垂直居中”
深入line-height的各類屬性值
內聯元素line-height的“大值特性”
line-height的好朋友vertical-align
vertical-align家族基本認識
vertical-align作用前提
vertical-align和line-height之間的關系
深入理解vertical-align線性類屬性值
深入理解vertical-align文本類屬性值
簡單了解深入理解vertical-align線性類屬性值上標下標類屬性值
無處不在的vertical-align
基于vertical-align屬性的水平垂直居中彈框
第6章 流的破壞與保護
魔鬼屬性float
float的本質與特性
float的作用機制
float更深入的作用機制
float與流體布局
float的天然克星clear
什么是clear屬性
成事不足敗事有余的clear
CSS世界的結界——BFC
BFC的定義
BFC與流體布局
最佳結界overflow
overflow裁剪界線border box
了解overflow-x和overflow-y
overflow與滾動條
依賴overflow的樣式表現
overflow與錨點定位
float的兄弟position:absolute絕對定位
absolute的包含塊
具有相對特性的無依賴absolute絕對定位
absolute與text-align
absolute與overflow
absolute與clip
重新認識的clip屬性
深入了解clip的渲染
absolute的流體特性
當absolute遇到left/top/right/bottom屬性
absolute的流體特性
absolute的margin:auto居中
position:relative才是大哥
relative對absolute的限制
relative與定位
relative的最小化影響原則
強悍的position:fixed固定定位
position:fixed不一樣的“包含塊”
position:fixed的absolute模擬
position:fixed與背景鎖定
第7章 層疊規則z-index
層疊上下文和層疊水平
理解元素的層疊順序
牢記層疊準則
深入了解層疊上下文
特定
創建
層疊上下文與層疊順序
z-index負值深入理解
z-index準則
第8章 文本處理能力
line-height的另一個朋友font-size
font-size和vertical-align的隱秘故事
理解font-size與ex、em和rem的關系
理解font-size的關鍵字屬性值
font-size:0與文本的隱藏
字體屬性家族font-family
了解襯線字體和無襯線字體
等寬字體的實踐價值
中文字體和英文名稱
一些補充說明
字體家族其他成員
font-weight
font-style
font-variant
font屬性
縮寫的font屬性
使用關鍵字值得font屬性
font關鍵字屬性值的應用價值
@font face規則
@font face的本質是變量
@font face與字體圖標技術
文本的控制
text-indent與內聯元素縮進
letter-spacing與字符間距
word-spacing與單詞間距
了解word-break和word-wrap的區別
white-space與換行和空格的控制
text-align與元素對齊
如何解決text-decoration下劃線和文本重疊的問題
text-transform字符大小寫
了解:first-letter/:first-line偽元素
深入:first-letter偽元素及其實例
:first-line偽元素
第9章 元素的修飾與美化
color
顏色關鍵字
不支持的transparent關鍵字
不支持的currentColor變量
不支持的rgba顏色和hsla顏色
支持卻雞肋的系統顏色
background
隱藏元素的background-image到底加不加載
與眾不同的background-position百分比計算方式
background-repeat與渲染性能
外強中干的background-attachment:fixed
background-color背景色永遠是最低的
利用多背景的屬性hack小技巧
漸變背景和rgba背景色的兼容處理
第10章 元素的顯示與隱藏display與元素的顯示/隱藏
visibility與元素的顯示/隱藏
不僅僅是保留空間
了解visibility:collapse
第11章 用戶界面樣式
和border形似的outline屬性
絕不可以在全局設置outline:0 none
真正不占據空間的outline及其應用
光標屬性cursor
琳瑯滿目的cursor屬性值
自定義光標
第12章 流向的改變
改變水平流向的direction
direction簡介
direction的黃金搭檔unicode-bidi
writing-mode
writing-mode原來的作用
writing-mode改變了哪些規則
writing-mode和direction的關系
文章版權歸作者所有,未經允許請勿轉載,若此文章存在違規行為,您可以聯系管理員刪除。
轉載請注明本文地址:http://specialneedsforspecialkids.com/yun/116858.html
摘要:而在文檔流中,如果浮動元素和跟隨元素都是元素,它們兩在默認情況下都將占據一行。而由于浮動元素脫離了文檔流,如果父元素沒有指定高度或者其他元素撐起,也就出現了所謂的浮動元素的父元素高度塌陷。 為什么要寫《重塑你的CSS世界觀》系列文章 由于從工作到現在,我的主要工作都是寫JavaScript,幾乎沒怎么碰CSS,通常都是別人寫好界面,然后我來開發JavaScript邏輯代碼,這導致了嚴重...
摘要:而在文檔流中,如果浮動元素和跟隨元素都是元素,它們兩在默認情況下都將占據一行。而由于浮動元素脫離了文檔流,如果父元素沒有指定高度或者其他元素撐起,也就出現了所謂的浮動元素的父元素高度塌陷。 為什么要寫《重塑你的CSS世界觀》系列文章 由于從工作到現在,我的主要工作都是寫JavaScript,幾乎沒怎么碰CSS,通常都是別人寫好界面,然后我來開發JavaScript邏輯代碼,這導致了嚴重...
摘要:在年月,在經過多方的討論之后,推出了。這一規范一出現就引起了各方的注意,隨即公司和公司紛紛表示自己的瀏覽器能夠支持。這個特殊規則是將設置為,將設置為。 作者:陳大魚頭 github: KRISACHAN HTML的誕生 HTML是怎么來的? 在1982年的時候,萬維網的發明者Tim Berners-Lee爵士為了讓全世界的物理學家能夠方便的進行合作與信息共享,造了HTML(Hype...
摘要:在年月,在經過多方的討論之后,推出了。這一規范一出現就引起了各方的注意,隨即公司和公司紛紛表示自己的瀏覽器能夠支持。這個特殊規則是將設置為,將設置為。 作者:陳大魚頭 github: KRISACHAN HTML的誕生 HTML是怎么來的? 在1982年的時候,萬維網的發明者Tim Berners-Lee爵士為了讓全世界的物理學家能夠方便的進行合作與信息共享,造了HTML(Hyp...
閱讀 3400·2021-11-24 10:30
閱讀 3269·2021-11-22 15:29
閱讀 3706·2021-10-28 09:32
閱讀 1254·2021-09-07 10:22
閱讀 3336·2019-08-30 15:55
閱讀 3619·2019-08-30 15:54
閱讀 3494·2019-08-30 15:54
閱讀 2833·2019-08-30 15:44