网页基本元素
一.网页基本元素
1.1一个完整的HTML结构包括:
-
文档声明
- HTML文档声明,告诉浏览器当前页面是HTML .5页面,让浏览器用HTML .5的标准去解析识别HTML文档
- 必须放在HTML文档的最前面,不能省略,省略了会出现兼容性问题
-
html元素
- html元素是HTML文档的根元素, 一个文档中只能有一个,其他所有元素都是它的后代元素
- W3C标准建议为html元素增加一个lang属性(language)
- 帮助语音合成工具确定要使用的发音
- 帮助翻译工具确定要使用的翻译规则
- 将文字存储到计算机
- lang > language(语言)
- char(字符) set(设置):字符编码
字符编码- 计算机中所有的东西最终都是0101表示
- ASCII
- Unicode
- utf-1 6/utf-32/utf-8
-
head元素(内部使用)
-
meta
-
title
-
style
-
link
-
<link rel="icon href="https://www.jd.com/favicon.ico>
-
-
base
-
script
-
noscritpt
-
-
meta 元数据
-
用来描述数据的数据
-
对网页来进行一些基本设置
-
<meta charset="utf-8"> <meta name= "viewport" content= "width=device-width, initial-scale=1.0"> <!--对浏览器的适配--> <meta http-equiv= "X-UA-Compatible" content=" ie=edge"> <!--对ie的适配-->
-
-
body元素
- body元素里面的内容将是你在浏览器窗口中看到的东西,也就是网页的具体内容和结构
<!DOCTYPE html>
<!--文档声明-->
<html lang='zh'>
<head>
<meta charset="utf-8">
<title> </title>
</head>
<body>
</body>
</html>
二.h元素/ p元素/a元素/img元素/strong元素
2.1h元素
- 表示网页的标题
- h1 ~h6共规定了6个等级的标题
- 有助于网站的SRO ( Search Engine Optimization )优化,可以促进关键词排名
2.2p元素
- 段落
2.3a元素
- 链接
2.4img元素
- img:显示图片(image)
- src:图片路径(网络图片/本地图片[相对路径/绝对路径])
<img src="图片路径">
2.5strong元素
- 加粗
三.br/hr/code
3.1br
- 换行(break)
3.2hr
-
分割线(一般写border)
-
<hr>
3.3code
- 显示代码
<!--code-->
<p>这是一段代码<code>function test(){}</code>代码结束</p>
<p>这是一段代码<span>function test(){}</span>代码结束</p>
<!--常用span-->
四.URL/SEO优化
4.1SEO优化
SEO:搜索引擎优化
- 百度/搜狗/360/Google
- 建议在网页中最多只有1个h1元素
- 乱用h元素不仅不会给网站带来好的权重,同时也有可能被搜索引|擎认为作弊,最后导致k站