HTML5權威指南筆記 24 其他css屬性和特性

2021-08-09 23:25:38 字數 2246 閱讀 9660

屬性說明值

color

設定元素的前景色

<顏色>

opacity

設定顏色的透明度

<數值>

例子:使用color屬性

color: rgba(255, 255, 255, 0.7);

color: red;

例子:使用opacity屬性

opacity: 0.4;
屬性說明值

border-collapse

設定相鄰單元格的邊框處理樣式

collapse

separate

border-spacing

設定相鄰單元格邊框的間距

1~2個長度值

caption-side

設定**標題的位置

topbottom

empty-cells

設定空單元格是否顯示邊框

hide

show

table-layout

指定**的布局樣式

auto

fixed

/*collapse值告訴瀏覽器不要為相鄰元素繪製兩個邊框*/

border-collapse: collapse;

/*先使用border-collapse設定為separate*/

border-collapse: separate;

/*然後使用border-spacing為邊框設定間距*/

border-spacing: 10px;

/*

設定為show會顯示空單元格邊框。

設定為hide會隱藏空單元格邊框。

*/empty-cells: hide;

/*

設定為top標題在上部

設定為bottom標題在下部

*/caption-side: bottom;

/*

設定為auto為自動改變**大小

設定為fixed為使用width指定**大小

*/table-layout: fixed;

width: 100%;

屬性說明值

list-style-type

指定列表中使用的標記的型別

參見3.1

list-style-image

指定影象作為列表標記

<影象>

list-style-position

指定標記相對於列表專案盒子的位置

inside

outside

list-style

設定所有列表特徵的簡寫屬性

見下面

list-style簡寫屬性的格式如下所示:

list-style:   
list-style -type屬性的值:值說明

none

沒有標記

boxcheck

circle

diamond

disc

dash

square

使用指定形狀的標記,注意並不是所有的瀏覽器都支援每一種形狀

decimal

使用十進位制數字作為標記

binary

使用二進位制數作為標記

lower-alpha

使用小寫字母字元作為標記

upper-alpha

使用大寫字母字元作為標記

例子:

ol

ul

list - style-position屬性指定標記相對於li元素內容框的位置。

inside值:定義標記位於內容框內部。

outside值:定義標記位於內容框外部。

例子:

li

.inside

cursor屬性的值:auto、crosshair 、default、help 、move 、pointer 、progress 、text 、wait 、n-resize 、s-resize 、e-resize、w-resize 、ne-resize 、nw-resize 、se-resize 、sw-resize。

例子:

#banana

HTML5權威指南 建立布局

值 說明static 預設值,普通布局 relative 元素位置相對於static定位 absolute 元素相對於position值不為static的第一位祖先元素定位 fixed 元素相對於瀏覽器視窗定位 跟報紙的排版一樣 果然如同報紙一樣!書中寫的已經有些過時了。我就找一些資料按照書上的思路...

html5權威指南 標記文字

html5權威指南 第八章 用基本的文字元素標記內容 html5權威指南 第八章 標記文字 通用容器 p some span text span p 強調重要 i am very worried warning 表示不同情緒或聲音的文字,如內心對白 表示外來語 分類學名和技術術語等 fr oh la...

HTML5與css3權威指南筆記

doctype 宣告 是html檔案中必不可少的。它位於檔案第一行。html4 html5對檔案的字符集編碼推薦使用utf 8 不允許寫結束標記的元素有 area,base,br,col,command,embed,hr,img,input,keygen,link,media source,trac...