社区
掘金
前言
随着 5G 时代的来临，大前端也更加火热的发展...前端技术也是非常有前景的一门技术，接下来一段时间将记录前端的自学经历7月22日 学习的知识点
- 常见浏览器内核
- Web 标准
- sublime 几个常用的快捷键
- 标签分类
- SEO 简介
- 一些常用的文本格式标签
- 图片标签
- 超链接标签
- 其他
1、常见浏览器内核
当今互联网的浏览器非常多，主流知名的浏览器内核有：blink（谷歌浏览器内核）、WebKit（Safari浏览器内核）、Trident（IE浏览器内核）、gecko（火狐浏览器内核）
2、Web 标准
Web 标准主要是为了服从 w3c 和其他标准化组织制定的一系列标准的集合而言，其主要分为三个内容标准即：结构标准（structure）、表现标准（Presentation）、行为标准（Behavior）。
3、sublime 几个常用的快捷键
sublime 是现在主流的方便、快捷，轻量，高效的开发编辑器之一，熟练其中几个快捷键可以提高编写代码的效率
tab 补全代码
ctrl+shift+d 快速复制一行
ctrl+shift+k 快速删除一行
ctrl+shift+↑(↓) 快速上移（下移）一行
ctrl+k+b 隐藏（显示）侧边栏
ctrl+L 快速选中一行
ctrl+h 查找替换
ctrl+f 查找
ctrl+鼠标单击 集体编辑
sublime也提供嵌套标签的快速创建如表格，列表等
table>tr*3>td*3 按下tab可以快速创建三行三列的表格
ul>li*3 可以快速创建有三个选项的下拉菜单
其他的嵌套标签均可使用该方法
>表示嵌套关系;*表示数量.
4、标签分类
对于 html 的标签来讲，主要分为两类，就是单标签与双标签。
单标签：如<br/>（换行）、<hr/>（一条线）
双标签：只成对出现的标签，如<html></html>、<head></head>、<p></p>等
5、SEO 简介
SEO简单来书就是搜索引擎的优化，一般来说写网页只允许有一个<h1>标签，否则对网页的搜索来说并不是优化很好。
6、一些常用的文本格式标签
常用的文本格式标签有如下几个：
加粗：<b></b>,<strong></strong>,XHTML 推荐使用 strong 效果如下:粗体
斜体：<i></i>,<em></em>，文字以斜体方式显示（XHTML 推荐使用 em）效果如下：斜体
删除线：<s></s>，<del></del>，文字以加删除线方式显示（XHTML 推荐使用 del）效果如下：删除线
下划线：<u></u>和</ins></ins>,文字以加下划线方式显示（XHTML不赞成使用u）效果如下：下划线
注意：b i s u 只有使用没有强调的意思，strong em del ins 表示语义更强烈，其语义的应用可以用于只能语音的发音。
7、图片标签
图片标签用来在网页显示出一张图片，其标签名为<img/>
属性有如下：
| 属性 | 属性值 | 描述 |
|---|---|---|
| src | URL | 图像的路径 |
| alt | 文本 | 图像不能显示时的替换文本 |
| title | 文本 | 鼠标悬停时显示的内容 |
| width | 像素（XHTML不支持%页面百分比） | 设置图像的宽度 |
| height | 像素（XHTML不支持%页面百分比） | 设置图像的高度 |
| border | 数字 | 设置图像边框的宽度 |
8、超链接标签
超链接标签可以说一个网站里是必有得，它具有跳转页面的功能其基本标签写法如下：
<a href="#"></a>，'#'表示空链接。
其属性有如下：
| 属性 | 描述 | 值 |
|---|---|---|
| href | 跳转的位置 | 链接地址 |
| target | 跳转方式 | _self(当前页）_blank(新建页面) |
超链接标签也可和图片标签内嵌进行图片超链接的跳转代码如下：
<a href="https://www.baidu.com" target="_blank">
<img src="https://www.baidu.com/img/bd_logo1.png?where=super" width="100px" height="50px"/>
</a>
效果如下：
ps:在<head>标签里面可以添加<base target="_blank" />设置默认连接跳转方式
锚点：利用 a 标签可以对网页的任意位置进行跳转定位，步骤有两步
1.设置锚点，需要设置的锚点标签需要设置 id 属性，例如设置 h1 标签为锚点
<h1 id="top"></h1>
2.设置跳转，建立a标签，代码如下
<a href="#top">跳转到本页面前言处</a>
效果如下：本篇文章第一行的大标题已经设置了锚点位置，可以进行跳转到前言位置。
点我跳转
9、其他
<!-- 声明浏览器采用的 html 版本 -->
<!DOCTYPE html>
<!-- 告诉搜索引擎的网页语言类型，en英文也支持中文，中文标准 zh-CN -->
<html lang="en">
<head>
<!-- meta 元信息，元信息主要给搜索引擎和浏览器看。 -->
<meta charset="UTF-8">
<!--
ascll
ansi
unicode 万国码
gb2312 简体中文
big5 繁体字
GBK 所有中文字体
-->
<title>Document</title>
</head>
<body>
<h1>我是一个大标题</h1>
</body>
</html>