ps切圖
可以使用box-shadow屬性
box-shadow: h-shadow v-shadow blur spread color inset;
專案value
h-shadow
必需 水平陰影的位置，允許負值
v-shadow
必需 垂直陰影的位置，允許負值
blur
可選 模糊距離
spread
可選 陰影的尺寸
color
陰影的顏色
inset
可選 講外部陰影（outset）改為內部陰影
盒子的陰影不占用空間，不影響布局
文字text-shadow
text-shadow : h-shadow v-shadow blur color
網頁布局的本質 將css擺放到相應的位置上
傳統網頁布局的三種方式：
普通流：標籤按照規定好的預設方式排列，即前邊所需的都是標準流
浮動定位
浮動最典型的應用就是讓多個塊級標籤一行內排列
float屬性用於建立浮動框，將其移動到一邊，直到左邊緣或右邊緣觸及包含塊或另乙個浮動框的邊緣
屬性值有 ：left（元素向左浮動）right（元素向右浮動）none（元素不浮動 預設值）
浮動元素會脫離標準流的控制（浮）移動到指定位置（動）（脫標）
浮動元素會一行內顯示並且元素頂部對齊
浮動元素會具有行內塊元素的特性
浮動的盒子不再保留原先的位置，也就是後續盒子會代替浮動盒子的位置
如果多個盒子設定了浮動，則它們會按照屬性值一行內顯示並且頂端對齊排列。浮動的元素是互相貼合在一起的（不會有縫隙，區別於行內塊），如果父級寬度裝不下這些浮動的盒子，多出的盒子會另起一行對齊（比如當縮小瀏覽器視窗時，在一行的盒子會因為寬度減小容納不下使最後浮動上來的盒子重起一行）
任何元素都可以新增浮動，新增浮動後具有行內塊元素相似的特性，如果是塊級元素，不設定寬度時會繼承父元素的寬度，浮動後如果不設定寬度高度則由內容撐開
為了約束浮動元素的位置：
先用標準流的父元素排列上下位置，之後內部子元素採取浮動排列左右位置（這時子元素以父元素為浮動標準，即將浮動元素限制在一定範圍內）
乙個盒子內有多個盒子，當其中乙個盒子浮動了，剩餘的兄弟盒子也應該要浮動，以防止發生問題，例如當第乙個盒子浮動，後續不浮動時，後邊的將會代替浮動元素的位置，同時被浮動元素代替。當第二個盒子浮動，第乙個不浮動時，第乙個盒子依然是標準流，獨佔一行，第二個盒子會浮動，但位置不會變，但是後續盒子會跑上來被覆蓋。 即浮動的盒子只會影響後邊的標準流，不會影響前邊的標準流，標準流只會不斷往上填補位置，並獨佔一行（感覺和圖層很類似，浮動後會上浮一層）
當不給盒子設定高度時，浮動內部元素，會造成盒子高度為0（浮動元素不占用空間），導致後邊的盒子會移動上來，對後面的元素排版產生影響，但有時候我們又無法設定高度（不知道其具體高度），該怎麼辦？ 我們需要清除浮動
清除浮動後，父級就會根據浮動的子盒子自動檢測高度。父級有了高度，就不會影響下邊的標準流了
語法 ：選擇器
.clearfix
優點：沒有增加標籤，結構簡單
缺點：照顧低版本瀏覽器
方法三雙偽元素清除浮動，也是給父元素新增
.clearfix
.clearfix:after,
.clearfix:before
.clearfix:after
切片切圖 裁剪 匯出為web所用格式，選中的切片
使用外掛程式cutterman
重頭學習html5 css3系列筆記（3）
復合選擇器 字型屬性 文字屬性 css 設定文字內容 字型，大小，對齊方式 的外形 寬度，邊框樣式，邊距 版面的布局和外觀顯示樣式 css美化html 讓html專注於結構 css由兩部分構成 選擇器 一條或多條宣告 css選擇器 又分基礎選擇器和復合選擇器兩大類 基礎選擇器 由單個選擇器構成，又包...
菜鳥學習HTML5 CSS3（一）
主要內容 1.新的文件型別宣告 dtd 2.新增的html5標籤 3.刪除的html標籤 4.重新定義的html標籤 一 新的文件型別宣告 dtd html 5的dtd宣告為 等也是正確的，因為html語法是不區分大小寫的。在編寫html5文件時，要求指定文件型別，以確保瀏覽器能在html5的標準模...
初學HTML5 CSS3動畫
乙個完整的css animations由兩部分構成 在css3中使用 keyframes規則來建立動畫，keyframes可以設定多個關鍵幀，每個關鍵幀表示動畫過程中的乙個狀態，多個關鍵幀就可以使動畫十分絢麗。keyframes animationname animation屬性用於描述動畫的css...