HTML5與CSS3權威指南 pdf9

第21章 media queries相關樣式

該模組中允許新增**查詢（media query）表示式，用以指定**型別，根據**型別來選擇使用的樣式（顯示器、便攜裝置、電視機）

使用方法@media 裝置型別 and (裝置特性)

大部分裝置特性的指定值接受min/max的字首，表示大於等於或小於等於的邏輯

使用and關鍵字來指定某種裝置型別的某些特性滿足某個條件時使用的樣式，下列表示裝置視窗小於640px時所使用的樣式

@media screen and (max-width:639px)

也可以多條語句指定

@media handheld and (min-width:360px),screen and (min-width:480px)

關鍵字也可以是not或only，not表示對除...之外的其他裝置應用樣式

@media not handheld and (color)

@media all and (not color)

關鍵字only作用是對於不支援media queries但能讀取media type（@media screen）的裝置，讀取的only就會自動忽略後面的樣式（無效），而對於支援media queries的裝置，only相當於不存在（正常設定樣式）

第22章 css3的其他重要樣式和屬性

顏色相關的樣式

對rgb顏色設定alpha通道

background-color:rgba(255,0,0,0.5);

alpha通道與opacity屬性的區別：alpha通道可以對單個元素設定透明度，opacity屬性只能指定整個元素的透明度

指定顏色值為transparent，相當於使用了值為0的alpha通道

background-color:transparent;

使用者介面相關樣式

css2中定義了乙個outline屬性，用來在元素周圍繪製一條輪廓線，突出元素的目的

input#male

css3新增out-offset屬性

outline-offset:2px

正數將外輪廓擴大畫素，負數將縮小畫素

resize屬性

可以指定為如下值：none使用者不能修改元素尺寸 both可以修改元素的寬高 horizontal可以修改元素的寬度，但不能修改高度 vertical可以修改元素的高度，但不能修改元素的寬度 inherit繼承父元素的resize屬性值

取消對元素的樣式指定（變為預設值）——initial屬性值

pp#text01

注意，這個預設值為css的預設樣式，瀏覽器預設的樣式也會失效