HTML常用

 

HTML常用标签:

< font > 文字标签

< p > 段落标签

< br/ > 换行

< hr/ > 分割线

标题标签,h1最大h6最小

< h1 > < h2 > < h3 > < h4 > < h5 > < h6 >

< img > 图片标签

src 图片的路径

alt 当图片加载失败时所展示的信息

title 当鼠标悬浮上空时所展示的信息

< a > 超链接

href 用来存放需要跳转的路径,也可以使用#加上另一个标签的名字进行跳转

name 为标签设置一个名字

< table > 表格

属性:

border 设置表格边框线的粗细

width 设置表格的宽度

height 设置表格的高度

align 设置表格的水平对齐方式

cellspacing 设置边框线和单元格边框线之间的间距

cellpadding 单元格和单元格之间的间距

< tr > 表格中的行

< td > 表格中的单元格

属性:

rowspan 合并行 上下合并

colspan 和并列 左右合并

< form > 表单

属性:

action 用来添加跳转的地址 # 跳转到自己

method 数据提交方式 get 显示 post 隐示

enctype 数据提交时的编码类型

< input > 按钮

属性:

type:

text 文本

password 密码

radio 单选

checkbox 多选

buttom 点击按钮

submit 提交按钮

reset 重置按钮

< textarea > 文本域标签

属性:

cols 设置一行可以输入多少个字符,超过自动换行

rows 设置可以显示多少行,超过规定的行数出现下拉列表

disabled = "disabled" 文本无法获得焦点,无法选择,以灰色显示,在表单中不起任何作用

readonly = "readonly" 文本域可以选择,但是无法修改

< select > 下拉列表标签,标签中包含<option>标签,<option>标签为选择的内容

属性:

size 表示选择域的高度

name 选择域的名字

multiple = "multiple" 选择域可以实现多选

value 选项的值

selected = "selected" 选项默认被选中

< label > 表单说明标签

属性:

for 作用相当于ID

< fieldset > 表单分组标签

<legend> 分组时显示组名用的

< frameset > 框架集

属性:

cols: 左右分隔,使用百分比进行分隔

rews: 上下分隔,同样适用百分比分隔

例:cols="20%,*20%;

<frame> 分隔页面的显示

属性:

src 路径

< iframeset > 内联框架

属性:

src 路径

常用属性:

color 颜色

size 大小

align 水平对齐 有三个参数( left 左 ; center 中 ; right 右)

width 宽度

特殊:

<!-- --> 多行备注

&nbsp; 空格

&lt; 小于号

&gt; 大于号

&copy; 版权符号

&reg; 注册符号

文本属性:

font-family 设置字体

font-size 设置字体大小

font-style 字体倾斜 normal 不倾斜,oblique和italic 倾斜

font-weight 字体粗细

normal 正常粗细

bold 粗体

bolder 加粗体

lighter 比正常粗体细

100~900 共9个层次,数字越大,字体越粗

color 设置文本的颜色

line-height 设置字体的行高

normal 默认行高

length 设置值,可以为百分比,小数,整数,同时也允许为负值

text-transform 英文大小写的转换

none 无转换发生

capitalize 每个单词第一个字母变成大写,其他的无转换

uppercase 转换成大写

lowercase 转换成小写

text-decoration 文字的修饰效果

none 无修饰效果

underline 下划线

blink 闪烁效果

line-through 贯穿线,也就是中划线

overline 上划线效果

letter-spacing 设置文字之间的间距

normal 默认间距

length 可以设置值,允许是负数

word-spacing 设置单词之间的间距

normal 默认间距

length 可以设置值,允许为负数

text-indent 文本缩进,缩进的长度可以为负数

text-align 文本水平对齐方式

left 左对齐

right 右对齐

center 居中对齐

justify 两端对其,只针对于英文的文本,而且是多行中的非最后一行进行对齐

vertical-align 垂直方向的对齐方式

baseline 与基线对齐

top 与顶端对齐

text-top 文本对象与顶端对齐

bottom 与底端对齐

text-bottom 文本对象与底端对齐

middle 垂直方向居中对齐

背景属性:

background-color 定义背景颜色

background-image 背景图片

none 无背景图片

url 背景图片传入的路径

background-repeat 定位

repeat 背景图片左右上下平铺

repeat-x 背景图片横向平铺

repeat-y 背景图片纵向平铺

no-repeat 背景图片不进行平铺

background-attachment 背景内容是否跟着内容滚动

scroll 背景图片跟随内容滚动

fixed 背景图片不跟随内容滚动

background-position 背景图片的位置

length 可以为百分比,小数

position 可以为top,bottom,center,left,right

表格属性:

border-collapse 设置表格边框的显示方式

列表属性:

list-style-imger

none 不显示图片

url 显示图片的路径

list-style-type 属性

list-style-position 位置

outside 对外的位置

inside 对内的位置

list-style 设置属性

综合设置:

list-style: url( images/list.css.jpg ) outside ;

伪类:

a:link{ } 超链接未访问的状态

a:hover{ } 鼠标悬浮在上面的状态

a:active{ } 超链接正在访问的状态

a:visited{ } 超链接已访问的状态

盒子模型,边框:

width 边框的粗细

style 边框的样式

color 边框的颜色

width 边框宽度

height 边框高度

overflow 当内容超出定义的高度或宽度时对超出部分的处理

scroll 使用滚动条,不管内容是否超出

auto 如果超出就使用,如果不超出就不使用

hidden 超出部分被隐藏

visible 忽略宽和高

padding 内边距

margin 外边距

float 浮动属性

left 左浮动

right 右浮动

clear 是否允许有浮动

left 清除左浮动

right 清除右浮动

both 清除两侧浮动

display 定位

none 隐藏

block 定义为块元素,前后有换行,可以定义尺寸

inline 定义为行内元素,前后没有换行,不能定义尺寸

inline-block 前后没有换行,但是可以定义尺寸

position 定位

static 没有定位

absolute 绝对定位

relative 相对定位

fixed 固定定位

inherit 继承定位

top 上

bottom 下

left 左

right 右