HTML常用代码总结

来源：互联网发布：c 做单片机上位机编辑：程序博客网时间：2024/05/17 22:52

第二章
<body>
作用：

属性：alink 活动链接颜色

background 背景图

bgcolor 背景颜色

link 链接颜色

style

vlink 已访问链接颜色

leftmargin 左边距

topmargin 上边距

<font>
作用：
常用属性：face 设置字体
size 大小
color 颜色

<h1><h2><h3><h4><h5><h6>
作用;标题字体
常用属性：color 颜色
align 对齐方式
width 宽度
size 高度
<p>
作用：段落标记
常用属性：align 对齐方式

<br>
作用;分行
常用属性;

<hr>
作用：分割线
常用属性;color 颜色

<b>
作用;粗体

<u>
作用;下划线

<i>
作用：斜体

<sup>
作用：上标

<sub>
作用：下标

<tt>
作用：等宽字体

<s>
作用：删除线

第三章
<img>
作用：图片
常用属性：src 图片的位置
width 宽度、像素

align 对齐方式
height 高度
border 边框
Alt 提示文字
hspace 水平边距
vspace 垂直边距

第四章
<a>
作用：超链接
常用属性：href 链接地址
name 命名锚记
target 目标（ -blank ，-parent，-self，-top）

第五章
<ul>
作用：无序列表
属性：type 类型（circle，disc，square）

<ol>
作用：有序列表
属性：type 类型（1，a，A,i，I） start 开始

<li>
作用：列表项

<dl>
作用：定义列表

<dt>
作用：列表标题

<dd>
作用：解释名词

第六章
<table>
作用：表格
属性：width 宽度
border 边框粗细
bordercolor 边框颜色
bordercolorlight 亮边框颜色
bordercolordark 暗边框颜色
bgcolor 背景颜色
background 背景图片
height 高度
cellspacing 单元格边距
cellpadding 单元格间距
valign 垂直对齐方式（top，Middle，bottom，baseline）

<caption>
作用：表格标题

<tr>
作用：表格的行

<td>
作用：表格的列
属性：colspan 列合并
rowspan 行合并

<th>
作用;表格的表头
属性：colspan 列合并
rowspan 行合并

第七章
<form>
作用：表单
属性：id 名称
name 名称
method 方法（get，post）
action 处理程序
enctype 编码
target 目标

<input>
作用：插入
属性： type 类型（radio 单选框 password 密码框 checkbox 复选框 submit 提交按钮 Reset 重置 button 按钮 img 图像域 hidden 隐藏域 file 文件域）
name 名称
id 文本域id
size 宽度
maxlength 输入最多字符
value 初始值

<textarea>
作用;多行文本域

<select>
作用：下拉列表
属性; name 名称
multiple 允许多个选项
size 定义行数

<option>
作用：下拉列表选项
属性;value 选项值

第八章
<frameset>
作用：框架布局
属性：rows 行框架
cols 列框架

<frame>
作用：框架
属性; src 链接地址
scrolling 滚动条（yes，no，auto 自动添加）
marginwidth 边缘宽度
marginheight 边缘高度
frameborder 框架边框

<iframe>
作用：内联框架
属性：src 链接路径
name名称
width 框架宽度
height 框架高度
align 位置关系

第十章
1. CSS样式表：内部样式，外部样式
内部样式表：
在<head></head>之间，用<style></style>包围如，
<head>
<title></title>
<style type="text/css">
p{
text-align：center; /*文字居中*/}
</style>
</head>
2. 外部样式表
用HTML中的<link>链接
<link rel="stylesheet" type="text/css" href="main.css"/>
用CSS自身语言@import指令链接
<style type="text/csss">
@import url(main.css);
</style>

第十一章
标签选择器：p{color;font-size;text-align}
类选择器：.center{ text-align:center;} <p class="center">
id选择器：#banner{width:488px;height:60px; } <p id="banner">
群选择器:h1,p,.red,#banner{font-size:32px}
通配符选择器:*{margin:0;padding:0; /*将网页中所有标签的内外编剧设置为0*/}
派生选择器：p a{font-size:20px}
a{font-size:12px}
选择器的继承：内部标签继承外部标签的样式性质。
选择器的层叠：多个标签同时使用，浏览器会采用“最近的样式优先”原则
选择器的优先级：p标记行内部样式大于内部样式，内部样式大于id选择器值，id选择器大于类选择器值，类选择器值大于伪类值，伪类值大于标签选择器。
伪类;
a:link
a:visited
a:hover
a:active

第十二章
设置字体：用font-family设置所需的字体
文字颜色：用color代码设置颜色
修改字号：在font-size中设置字号，系统默认尺寸是100%即16px
斜体和粗体：
1. font-style取值
normal 正常
italic 斜体显示
oblique 比斜体倾斜角度更大
2. font-weight取值
normal 正常
bold 粗体
bolder 加粗体
lighter 细体

格式化字母
1. text-transform取值
none 无变化
capitalize 首字母大写
uppercase 字母全部大写
lowercase 字母全部小写
2. font-variant取值
normal 正常
small-caps 定义小型的大写字母

文本修饰
text-decoration取值
none 无下划线
underline 有下划线
overline 有上划线
line-through 删除线
blink 闪烁

调整行高（line-height）
css默认行高是120%
可以用像素（px），em或百分比来设定行高

综合设置字体属性
font取值
font-style 字体样式
font-variant 小型大写字母
font-weight 字体加粗
font-size 字体大小
line-height 行高
font-family 字体名称

第十三章
背景颜色 background（color，transparent 透明的）
背景图片 background-image
图片重复方式
background-repeat取值
no-repeat 只显示一张
repeat-x 水平方向平铺
repeat-y 垂直方向平铺
repeat 平铺所有地方

背景图片位置 background-position取值
top left 上左
top center 上中
top right 上右
left center 左中
center center 正中
right center 右中
bottom left 下左
bottom center 下中
bottom right 下右
背景附件 background-attachment属性为：scroll滚动，fixed固定

第十四章
调整单词间距 word-spacing
调整字符间距 letter-spacing
垂直对齐 vertical-align取值
baseline 与基线齐平
sub 垂直对齐文本的下标
super 垂直对齐文本的上标
top 内容与顶端齐平
text-top 文本与顶端齐平
middle 内容在中部
bottom 内容与底部齐平
text-bottom 文本与底部齐平

文本对齐方式 text-align取值
left 左对齐
center 居中对齐
right 右对齐
justify 两端对齐

段落缩进 text-indent用来控制网页段落首行缩进，用px和em设定
处理空白区 white-space取值
normal 默认，自然换行
pre 保留换行和空白
nowrap 不允许换行
pre-wrap 超出容器范围，自动换行
pre-line 连续空格会被看做一个空格

显示 display取值
none 元素不显示
block 显示为块级元素
inline 默认
inline-block 行内块元素
list-item 列表显示
table-row 表格行显示
table-cell 表格单元格显示7
table-caption 表格标题显示

第十五章
边框样式属性取值
none 没有边框
dotted 点线式边框
dashed 破折线式边框
solid 直线式边框
double 双线式边框
groove 槽线式边框
ridge 脊线式边框
inset 内嵌式边框
outset 突起效果的边框

边框宽度属性关键词取值
thin 细边框
medium 中等边框，默认值
thick 粗边框

清除属性取值
left 左边不允许有浮动元素
right 右边不允许有浮动元素
both 左右两边都不允许有浮动元素
none 默认值，关闭清除属性，左右两边允许有浮动元素

第十六章
常见的块级标签
address 地址
blockquote 块引用
center 居中
dir 目录列表
div 盒子
form 表单
dl 定义列表
h1-6 1-6号标题
hr 水平分隔线
menu 菜单列表
ol 有序列表
p 段落
pre 格式化文本
table 表格
ul 无序列表
li 列表选项

常见的内联
a 链接
br 换行
em 强调
font 字体
i 斜体
img 图片
input 输入框
label 表格标签
select 项目选择
span 常用内联容器
strong 粗体
sub 下标
sup 上标
textarea 文本区域
u 下划线
button 按钮
iframe 内联框架

css页面模板命名规范
header 头
content 内容
nav 导航
sidebar 侧栏
column 栏目
wrapper 外围控制整体宽度
left right center 左右中
loginbar 登录条
logo 标志
banner 广告
main 页面主体
hot 热点
news 新闻
download 下载
subnav 子导航
menu 菜单
submenu 子菜单
search 搜索
friendlink 友情链接
footer 页脚
copyright 版权
scroll 滚动

第十七章
list-style-type属性取值
disc 实心圆形点
circle 空心圆圈
square 正方形
decimal 十进制数字
decimal-leading-zero 十进制数字，不足两位的前面补0
lower-roman 小写罗马文字
upper-roman 大写罗马文字
lower-alpha 小写英文字母
upper-alpha 大写英文字母
none 无

第十八章
position属性取值
absolute 绝对位置
fixed 固定位置
relative 相对位置
static 默认设置

鼠标指针关键字取值
auto 默认值
crosshair 十字
pointer 手指形
wait 当前程序正忙
help 可得到帮助
text 文字内容
move 移动
n-resize 向上改变大小
s-resize 向下改变大小
e-resize 向右改变大小
w-resize 向左改变大小
ne-resize 向上右改变大小
nw-resize 向上左改变大小
se-resize 向下右改变大小
sw-resize 向下左改变大小
not-allowed 禁止
progress 处理中
default 正常状态

滤镜属性取值
alpha 透明层次
blendtrans 淡入淡出效果
blur 模糊效果
chroma 颜色透明
dropshadow 固定影子
fliph 水平镜像
flipv 垂直镜像
glow 外光辉
gray 图片灰度化
invert 反色
light 创建光源
mask 创建透明掩膜
revealtrans 动态效果
shadow 偏移固定影子
wave 波纹效果
xray 如被x光照射

alpha滤镜参数
opacity 透明度
finishopacit 渐透明效果
style 透明区形状特征
startx x坐标开始透明效果
starty y坐标开始透明效果
finishx x坐标结束透明效果
finishy y坐标结束透明效果

blur滤镜参数
add 印象派模糊效果（true 显示 false 不显示）
direcition 设置模糊的方向
strength 代表宽度像素受到影响

dropshadow 滤镜参数
color 投射阴影颜色
offx 水平方向阴影偏移量
offy 垂直方向阴影偏移量
positive 布尔值

wave滤镜参数
add 布尔值是否以波形样式打乱
freq 设置波形频率
lightstrength 增强波纹光影效果
strength 正弦波的振幅大小

十九章
链接四种状态
a:link 链接初始状态
a:visited 访问后状态
a:hover 鼠标移到链接的颜色
a:active 鼠标动作改变颜色
text-decoration；none 取消下划线
text-align（left right center justify）水平方向对齐
border-collapse:collapse 消除双边框

0 0