html5如何添加图⽚菜鸟教程，菜鸟⼊门教程HTML5的常见⽤法本篇教程探讨了菜鸟⼊门教程 的常见⽤法，希望阅读本篇⽂章以后⼤家有所收获，帮助⼤家HTML5+CSS3从⼊门到精通 。
<
⼀、⽹页标题、⽂章标题、⽂章段落
代码：
>
这是⽹页标题
这是⽂章标题
这是⽂章的标题
这是⼀个段落
运⾏结果为：
这是⽂章标题
这是⽂章的标题
这是⼀个段落
注意：
这⾥看不到⽹页标题，⽹页标题会显⽰在浏览器的⽹页上
⽂章的标题有 h1-h6 ⼀共6种不同的表⽰，上⾯只演⽰了其中的两种
返回顶部
⼆、字体⼤⼩、字体颜⾊、字体类型、字体位置、背景颜⾊
代码：
HTML>
这是⽹页标题
改变字体的⼤⼩
改变字体的颜⾊
改变字体的类型
改变字体的位置
改变这段⽂字的背景颜⾊
改变字体的⼤⼩和字体的颜⾊
运⾏结果为：
改变字体的⼤⼩
改变字体的颜⾊
改变字体的类型
改变字体的位置
改变这段⽂字的背景颜⾊
改变字体的⼤⼩和字体的颜⾊
注意：
颜⾊可以⽤英⽂字母表⽰，也可以⽤⼗六进制码表⽰
style 属性也可以⽤于标题，例如： 改变⽂章标题的颜⾊
返回顶部
三、插⼊图⽚
代码：
HTML>
这是⽹页标题
运⾏结果为：
注意：
是⼀个空元素，没有关闭标签
title 属性：当你把⿏标放在图⽚上⽅时，会出现提⽰信息
如何获得图⽚：在⽹络上到⼀张图⽚，⿏标右键图⽚，选择复制图⽚地址，然后粘贴到 src 属性中即可返回顶部
四、⽹页内的超链接、⽹页间的超链接
代码1：
HTML>
这是⽹页标题
点击跳转到⼤标题
点解跳转到⼩标题
这是⽹页内的超链接
这是⽹页内的超链接
运⾏结果为：
点击跳转到⼤标题
点解跳转到⼩标题
这是⽹页内的超链接
这是⽹页内的超链接
注意：
注意 href 属性的值和 id 属性的值，除了 # 这个符号外，其他要相匹配
代码2：
HTML>
这是⽹页标题
这是⽂字链接-点击⽂字跳转到百度
百度
这是图⽚链接-点击图⽚跳转到百度
运⾏结果为：
这是⽂字链接-点击⽂字跳转到百度
百度
这是图⽚链接-点击图⽚跳转到百度
返回顶部
五、有序列表、⽆序列表
代码1：
HTML>
这是⽹页标题
这是有序列表：
1. 苹果
2. ⾹蕉
3. 梨
这是⽆序列表：
狗
猫
⽼⿏
运⾏结果为：
这是有序列表：
苹果⾹蕉梨
这是⽆序列表：
狗猫⽼⿏
代码2：
HTML>
这是⽹页标题
这是嵌套列表：
1. 花
1. 玫瑰
2. 百合
2. 树⽊
1. 柳树
2. 榕树
运⾏结果为：
这是嵌套列表：
花玫瑰百合怎么制作网页图片
树⽊柳树榕树
注意：
ol 的全称为 order list(有序列表)
ul 的全称为 unorder list(⽆序列表)
li 的全称为 list(列表)
返回顶部
六、表格制作
代码1：
HTML>
这是⽹页标题
头部头部头部
内容内容内容内容内容内容内容内容内容脚注脚注脚注
运⾏结果为：
头部头部头部
内容内容内容内容内容内容
内容内容内容脚注脚注脚注
注意：
thead 的全称为 table head(表格头部)
tbody 的全称为 table body(表格内容)
tfoot 的全称为 table foot(表格脚注)
tr 的全称为 table row(表格⾏)
td 的全称为 table data(表格数据)
table 标签⾥⾯有三个部分，头部(thead)、⾝体(tbody)、脚部(tfoot)，⽽这三个部分⾥⾯都可以有 表格⾏(tr)，表格⾏⾥⾯有 表格数据(td)
我们可以注意到，table 标签⾥⾯只有规定⾏的元素，没有规定列的元素，列只能由 表格数据(td) 规定
代码2：
HTML>
这是⽹页标题
学号性别姓名
101男张三102男李四103男王五
运⾏结果为：
学号性别姓名101男张三
102男李四103男王五
注意：
width 属性表⽰表格占⽐屏幕宽度的 50%
代码3：
HTML>
这是⽹页标题
学⽣档案学号姓名性别
101张三男102李四男103王五男
运⾏结果为：
学⽣档案学号性别姓名101男张三
102男李四103男王五
注意：
colspan 的全称为 column span(跨列)
colspan 的属性表⽰让表格中 “学⽣档案” 这⼀⾏的内容横跨3列代码4：
HTML>
这是⽹页标题
学号姓名性别
101张三男102李四103王五
运⾏结果为：
学号姓名性别
101张三男102李四103王五
注意：
rowspan 属性表⽰让表格中的内容跨3⾏
返回顶部
七、其他⼀些常⽤元素
代码：
HTML>
这是⽹页标题
这⾥显⽰粗体
这⾥显⽰斜体
这⾥显⽰下划线
这⾥可以
换⾏
这⾥是⽔平线
运⾏结果为：
这⾥显⽰粗体

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。