1、浏览器
--向服务器阿奇请求,下载服务器中的网页(HTML),然后执行HTML显示出的内容。
2、服务器
--接收浏览器的请求,发送相应的页面到浏览器。
3、HTTP协议
--浏览器与服务器的通讯协议
可扩展标签语言
标签,属性,标签的嵌套关系都可以扩展
扩展,自定义
超文本标签语言
语法是固定的 w3c
用来显示数据
有一些特定的版本严格遵守XML规范
可以将HTML理解为标签固定的XML
超文本标记语言(英语:HyperText Markup Language,简称:HTML)是一种用于创建网页的标准标记语言。
第一个网页:
1 <!DOCTYPE html> 2 <html> 3 <!-- 4 在head 标签中对网页做一些基本的配置 5 --> 6 <head> 7 <!-- 8 描述:在meta中 charset设置解码utf-8 9 --> 10 <meta charset="utf-8" /> 11 <title></title> 12 </head> 13 <!-- 14 描述:在body里面写网页具体的内容 15 --> 16 <body> 17 你好,世界! 18 </body> 19 </html>
从初期的网络诞生后,已经出现了许多HTML版本:
版本 | 发布时间 |
---|---|
HTML | 1991 |
HTML+ | 1993 |
HTML 2.0 | 1995 |
HTML 3.2 | 1997 |
HTML 4.01 | 1999 |
XHTML 1.0 | 2000 |
HTML5 | 2012 |
XHTML5 | 2013 |
以X开头的版本是严格遵守w3c语法。不建议使用。
<!DOCTYPE>声明有助于浏览器中正确显示网页。
网络上有很多不同的文件,如果能够正确声明HTML的版本,浏览器就能正确显示网页内容。
doctype 声明是不区分大小写的,以下方式均可:
<!DOCTYPE html> <!DOCTYPE HTML> <!doctype html> <!Doctype Html>
<!DOCTYPE html>
HTML 4.01
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
XHTML 1.0
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
目前在大部分浏览器中,直接输出中文会出现中文乱码的情况,这时候我们就需要在头部将字符声明为 UTF-8。
<head> <!-- 描述:在meta中 charset设置解码utf-8 声明网页的编码 --> <meta charset="utf-8" /> <title></title> </head>
示例
1 <!DOCTYPE html> 2 <!-- 3 声明使用的HTML版本 4 html 是唯一的根元素 5 --> 6 <html> 7 <!-- 8 在head 标签中对网页做一些基本的配置 9 --> 10 <head> 11 <!-- 12 描述:在meta中 charset设置解码utf-8 13 --> 14 <meta charset="utf-8" /> 15 <!-- 16 在title中 声明网页的标题 17 --> 18 <title>第一个网页</title> 19 </head> 20 <!-- 21 描述:在body里面写网页具体的内容 22 --> 23 <body> 24 你好,世界! 25 good html 26 </body> 27 </html>
HTML 标题(Heading)是通过<h1> - <h6> 标签来定义的.
HTML 段落是通过标签 <p> 来定义的.
HTML 链接是通过标签 <a> 来定义的.
<a href="http://www.runoob.com">这是一个链接</a>
HTML 图像是通过标签 <img> 来定义的.
示例:
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="UTF-8"> 5 <title></title> 6 </head> 7 <body> 8 <!-- 标题 --> 9 <h1>道君</h1> 10 <h2>剑动山河</h2> 11 <h3>魔天记</h3> 12 <h4>辰南</h4> 13 <h5>莽荒纪</h5> 14 <h6>红楼梦</h6> 15 16 <!-- 段落 --> 17 18 <p>此时的清塞军身处吞云岭,四面尽是山歌</p> 19 <p>此时的清塞军身处吞云岭,</p><p>四面尽是山歌</p> 20 21 <a href="http://www.runoob.com">这是一个链接</a> 22 <img src="http://p0.so.qhimgs1.com/t016997d986a16ebe7a.jpg" width="258" height="39" /> 23 24 </body> 25 </html>
原文:https://www.cnblogs.com/Mengchangxin/p/9240121.html