第一天,重新认识HTML的标签元素和CSS样式属性,加深印象!
HTML 的标签元素:
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 文本中插入软换行。 |
xml | 在 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 磅)。 |
福利:
配上学习线路图:
本文暂时没有评论,来添加一个吧(●'◡'●)