html hyper text mark up language 扩展名是. HTML
title : 标题标签
body : 内容标签
h1 - h6 : 标题标签 自 h1 到 h6 从大到小 加粗有自己的间距
p : 段落标签
字符实体 :
空格
> 大于
< 小于
br : 换行 规范写法 <br />
div : 块标签 , 表示一块内容 并没有语义
span : 行便签 , 表示一行中的内容
这两个的作用为设置样式的时候使用
行内元素 , 语义标签
em : 语气强调词
i : 专业词汇
b : 关键词或者产品名
strong : 表示重要的内容
图片标签
img : 图片标签
属性 src 引用图片的地址
属性 alt 定义图片的名称
链接 a 标签
href : 链接地址
# 链接到本页的顶部
title : 鼠标悬停的提示文本框
target : 定义链接窗口打开位置
self : 原位置
blank : 新窗口 打开一个浏览器窗口
列表标签
有序列表 <ol><li > 有序列表 </li></ol>
一般用于排序有编号
无序列表 <ul><li > 无序列表 </li></ul>
一般用于新闻界面
定义列表
- <dl>
- <dt>
- 定义术语题目
- </dt>
- <dd>
- 定于术语解释
- </dd>
- </dl>
表格标签
table : 表格标签
border : 定义表格边框
cellpadding : 定义单元格与内容之间距离
cellspacing : 定义单元格与单元格之间距离
align : 定义对齐方式 left | center | right
tr : 行标签
th : 表头单元格
td : 普通单元格
align : 定义对齐方式 left | center | right
valign : 定义垂直对齐方式 top | middle | bottom
colspan : 设置单元格水平合并 设置值为数值
rowspan : 设置单元格垂直合并 设置值为数值
注意
p 标签和 p 标签之间自动换行
div 和 div 之间不换行
div 可以嵌套 别的标签最好不要嵌套
h1 标签为标题 爬虫爬这个
p 标签为段落
表单 form
form 的属性
action : 提交的地址
method : 提交方式 默认为 GET
label : 输入框前的内容 文字
for : 点用户名自动切换到文本框 要在 input 表单中设置 id="xxx"
textarea : 多行文本输入框
下拉文本框
- <select>
- <option>
- 下拉 1
- </option>
- <option>
- 下拉 2
- </option>
- </select>
- <input ...>
属性
type : 类型
text : 文本输入框
password : 密码输入框
radio : 单选框
checkbox : 多选框 value 要自己设置
file : 文件
submit : 提交 value : 上显文字
reset : 重置按钮
image : 定义图片作为提交按钮 src 定义图片地址 不建议使用
hidden : 定义一个隐藏表单域 用来储存值 比如储存时间 地区
name : 昵称 单选框选择一个就不能选第二个
CSS 出现之后 HTML 只用来设置结构 CSS 定义样式
引入方式
外联式:
<link rel="stylesheet" type="text/css" href="地址">
样式表 类型 .CSS 的文件地址
嵌入式: 首页使用的技巧
<style type="text/css">
指定样式的标签 {
样式..............
}
</style>
内嵌式 行内插入:(不推荐)
<a href="www.baidu.com" style="样式"> 百度 </a>
CSS 样式属性
font-size : 文字大小 20px
color : 颜色 red
font-family : 文字字体 Microsoft yahei 微软雅黑
font-style : 文字是否倾斜
italic 倾斜 em 会自动倾斜
normal 不倾斜
font-weight : 文字是否加粗 h1 等标签默认加粗
bold : 加粗
normal : 不加粗
line-height : 行高
font : 综合属性 是否加粗 字号 行高 字体按照顺序排列
text-decoration : 设置下划线 underline 有下划线 | none 去掉下划线
text-indent : 首行缩进 2 字就是 字体大小 * 2
text-align : 对齐方式 left | center | right
来源: http://www.bubuko.com/infodetail-3165086.html