一、什么是HTML
HTML是一门语言,所有的网页都是用HTML这么语言编写的
HTML(HyperText Markup Language):超文本标记语言
超文本:超越文本的限制,比普通文本更强大,除了文字信息,还可以定义图片、音频、视频等内容。
标记语言:标记语言时一套标记标签,由标签构成的语言,HTML使用标记标签来描述网页。
HTML运行在浏览器上,HTML标签由浏览器来解析
HTML标签都是预定义好的。例如:使用<img>展示图片
W3C标准:网页主要由三部分组成
结构:HTML 表现:CSS 行为:JavaScript
前端技术参考手册:HTML 系列教程 (w3school.com.cn)
https://www.w3school.com.cn/h.asp
二、HTML入门案例
1、新建文本文件,将后缀名改为.html
新建完改了后缀名,就是显示默认的浏览器样式
2、编写HTML结构标签
用记事本方式打开即可,然后编写此案例。可以在<body>中定义文字,也可以修改文字的颜色属性。
3、保存之后,双击点开结果
4、总结
1、HTML文件以.htm或.html为扩展名
2、HTML结构标签
标签 | 描述 |
<HTML> | 定义HTML文档 |
<head> | 定义关于文档的信息 |
<title> | 定义文档的标题 |
<body> | 定义文档的主体 |
3、HTML标签不区分大小写
4、HTML标签属性值单双引号皆可
5、HTML语法松散
三、HTML的语言特征
HTML代码由头和体组成 <html> <head> <title>标题</title> </head> <body>需要展示给用户看的信息内容</body> </html> <html>标签就相当于java类大括号 <head>中存放的都是网页的说明性内容,例如标题
HTML文件的扩展名为html(新的)或者htm (老的)
HTML文件由浏览器直接解析执行,无需编译,直接由上到下依次解析执行
HTML标签通常由开始标签和结束标签组成,例如<font>内容体</font>
开始标签和结束标签之间的内容叫做内容体
HTML没有内容体的标签叫做空标签,经由一个标签组成。例如:<br/>自关闭
HTML标签不区分大小写,为了方便阅读,建议使用小写
HTML标签是有属性的,格式为:属性名=”属性值”,属性值用引号引起,引号包括单引号和双引号,建议使用双引号
HTML标签建议包裹嵌套,不建议交叉嵌套
四、HTML基础标签
标签 | 描述 |
<h1> - <h6> | 定义标题,h1最大,h6最小 |
<font> | 定义文本的字体、字体尺寸,字体颜色 |
<b> | 定义粗体文本 |
<i> | 定义斜体文本 |
<u> | 定义文本下划线 |
<center> | 定义文本居中 |
<p> | 定义段落 |
<br> | 定义换行 |
<hr> | 定义水平线 |
代码示例:
<!--html5的标识--> <!DOCTYPE html> <html lang="en"> <head> <!--页面的字符集--> <meta charset="UTF-8"> <title>Title</title> </head> <body> <h1>我是标题 h1</h1> <h2>我是标题 h2</h2> <h3>我是标题 h3</h3> <h4>我是标题 h4</h4> <h5>我是标题 h5</h5> <h6>我是标题 h6</h6> <hr> <!-- html 表示颜色 1、英文单词:red,pink,blue... 2、rgb(值1,值2,值3):值的取值范围:0-255 reg(255,0,0) 3、#值1值2值3:值的范围:00-FF --> <font face="楷体" size="5" color="#ff0000">夏志121</font> <hr> 1.水寒江静,满目青山,载月明归。——黄庭坚《诉衷情》<br> 2.烟水茫茫,千里斜阳暮。山无数。乱红如雨。——秦观《点绛唇·桃源》 <hr> <p> 1.水寒江静,满目青山,载月明归。——黄庭坚《诉衷情》 </p> <p> 2.烟水茫茫,千里斜阳暮。山无数。乱红如雨。——秦观《点绛唇·桃源》 </p> <hr> 人生自古谁无死<br> <b>人生自古谁无死</b><br> <i>人生自古谁无死</i><br> <u>人生自古谁无死</u><br> <hr color="blue"> <center> <b>人生自古谁无死</b> </center> </body> </html>
运行结果:
五、HTML转义字符
HTML源代码 | 显示结果 | 描述 |
< | < | 小于号或显示标记 |
> | > | 大于号或显示标记 |
& | & | 可用于显示其他特殊字符 |
" | “ | 引号 |
® | ® | 已注册 |
© | © | 版权 |
™ | ™ | 商标 |
  | 不断行空白 |