第一天,重新認識HTML的標簽元素和CSS樣式屬性,加深印象!
HTML 的標簽元素:
a | 標明超鏈接的起始或目的位置。 |
acronym | 標明縮寫詞。 |
address | 特定信息,如地址、簽名、作者、此文檔的原創者。 |
applet | 在頁面上放置可執行內容。 |
area | 定義一個客戶端圖像映射中一個超級鏈接區域的形狀、坐標和關聯 URL。 |
b | 指定文本應以粗體渲染。 |
base | 指定一個顯示 URL 用于解析對于外部源的鏈接和引用,如圖像和樣式表。 |
baseFont | 設置渲染文本時作為缺省字體的基礎字體值。 |
bdo | 允許作者為選定文本片斷禁用雙向法則。 |
bgSound | 允許頁面帶有背景聲音或創建音軌。 |
big | 指定內含文本要以比當前字體稍大的字體顯示。 |
blockQuote | 設置文本中的一段引語。 |
body | 指定文檔主體的開始和結束。 |
br | 插入一個換行符。 |
button | 指定其中所含的 HTML 要被渲染為一個按鈕。 |
caption | 指定表格的簡要描述。 |
center | 將后面的文本和圖像居中顯示。 |
cite | 用斜體顯示標明引言。 |
code | 指定代碼范例。 |
col | 指定基于列的表格缺省屬性。 |
colGroup | 指定表格中一列或一組列的缺省屬性。 |
comment | 標明不可見的注釋。 |
custom | 代表了一個用戶自定義元素。 |
dataTransfer | 提供了對于預定義的剪貼板格式的訪問,以便在拖曳操作中使用。 |
dd | 在定義列表中表明定義。定義通常在定義列表中縮進。 |
del | 表明文本已經從文檔中刪除。 |
dfn | 表明術語的定義實例。 |
dir | 引起目錄列表。 |
div | 指定渲染 HTML 的容器。 |
dl | 引起定義列表。 |
dt | 在定義列表中表明定義術語。 |
em | 強調文本,通常以斜體渲染。 |
embed | 允許嵌入任何文檔。 |
fieldSet | 在字段集包含的文本和其它元素外面繪制一個方框。 |
font | 指定用于渲染所包含文本的新字體、大小和顏色。 |
form | 指定所包含控件在表單中起作用。 |
frame | 在 FRAMESET 元素內指定單個框架。 |
frameSet | 指定一個框架集,用于組織多個框架和嵌套框架集。 |
head | 提供了關于文檔的無序信息集合。 |
hn | 以標題樣式渲染文本。 |
hr | 繪制水平線。 |
html | 表明文檔包含 HTML 元素。 |
HTML 注釋 | 避免任何內含文本或 HTML 源代碼被處理并在瀏覽器窗口中顯示。 |
i | 指定文本應以斜體渲染,若可用的話。 |
iframe | 創建內嵌浮動框架。 |
img | 在文檔中嵌入圖像或視頻剪輯。 |
IMPORT | 從元素行為中導入標簽定義。 |
input | 創建各種表單輸入控件。 |
input type=button | 創建按鈕控件。 |
input type=checkbox | 創建復選框控件。 |
input type=file | 創建文件上載控件,該控件帶有一個文本框和一個瀏覽按鈕。 |
input type=hidden | 傳輸關于客戶/服務器交互的狀態信息。 |
input type=image | 創建一個圖像控件,該控件單擊后將導致表單立即被提交。 |
input type=passWord | 創建與 INPUT type=text 控件類似的單行文本輸入控件,不過其中并不顯示用戶輸入的內容。 |
input type=radio | 創建單選鈕控件。 |
input type=reset | 創建一個按鈕,該按鈕單擊后將重置表單控件為其缺省值。 |
input type=submit | 創建一個按鈕,該按鈕單擊后將提交表單。 |
input type=text | 創建一個單行的文本輸入控件。 |
ins | 指定被插入到文檔中的文本。 |
isIndex | 使瀏覽器顯示一個對話框,提示用戶輸入單行文本。 |
kbd | 以固定字體渲染文本。 |
label | 為頁面上的其它元素指定標簽。 |
legend | 在 fieldSet 對象繪制的方框內插入一個標題。 |
li | 引起列表中的一個項目。 |
link | 允許當前文檔和外部文檔之間建立連接。 |
listing | 以固定字體渲染文本。 |
map | 包含客戶端圖像映射的坐標數據。 |
marquee | 創建一個滾動的文本字幕。 |
menu | 創建一個項目的無序列表。 |
meta | 向服務器和客戶端傳達關于文檔的隱藏信息。 |
noBR | 不換行渲染文本。 |
noFrames | 包含對于那些不支持 FRAMESET 元素的瀏覽器使用的 HTML。 |
noScript | 指定要在不支持腳本的瀏覽器顯示的 HTML。 |
object | 向 HTML 頁面中插入對象。 |
ol | 繪制文本的編號列表。 |
optGroup | 允許作者對 select 元素中的選項進行邏輯分組。 |
option | 引起 SELECT 元素中的一個選項。 |
p | 引起一段。 |
param | 設置 APPLET、EMBED 或 OBJECT 元素的屬性初始值。 |
plainText | 以固定寬度字體渲染文本,不處理標簽。 |
PRe | 以固定寬度字體渲染文本。 |
q | 分離文本中的引語。 |
rt | 指明 RUBY 元素的注音文本。 |
ruby | 指明要放置在文本串之上或內嵌的注解或發音指南。 |
s | 以刪除線字體渲染文本。 |
samp | 指定代碼范例。 |
script | 為腳本指定由腳本引擎解釋的腳本。 |
select | 引起列表框或下拉框。 |
small | 指定內含文本要以比當前字體稍小的字體顯示。 |
span | 指定內嵌文本容器。 |
strike | 以刪除線字體渲染文本。 |
strong | 以粗體渲染文本。 |
style | 指定頁面的樣式表。 |
sub | 指定內含文本要以下標的形式顯示,通常比當前字體稍小。 |
sup | 指定內含文本要以上標的形式顯示,通常比當前字體稍小。 |
table | 指定所含內容要組織成行列的表格。 |
tBody | 指明行作為表格主體。 |
td | 指定表格中的單元格。 |
textArea | 指定多行文本輸入控件。 |
tFoot | 指明行作為表尾。 |
th | 指定標題列。標題列將在單元格中居中并以粗體顯示。 |
tHead | 指明行作為表頭。 |
title | 包含文檔的標題。 |
tr | 指定表格中的一行。 |
tt | 以固定寬度字體渲染文本。 |
u | 帶下劃線渲染文本。 |
ul | 繪制文本的項目符號列表。 |
var | 定義編程變量。通常以斜體渲染。 |
wbr | 向一塊 NOBR 文本中插入軟換行。 |
在 HTML 頁面上定義一個 XML 數據島。 | |
xmp | 以固定寬度字體渲染作為示例的字體。 |
CSS屬性表
這里列出了目前支持的樣式表(CSS)標簽屬性。標有星號(*)的標簽屬性可于 Microsoft? Internet Explorer 5 中使用。標有兩個星號(**)的標簽屬性可于 Internet Explorer 5.5 中使用。帶有兩個加號(++)的標簽屬性可于 Internet Explorer 6 中使用。如果某個標簽屬性或屬性已經提交給萬維網協會(W3C)但尚未作為標準發布,則標有“已提交”。若某個標簽屬性或屬性既未提交給 W3C 也不是標準,將標有“擴展”。
CSS 標簽屬性/屬性
行為屬性 | behavior(已提交)* |
字體和文本屬性 | direction* |
| direction |
| font |
| font-family |
| font-size |
| font-style |
| font-variant |
| font-weight |
| ime-mode(已提交)* |
| layout-grid(已提交)* |
| layout-grid-char(已提交)* |
| layout-grid-line(已提交)* |
| layout-grid-mode(已提交)* |
| layout-grid-type(已提交)* |
| letter-spacing |
| line-break(已提交)* |
| line-height |
| min-height ++ |
| ruby-align(已提交)* |
| ruby-overhang(已提交)* |
| ruby-position(已提交)* |
| text-align |
| text-autospace(已提交)* |
| text-decoration |
| text-indent |
| text-justify(已提交)* |
| text-kashida-space(已提交)** |
| text-overflow ++ |
| text-transform |
| text-underline-position(擴展)** |
| unicode-bidi |
| vertical-align |
| white-space** |
| word-break(已提交)* |
| word-spacing ++(于 Macintosh 版本 4.0 中可用) |
| word-wrap(擴展)** |
| writing-mode(已提交)** |
顏色和背景屬性 | background-attachment |
| background-color |
| background-image |
| background-position |
| background-position-x(已提交) |
| background-position-y(已提交) |
| background-repeat |
| color |
版面屬性 | border |
| border-bottom |
| border-bottom-color |
| border-bottom-style |
| border-bottom-width |
| border-collapse* |
| border-color |
| border-left |
| border-left-color |
| border-left-style |
| border-left-width |
| border-right |
| border-right-color |
| border-right-style |
| border-right-width |
| border-style |
| border-top |
| border-top-color |
| border-top-style |
| border-top-width |
| border-width |
| clear |
| float |
| layout-flow(擴展) |
| margin |
| margin-bottom |
| margin-left |
| margin-right |
| margin-top |
| padding |
| padding-bottom |
| padding-left |
| padding-right |
| padding-top |
| scrollbar-3dlight-color(擴展)** |
| scrollbar-arrow-color(擴展)** |
| scrollbar-base-color(擴展)** |
| scrollbar-darkshadow-color(擴展)** |
| scrollbar-face-color(擴展)** |
| scrollbar-highlight-color(擴展)** |
| scrollbar-shadow-color(擴展)** |
| table-layout* |
| zoom(擴展)** |
分類屬性 | display |
| list-style |
| list-style-image |
| list-style-position |
| list-style-type |
定位屬性 | bottom* |
| clip |
| height |
| left |
| overflow |
| overflow-x(已提交) |
| overflow-y(已提交) |
| position |
| right* |
| top |
| visibility |
| width |
| z-index |
打印屬性 | page** |
| pageBreakAfter |
| pageBreakBefore |
濾鏡屬性 | filter(已提交) |
偽類和其它屬性 | :active |
| @charset |
| cursor |
| :first-letter** |
| :first-line** |
| @font-face |
| :hover |
| @import |
| !important |
| :link |
| @media* |
| @page** |
| :visited |
CSS 長度單位表格
相對長度單位 | |
em | 元素字體的高度。 |
ex | 字母“x”的高度。 |
px | 像素。 |
% | 百分比 |
絕對長度單位 | |
in | 英寸(1 英寸 = 2.54 厘米)。 |
cm | 厘米。 |
mm | 毫米。 |
pt | 磅(1 磅 = 1/72 英寸)。 |
pc | 皮卡(1 皮卡 = 12 磅)。 |
福利:
配上學習線路圖:

新聞熱點
疑難解答