HTML 5與CSS 3權(quán)威指南（第3版 下冊(cè)）

HTML5與CSS3權(quán)威指南（第3版·下冊(cè)）讀書筆記模板01思維導(dǎo)圖讀書筆記精彩摘錄內(nèi)容摘要目錄分析作者介紹目錄0305020406思維導(dǎo)圖指南第版屬性布局樣式語(yǔ)言頁(yè)面屬性元素樣式方法使用第章圖像背景陰影字體瀏覽器值本書關(guān)鍵字分析思維導(dǎo)圖內(nèi)容摘要內(nèi)容摘要本書詳細(xì)介紹了CSS3中各種新增樣式與屬性，其中主要包括CSS3中的各種選擇器、文字與字體、背景與邊框、各種盒模型、CSS3中的布局方式、CSS3中的變形與動(dòng)畫、CSS3中與媒體類型相關(guān)的一些樣式與屬性等。同時(shí)詳細(xì)講述了這些樣式與屬性到目前為止受到了哪些瀏覽器支持，以及針對(duì)不同瀏覽器應(yīng)該怎樣在樣式代碼中正確使用各種屬性。最后詳細(xì)講解了兩個(gè)實(shí)例，第一個(gè)實(shí)例展示了如何在一個(gè)用HTML5語(yǔ)言編寫而成的頁(yè)面中綜合運(yùn)用HTML5中新增的各種結(jié)構(gòu)元素，如何對(duì)這些結(jié)構(gòu)元素綜合使用CSS3樣式；第二個(gè)實(shí)例展示了如何使用HTML5中新增的表單元素以及操作本地?cái)?shù)據(jù)庫(kù)的功能來實(shí)現(xiàn)一個(gè)具有現(xiàn)代風(fēng)格的Web應(yīng)用程序，如何在這個(gè)由HTML5語(yǔ)言編寫而成的Web應(yīng)用程序中綜合使用CSS3樣式來完成頁(yè)面的布局以及視覺效果的美化工作。讀書筆記讀書筆記終于引用了編程語(yǔ)言一樣的結(jié)構(gòu)：標(biāo)簽【屬性=值】，感覺就像：對(duì)象.屬性=值，一樣；挺好的。58—《HTML5與CSS3權(quán)威指南上》—2019/05/31介紹的很全面，但對(duì)瀏覽器兼容問題，還不夠細(xì)致！這個(gè)估計(jì)是前端開發(fā)很頭疼的，兼容大小屏幕！。這套書的上冊(cè)講解HTML部分的知識(shí)點(diǎn)寫得還可以，但是下冊(cè)講CSS得就有點(diǎn)水了。適合用來梳理一遍知識(shí)點(diǎn)，html/css多的是很多零碎的東西，我每次都是用到了Mozilla/w3school現(xiàn)查，而缺少系統(tǒng)的理解。推薦初中級(jí)前端開發(fā)看，可梳理一遍理論知識(shí)，鞏固已學(xué)技能！18-19-20-21-22-23-26這幾個(gè)章節(jié)可以細(xì)致的看一下，很多新特性，24-25用的時(shí)候再看，27-28-29還是實(shí)際操作的時(shí)候再查一下很籠統(tǒng)！。目錄分析18.2使用CSS3能做什么18.1概要介紹第18章CSS3概述18.1概要介紹18.1.1CSS3是什么18.1.2CSS3的歷史18.2使用CSS3能做什么18.2.1模塊與模塊化結(jié)構(gòu)18.2.2一個(gè)簡(jiǎn)單的CSS3示例19.1選擇器概述19.3結(jié)構(gòu)性偽類選擇器19.2屬性選擇器第19章選擇器19.5通用兄弟元素選擇器19.4UI元素狀態(tài)偽類選擇器第19章選擇器19.2屬性選擇器19.2.1屬性選擇器概述19.2.2CSS3中的屬性選擇器19.2.3靈活運(yùn)用屬性選擇器19.3結(jié)構(gòu)性偽類選擇器19.3.1CSS中的偽類選擇器及偽元素19.3.2選擇器root、not、empty和target19.3.3選擇器first-child、last-child、nth-child和nth-last-child19.3.4選擇器nth-of-type和nth-last-of-type19.3.5循環(huán)使用樣式19.3.6only-child選擇器19.4UI元素狀態(tài)偽類選擇器19.4.1偽類選擇器E:hover、E:active和E:focus19.4.2偽類選擇器E:enabled與E:disabled19.4.3偽類選擇器E:read-only與E:read-write19.4.4偽類選擇器E:checked、E:default和E:indeterminate19.4.5偽類選擇器E::selection19.4.6偽類選擇器E:invalid與E:valid19.4.7偽類選擇器E:required與E:optional19.4.8偽類選擇器E:in-range與E:out-of-range20.1使用選擇器來插入文字20.3使用content屬性來插入項(xiàng)目編號(hào)20.2插入圖像文件第20章使用選擇器在頁(yè)面中插入內(nèi)容20.1使用選擇器來插入文字20.1.1使用選擇器來插入內(nèi)容20.1.2指定個(gè)別元素不進(jìn)行插入20.2插入圖像文件20.2.1在標(biāo)題前插入圖像文件20.2.2插入圖像文件的好處20.2.3將alt屬性的值作為圖像的標(biāo)題來顯示20.3使用content屬性來插入項(xiàng)目編號(hào)20.3.1在多個(gè)標(biāo)題前加上連續(xù)編號(hào)20.3.2在項(xiàng)目編號(hào)中追加文字20.3.3指定編號(hào)的樣式20.3.4指定編號(hào)的種類20.3.5編號(hào)嵌套20.3.6中編號(hào)中嵌入大編號(hào)20.3.7在字符串兩邊添加嵌套文字符號(hào)21.1給文字添加陰影——text-shadow屬性21.2讓文本自動(dòng)換行——word-break屬性21.3讓長(zhǎng)單詞與URL自動(dòng)換行——word-wrap屬性21.4使用服務(wù)器端字體——WebFont與@font-face屬性第21章文字與字體相關(guān)樣式21.6使用rem單位定義字體大小21.5修改字體種類而保持字體尺寸不變——font-size-adjust屬性第21章文字與字體相關(guān)樣式21.1給文字添加陰影——text-shadow屬性21.1.1text-shadow屬性的使用方法21.1.2位移距離21.1.3陰影的模糊半徑21.1.4陰影的顏色21.1.5指定多個(gè)陰影21.2讓文本自動(dòng)換行——word-break屬性21.2.1依靠瀏覽器讓文本自動(dòng)換行21.2.2指定自動(dòng)換行的處理方法21.4使用服務(wù)器端字體——WebFont與@font-face屬性21.4.1在頁(yè)上顯示服務(wù)器端字體21.4.2定義斜體或粗體字體21.4.3顯示客戶端本地的字體21.4.4屬性值的指定21.5修改字體種類而保持字體尺寸不變——font-size-adjust屬性21.5.1字體不同導(dǎo)致文字大小的不同21.5.2font-size-adjust屬性的使用方法21.5.3瀏覽器對(duì)于aspect值的計(jì)算方法21.5.4font-size-adjust屬性的使用示例22.1盒的類型22.2對(duì)于盒中容納不下的內(nèi)容的顯示22.3對(duì)盒使用陰影22.4指定針對(duì)元素的寬度與高度的計(jì)算方法第22章盒相關(guān)樣式22.1盒的類型22.1.1盒的基本類型22.1.2inline-block類型22.1.3inline-table類型22.1.4list-item類型22.1.5run-in類型與compact類型22.1.6表格相關(guān)類型22.1.7none類型22.1.8各種瀏覽器對(duì)于各種盒類型的支持情況22.2對(duì)于盒中容納不下的內(nèi)容的顯示22.2.1overflow屬性22.2.2overflow-x屬性與overflow-y屬性22.2.3text-overflow屬性22.3對(duì)盒使用陰影22.3.1box-shadow屬性的使用方法22.3.2將參數(shù)設(shè)定為022.3.3創(chuàng)建盒內(nèi)陰影22.3.4對(duì)盒內(nèi)子元素使用陰影22.3.5對(duì)第一個(gè)文字或第一行使用陰影22.3.6對(duì)表格及單元格使用陰影22.4指定針對(duì)元素的寬度與高度的計(jì)算方法22.4.1box-sizing屬性22.4.2為什么要使用box-sizing屬性23.1與背景相關(guān)的新增屬性23.3使用漸變色背景23.2在一個(gè)元素中顯示多個(gè)背景圖像第23章背景與邊框相關(guān)樣式23.5使用圖像邊框23.4圓角邊框的繪制第23章背景與邊框相關(guān)樣式23.1與背景相關(guān)的新增屬性23.1.1指定背景的顯示范圍——background-clip屬性23.1.2指定背景圖像的繪制起點(diǎn)——background-origin屬性23.1.3指定背景圖像的尺寸——background-size屬性23.1.4新增的用于平鋪背景圖像的選項(xiàng)——space與round23.3使用漸變色背景23.3.1繪制線性漸變23.3.2繪制放射性漸變23.4圓角邊框的繪制23.4.1border-radius屬性23.4.2在border-radius屬性中指定兩個(gè)半徑23.4.3不顯示邊框的時(shí)候23.4.4修改邊框種類的時(shí)候23.4.5繪制四個(gè)角不同半徑的圓角邊框23.5使用圖像邊框23.5.1border-image屬性23.5.2border-image屬性的最簡(jiǎn)單的使用方法23.5.3使用border-image屬性來指定邊框?qū)挾?3.5.4指定4條邊中圖像的顯示方法23.5.5使用背景圖像24.1transform功能的基礎(chǔ)知識(shí)24.2對(duì)一個(gè)元素使用多種變形24.3使用3D變形功能24.4變形矩陣第24章CSS3中的變形處理24.1transform功能的基礎(chǔ)知識(shí)24.1.1如何使用transform功能24.1.2transform功能的分類24.2對(duì)一個(gè)元素使用多種變形24.2.1對(duì)一個(gè)元素使用多種變形的方法24.2.2指定變形的基準(zhǔn)點(diǎn)24.3使用3D變形功能24.3.13D變形功能概述24.3.2實(shí)現(xiàn)3D變形功能24.4變形矩陣24.4.1矩陣概述24.4.2變形與坐標(biāo)系統(tǒng)24.4.3計(jì)算2D變形24.4.4計(jì)算3D變形24.4.5通過矩陣執(zhí)行多重變形處理25.2Animations功能25.1Transitions功能第25章CSS3中的動(dòng)畫功能25.1Transitions功能25.1.1Transitions功能的使用方法25.1.2使用Transitions功能同時(shí)平滑過渡多個(gè)屬性值25.2Animations功能25.2.1Animations功能的使用方法25.2.2實(shí)現(xiàn)多個(gè)屬性值同時(shí)改變的動(dòng)畫25.2.3實(shí)現(xiàn)動(dòng)畫的方法25.2.4實(shí)現(xiàn)頁(yè)的淡入效果26.2盒布局26.1多欄布局第26章布局相關(guān)樣式26.4calc方法26.3彈性盒布局第26章布局相關(guān)樣式26.1多欄布局26.1.1使用float屬性或position屬性的缺點(diǎn)26.1.2使用多欄布局方式26.2盒布局26.2.1使用float屬性或position屬性時(shí)的缺點(diǎn)26.2.2使用盒布局26.2.3盒布局與多欄布局的區(qū)別26.3彈性盒布局26.3.1對(duì)多個(gè)元素使用flex屬性26.3.2改變?cè)氐娘@示順序26.3.3改變?cè)氐呐帕蟹较?6.3.4元素寬度與高度的自適應(yīng)26.3.5使用彈性盒布局來消除空白26.3.6對(duì)多個(gè)元素使用flex屬性26.3.7控制換行方式26.3.8指定水平方向與垂直方向的對(duì)齊方式26.4calc方法26.4.1calc方法概述26.4.2calc方法使用示例27.1根據(jù)瀏覽器的窗口大小來選擇使用不同的樣式27.3MediaQueries的使用方法27.2在iPhone中的顯示第27章MediaQueries相關(guān)樣式28.1顏色相關(guān)樣式28.2用戶界面相關(guān)樣式28.3使用initial屬性值取消對(duì)元素的樣式指定28.4實(shí)現(xiàn)CSS3中的濾鏡特效第28章CSS3的其他重要樣式和屬性28.1顏色相關(guān)樣式28.1.1利用alpha通道來設(shè)定顏色28.1.2alpha通道與opacity屬性的區(qū)別28.1.3指定顏色值為transparent28.2用戶界面相關(guān)樣式28.2.1輪廓相關(guān)樣式28.2.2resize屬性28.3使用initial屬性值取消對(duì)元素的樣式指定28.3.1取消對(duì)元素的樣式指定28.3.2使用initial屬性值并不等于取消樣式設(shè)定的特例28.4實(shí)現(xiàn)CSS3中的濾鏡特效28.4.1濾鏡特效概述28.4.2實(shí)現(xiàn)濾鏡特效29.2實(shí)例2：使用HTML5+CSS3來構(gòu)建Web應(yīng)用程序29.1實(shí)例1：使用HTML5中新增結(jié)構(gòu)元素來構(gòu)建頁(yè)第29章綜合實(shí)例29.1實(shí)例1：使用HTML5中新增結(jié)構(gòu)元素來構(gòu)建頁(yè)29.