具备三个要素的项目,就是web项目
1、浏览器
--向服务器阿奇请求,下载服务器中的网页(HTML),然后执行HTML显示出的内容。
2、服务器
--接收浏览器的请求,发送相应的页面到浏览器。
3、HTTP协议
--浏览器与服务器的通讯协议
XML 和 HTML
可扩展标签语言
标签,属性,标签的嵌套关系都可以扩展
扩展,自定义
超文本标签语言
语法是固定的 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>
实例解析
- <!DOCTYPE html> 声明为 HTML5 文档
- <html> 元素是 HTML 页面的根元素
- <head> 元素包含了文档的元(meta)数据
- <title> 元素描述了文档的标题
- <body> 元素包含了可见的页面内容
- <标签>内容</标签>
HTML 网页结构
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> 声明
<!DOCTYPE>声明有助于浏览器中正确显示网页。
网络上有很多不同的文件,如果能够正确声明HTML的版本,浏览器就能正确显示网页内容。
doctype 声明是不区分大小写的,以下方式均可:
<!DOCTYPE html> <!DOCTYPE HTML> <!doctype html> <!Doctype Html>
通用声明
HTML5
<!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-813 ????????-->14 ????????<meta charset="utf-8" />15 ????????<!--16 ????????????在title中 声明网页的标题17 ????????-->18 ????????<title>第一个网页</title>19 ????</head>20 ????<!--21 ????????描述:在body里面写网页具体的内容22 ????-->23 ????<body>24 ????????你好,世界!25 ????????good html26 ????</body>27 </html>
HTML 标题
HTML 标题(Heading)是通过<h1> - <h6> 标签来定义的.
HTML 段落
HTML 段落是通过标签 <p> 来定义的.
HTML 链接
HTML 链接是通过标签 <a> 来定义的.
<a href="http://www.runoob.com">这是一个链接</a>
HTML 图像
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>
前端入门之——html day1
原文地址:https://www.cnblogs.com/Mengchangxin/p/9240121.html