HTML简介
HTML简介:
- HTML的注释,注释中的内容会被浏览器所忽略,不会在网页中直接显示, 但是可以在源码中查看注释,注释用来对代码进行解释说明的开发中一定要养成良好的编写注释的习惯,注释要求简单明了
- 注释还可以将一些不希望显示的内容隐藏
- 注释不能嵌套
- 标签一般成对出现,但是也存在一些自结束标签
标签的属性:
- 属性,在标签中(开始标签或自结束标签)还可以设置属性
- 属性是一个名值对(x=y)
- 属性用来设置标签中的内容如何显示
- 属性和标签名或其他属性应该使用空格隔开
- 属性不能瞎写,应该根据文档中的规定来编写,有些属性有属性值,有些没有。如果有属性值,属性值应该使用引号引起来
网页的基本结构:
- 迭代
①网页的版本HTML4X,HTML2.0。HTML5,… - 文档声明(doctype):文档声明用来告诉浏览器当前网页的版本
①html5的文档声明
<!doctype html>
<!Doctype HTML>
举例:
<!-- 文档声明,声明当前网页的版本 -->
<!doctype html>
<!-- html的根标签(元素),网页中的所有内容都要写根元素的里边 -->
<html>
<!-- head是网页的头部,head中的内容不会在网页中直接出现,主要用来帮助浏览器或搜索引擎来解析网页 -->
<head>
<!-- meta标签用来设置网页的元数据,这里meta用来设置网页的字符集,避免乱码问题 -->
<meta charset="utf-8">
<!-- title中的内容会显示在浏览器的标题栏,搜索引擎会主要根据title中的内容来判断网页的主要内容 -->
<title>网页的标题</title>
</head>
<!-- body是html的子元素,表示网页的主体,网页中所有的可见内容都应该写在body里 -->
<body>
<!-- h1网页的一级标题 -->
<h1>网页的大标题</h1>
</body>
</html>
HTML语法
实体:
- 在网页中编写的多个空格默认情况会自动被浏览器解析为一个空格
- 在HTML中有些时候,我们不能直接书写一些特殊符号。比如:多个连续的空格,比如字母两侧的大于和小于号
- 如果我们需要在网页中书写这些特殊的符号,则需要使用html中的实体(转义字符)
- 实体的语法:&实体的名字;
① 空格
②> 大于号
③< 小于号
④© 版权符号
head标签:
- <head> 标签包含了所有的头部标签元素。在 <thead>标签中你可以插入脚本(scripts),
样式文件(CSS),及各种meta信息。 - 可以添加在头部区域的元素标签为: <title>, <style>, <meta>,<link>, <script>, <base>。
①base标签
描述了基本的链接地址/链接目标,该标签作为HTML文档中所有的链接标签的默认链接:
②link标签
定义了文档与外部资源之间的关系。(包括网络或者本地),<link>标签通常用于链接到样式表。
③style标签
定义了HTML文档的样式文件引用地址,在<style> 标签中你也可以直接添加样式来渲染 HTML 文档。
④script标签
既可包含脚本语句,也可以通过 “src” 属性指向外部脚本文件。(包括网络或者本地),<script> 标签用于定义客户端脚本,比如 JavaScript。
⑤title标签
定义了不同文档的标题,<title> 在 HTML/XHTML 文档中是必须的。
<1>title标签定义了浏览器工具栏的标题。
<2>当网页添加到收藏夹时,显示在收藏夹中的标题。
<3>显示在搜索引擎结果页面的标题。
meta标签:
- meta主要用于设置网页中的一些元数据,元数据不是给用户看
①charset 指定网页的字符集
②name 指定的数据的名称
③content 指定的数据的内容 - keywords 表示网站的关键字,可以同时指定多个关键字,关键字间使用,隔开
<meta name="Keywords" content="网上购物,网上商城,手机,笔记本,电脑,MP3,CD,VCD,DV,相机,数码,配件,手表,存储卡,京东"/>
<meta name="keywords" content="网购,网上购物,在线购物,网购网站,网购商城,购物网站,网购中心,购物中心,卓越,亚马逊,卓越亚马逊,亚马逊中国,joyo,amazon">
- description 用于指定网站的描述
① 网站的描述会显示在搜索引擎的搜索的结果中
<meta name="description" content="京东JD.COM-专业的综合网上购物商城,销售家电、数码通讯、电脑、家居百货、服装服饰、母婴、图书、食品等数万个品牌优质商品.便捷、诚信的服务,为您提供愉悦的网上购物体验!"/>
- title标签的内容会作为搜索结果的超链接上的文字显示
语义化标签:
- 在网页中HTML专门用来负责网页的结构,所以在使用html标签时,应该关注的是标签的语义,而不是它的样式。
- 标题标签: