目录
注释标签
标题标签 h1-h6
段落标签
换行标签
格式化标签
加粗:strong 标签和 b 标签
倾斜:em 标签和 i 标签
删除线: del 标签 和 s 标签
下划线:ins 标签 和 u 标签
图片标签:img 单标签
src属性:
alt属性:
title属性:
width属性:
height属性:
border属性:
超链接标签:a标签
href属性:
target属性:
表格标签
单元格合并
列表标签
无序列表
有序列表
自定义列表
表单标签
表单域:
表单空间
1>文本框
2>密码框
3>单选框
4>复选框
5>普通按钮
6>提交按钮
7>重置按钮
8>选择文件
label标签
select标签
textarea标签
无语义标签
HTML中常用特殊字符
注释标签
ctrl+’/’ 将当前行注释,效果如下:
PS:要看注释掉的信息,F12显示代码
标题标签 h1-h6:
有六个,从h1-h6,数字越大,字体越小
hello
hello
hello
hello
hello
hello
效果如下(各个标签之间的间隙是浏览器默认的css样式,可更改):
段落标签
测试页面 这是第一段这是第一段这是第一段这是第一段这是第一段这是第一段这是第一段这是第一段这是第一段这是第一段这是第一段这是第一段这是第一段这是第一段这是第一段这是第一段这是第一段这是第一段这是第一段这是第一段这是第一段这是第一段
这是第二段这是第二段这是第二段这是第二段这是第二段这是第二段这是第二段这是第二段这是第二段这是第二段这是第二段这是第二段这是第二段这是第二段这是第二段这是第二这是第二段这是第二段这是第二段这是第二段这是第二段这是第二段这是第二段这是第二段这是第二段这是第二段这是第二段这是第二段这是第二段这是第二段这是第二段这是第二段这是第二段这是第二段这是第二这是第二段这是第二段这是第二段
换行标签
测试页面 这是第一段这是第一段这是第一段这是第一段这是第一段这是第一段这是第一段这是第一段这是第一段这是第一段这是第一段这是第一段这是第一段这是第一段这是第一段这是第一段这是第一段这是第一段这是第一段这是第一段这是第一段这是第一段
这是第二段这是第二段这是第二段这是第二段这是第二段这是第二段这是第二段这是第二段这是第二段这是第二段这是第二段这是第二段这是第二段这是第二段这是第二段这是第二这是第二段这是第二段这是第二段这是第二段这是第二段这是第二段这是第二段这是第二段这是第二段这是第二段这是第二段这是第二段换行处
这是第二段这是第二段这是第二段这是第二段这是第二段这是第二段这是第二这是第二段这是第二段这是第二段
格式化标签
加粗:strong 标签和 b 标签
倾斜:em 标签和 i 标签
删除线: del 标签 和 s 标签
下划线:ins 标签 和 u 标签
测试页面 加粗 strong标签
加粗 b标签
倾斜 em标签
倾斜 i标签
删除线 del标签
删除线 s标签
下划线 ins标签
下划线 u标签
PS:虽说每种效果的两种标签效果一样,但是前者是带强调的意思。
图片标签:img 单标签
src属性:
img标签必须带有src属性,指定图片的路径
此时要把rose.jpg这个图片放到和html同级的目录下
title属性:
提示文本,鼠标放到图片上,就会有提示
width属性:
图片的宽度,px单位 像素
height属性:
图片的高度
border属性:
给图片加边框
超链接标签:a标签
href属性:
必须具备,表示点击后跳转到哪个页面
测试页面 跳转页面
href=”#”表示不做任何跳转,停留在当前页面
刷新
要用图片进行超链接跳转,可在a标签里添加img标签,示例:
单元格合并
合并行 rowspan="合并的行数"
合并列 colspan="合并的列数"
Document 姓名 性别 年龄 张三 男 3 李四 4 王五 5
列表标签
无序列表
ul 、li
ul中的 types属性 改变列前面的符号,有以下三种取值
disc(默认) square
circle
PS:快捷键 ”ul>li*3+回车” 在ul下面写3个li“ 在ul下面写3个li
Document 这是无序列表
- 内容1
- 内容2
- 内容3
有序列表
ol 、li
ol中的 types属性 改变列前面的编号符号,有以下五种取值
a //小写英文字母编号 A //大写英文字母编号 i //表示小写罗马数字编号 I //表示大写罗马数字编号 1 //数字编号(默认)
ol 的start属性,更改编号的起始值
Document 这是有序列表
- 这是有序列表1
- 这是有序列表2
- 这是有序列表3
- 这是有序列表4
自定义列表
dl 、dt 、dd
Document 这是自定义列表
- 自定义列表显示内容
- 自定义列表内容1
- 自定义列表内容2
- 自定义列表内容3
表单标签
用表单标签来完成服务器的一次交互
分为两个部分:
表单域 包含表单元素的区域,重点是form标签 表单控件 输入框,提交按钮等,重点是input标签
表单域:
表单空间
可以通过对type进行对应的取值,控制input的类型
1>文本框
姓名
2>密码框
姓名
密码
3>单选框
input 的type 属性为radio时为单选框,使用name实现只能勾选一个的功能,checked="true" 表示默认是勾选的。
Document 姓名
密码
性别男女
4>复选框
input 的 type 属性为 checkbox 时
Document 爱好吃饭睡觉玩游戏
5>普通按钮
input 的 type 属性为 botton时,value设置按钮显示的文字,点击按钮要触发的事件通过gs设置,
这里举例弹出hello
6>提交按钮
一般将数据提交到服务器上
input 的 type 属性为 submit ,单击提交按钮后,会自动清空文本框中的数据
姓名
7>重置按钮
重置文本框、单选框、复选框
8>选择文件
label标签
一般和单选框配合使用,实现单击文字也可勾选单选框的功能
select标签
一般和option配合使用(下拉框效果),默认显示第一个option的文字,可以通过设置selected属性,修改默认显示。
--请选择年份-- --2002-- --2003-- --2004--
textarea标签
row属性 设置超过多少行时出现滚轮
无语义标签
没有固定的用途,可以拿着这个标签啥都可以干
div 是独占一行的,是一个大盒子
span 是不独占一行的,是一个小盒子
Document 吃饭睡觉玩游戏吃饭睡觉玩游戏
HTML中常用特殊字符
空格:
小于号:<
大于号:>
按位与:&;