1. 浏览器内核
内核(Rendering Engine):可大概译为“渲染引擎”,不过我们一般习惯将之称为“浏览器内核”。负责对网页语法的解释(如标准通用标记语言下的一个应用HTML、JavaScript)并渲染(显示)网页。
(1)IE (edge)(Trident)
(2)火狐(firefox)(Gecko)
(3)谷歌(chrome)(blink)
(4)苹果(safari)(webkit)
(5)欧朋(Opera)(blink 早期:presto )
2. HTML是什么
HTML是超文本标记语言(Hyper Text Markup Language),
HTML 不是一种编程语言,而是一种标记语言 (markup language)
html5是html的最新标准。
HTML骨架(固定的结构):
<html>
<head>
<title></title>
</head>
<body></body>
</html>
3. HTML元素、标签、属性
(1) 元素:
HTML 元素指的是从开始标签(start tag)到结束标签(end tag)的所有代码。HTML 文档是由 HTML 元素定义的。
元素的内容是开始标签与结束标签之间的内容,某些 HTML 元素具有空内容(empty content)。空元素在开始标签中进行关闭(以开始标签的结束而结束),大多数 HTML 元素可拥有属性。
(2)标签:
标签就是<head>、<body>、<table>等被尖括号“<”和“>”包起来的对象,绝大部分的标签都是成对出现的,如<table></talbe>、<form></form>。当然还有少部分不是成对出现的,如<br>、<hr>等。
标签就是用来标记HTML元素的。位于起始标签和结束标签之间的文本就是HTML元素的内容。
(3)属性:
为HTML元素提供各种附加信息的就是HTML属性,它总是以"属性名=属性值"这种名值对的形式出现,而且属性总是在HTML元素的开始标签中进行定义。
属性 | 值 | 描述 |
class | classname | 规定元素的类名(classname) |
id | id | 规定元素的唯一 id |
style | style_definition | 规定元素的行内样式(inline style) |
title | text | 规定元素的额外信息(可在工具提示中显示) |
4. 文档类型
文档类型即常见的 !DOCTYPE ,是用来声明并帮助浏览器正确识别网页。因为HTML发展至今有许多的不同版本,所以声明不同的文档类型可以让浏览器完全正确地显示出 HTML 页面。
--<!DOCTYPE>标记位于文档的最前面,用于向浏览器说明当前文档使用哪种HTML或XHTML标准规范。主要用于浏览器解析文档标签的依据。
--必需在开头处使用<!DOCTYPE>标记为所有的XHTML文档指定XHTML版本和类型,只有这样的浏览器才能将该网页有效的XHTML文档,并按指定的文档类型进行解析。
--<!DOCTYPE>标记和浏览器的兼容相关,删除<!DOCTYPE>,就是把如何展示HTML页面的权利交给浏览器。
5. meta标签
META标签是HTML语言HEAD区的一个辅助性标签,它位于HTML文档头部的<HEAD>标记和<TITLE>标记之间,它提供用户不可见的信息。meta标签通常用来为搜索引擎robots定义页面主题,或者是定义用户浏览器上的cookie;它可以用于鉴别作者,设定页面格式,标注内容提要和关键字;还可以设置页面使其可以根据你定义的时间间隔刷新自己,以及设置RASC内容等级,等等。
-- <metacharset=”UTF-8”>
--utf-8 是目前最常用的字符集编码方式,常用的字符集编码方式还有gbk和gb2312。
--gb2312简体中文。
--GBK包含全部中文字符繁体。
--BIG5繁体中文。
--UTF-8则包含全世界所有国家需要用到的字符。
--从二进制说起,符号表示文字,表示的模式就是编码,类似电报。
6. 常用标签
标签 | 描述 |
<h1> to <h6> | 定义 HTML 标题。 |
<p> | 定义段落。 |
<hr> | 定义水平线。 |
<br> | 换标签行。 |
<strong>或<b> | 加粗字体。 |
<em>或<i> | 倾斜字体。 |
<del>或<s> | 字体贯穿线。 |
<ins>或<u> | 字体下划线。 |
<!--...--> | 定义注释。 |
<img> | 定义图像。 |
<div> | 定义一个元素块。默认占一行。(根据浏览器的显示大小),div的高度是由div中的内容来决定的。 |
<span> | 组合文档中的行内元素。宽度和高度都是由内容来决定。(行内元素,块级元素。) |
7. 标签语义化
简单来说 Web语义化是指使用语义恰当的标签,使页面有良好的结构,页面元素有含义,能够让人和搜索引擎都容易理解让机器可以读懂内容。由编写者对网页内容进行语义化主要可以让不同的人和机器对这段内容的作用和所属有清晰的认识,从而查看或者找到自己需要的内容。
语义好的网页更受SEO的喜欢,在搜索引擎里面的排名会更靠前
SEO优化 ===> 在输入关键字的时候,搜索引擎会罗列很多很多的网页出来,而用户基本习惯都是点前面的网页,不会去点后面的网页,所以如果网页在搜索引擎中的排名更加靠前,那么自然而然会带来更多的用户点击访问。
如何优化:
1、花钱买关键字 见效快,花钱多 2、让页面更加规范,语义更加明确(在合适的地方使用合适的标签) 3、制作静态页面 4、发外链(网站就越受欢迎,将来被用户搜索出来的机会就要大)
8. 链接
HTML 使用超级链接与网络上的另一个文档相连。对应a标签。
a标签的其它名称:
超级链接,超链接,锚链接。
作用:可以在一个页面跳转到另一个页面。
代码:
<a href=”页面的路径”></a>
注意:在a标签之内必须要写上文字,如果没有,那么这个标签在页面上找不到。
a标签的其它用法:
1.可以不跳转(跳转到当前页面)href=”#”
2.可以跳转到另外的页面。
3.可以在当前页面进行定位。
①.设置a标签的href属性为“#id名”,
②.在页面的指定位置加入一个目标标签(可以是任意标签)
③.必须给这个标签设置一个id名:<p id=”mubiao”>这是目标</p>
4.在跳转的页面进行定位。
5.可以进行下载。(不推荐使用)
a标签的属性:
href
| a标签跳转的目标地址 |
target | _blank:保留原始页面,新窗口打开 _self:在当前页面进行跳转(默认值) |
base | 为页面上所有的a标签设置跳转的方式(base标签一般放在titile标签下面) |