☀️前端基础—【HTML⚡】
文章目录(PS:觉得不错请点赞收藏支持一下)
- 一、认识 Web
- 1.1 认识网页
- 1.2 浏览器(显示代码)
- 1.3 Web 标准
- 二、HTML 初识
- 2.1 概念
- 2.2 HTML 骨架标签
- 2.3 HTML 元素标签分类
- 2.4 HTML 标签关系
- 2.5 文档类型 ``
- 2.6 页面语言 lang
- 2.7 字符集
- 2.8 HTML 标签的语义化
- 三、HTML 常用标签
- 3.1 排版标签
- 3.2 文本格式化标签
- 3.3 标签属性
- 3.4 图像标签 `img`
- 3.5 链接标签
- 3.6 注释标签
- 3.7 路径
- 四、表格 `table`
- 4.1 创建表格
- 4.2 表格属性
- 4.3 表头单元格标签 `th`
- 4.4 表格标题 `caption`
- 4.5 合并单元格
- 4.6 表格划分结构
- 五、列表标签
- 5.1 认识列表
- 5.2 无序列表 `ul`
- 5.3 有序列表
- 5.4 自定义列表
- 5.5 总结
- 六、表单标签
- 6.1 `input` 控件
- 6.2 `label` 标签
- 6.3 `textarea` 控件(文本域)
- 6.4 `select` 下拉列表
- 6.5 form 表单域
一、认识 Web
1.1 认识网页
- 解释说明: 网页主要由文字、图像和超链接等元素构成,除了这些元素,网页中还可以包含音频、视频等。
如下图所示就是一个网页:
网页的背后是一行一行代码写出来的
1.2 浏览器(显示代码)
解释说明: 浏览器是网页显示、运行的平台。
常用的浏览器有: IE、火狐(Firefox)、谷歌(Chrome)、Safari(苹果自带浏览器)和Opera浏览器等(我们平时称为五大浏览器)。
常见浏览器内核
解释说明: 浏览器内核(Rendering Engine),中文翻译很多,如:排版引擎、解释引擎、渲染引擎,现在统一流行称为浏览器内核。
浏览器 内核 备注 IE Trident IE、猎豹安全、360极速浏览器、百度浏览器 Firefox Gecko 可惜这几年已经没落了,打开速度慢、升级频繁、猪一样的队友 flash、神一样的对手 Chrome Safari webkit 很多人错误的把 webkit 叫做 Chrome 内核,Chrome 内核早已不是了 Chrome Chromium/Bink 在 Chromium 项目中研发 Blink 渲染引擎(即浏览器核心),内置于 Chrome 浏览器之中,Blink 其实是 WebKit 的分支,大部分国产浏览器最新版都采用 Blink 内核,二次开发 Opera blink 跟随着 Chrome 用 blink 内核
1.3 Web 标准
解释说明: Web 标准不是某一个标准,而是由 W3C 组织(W3C 万维网联盟是国际最著名的标准化组织)和其他标准化组织制定的一系列标准的集合。
构成
主要包括结构(Structure)、表现(Presentation)和行为(Behavior)三个方面。
标准 | 说明 |
---|---|
结构(Structure) | 结构用于对网页元素进行整理和分类,主要学的是 HTML |
表现(Presentation) | 表现用于设置网页元素的版式、颜色、大小等外观样式,主要学的是 CSS |
行为(Behavior) | 行为是指网页模型的定义及交互的编写,主要学的是 Javascript |
优点
- 让 Web 的发展前景更广阔
- 内容能被更广泛的设备访问
- 更容易被搜寻引擎搜索
- 降低网站流量费用
- 使网站更易于维护
- 提高页面浏览速度
二、HTML 初识
2.1 概念
- HTML 指的是超文本标记语言(Hyper Text Markup Language),是用来描述网页的一种语言。
- HTML 不是一种编程语言,而是一种标记语言(markup language)
- 标记语言是一套标记标签(markup tag)
所谓超文本,指两层含义
- 因为它可以加入图片、声音、动画、多媒体等内容(超越文本限制)。
- 它还可以从一个文件跳转到另一个文件,与世界各地主机的文件连接(超级连接文本)。
2.2 HTML 骨架标签
- HTML 有自己的语言语法骨架格式
<html><head><title></title></head><body></body>
</html>
标签名 | 定义 | 说明 |
---|---|---|
<html></html>
|
HTML标签 | 页面中最大的标签,为 根标签 |
<head></head>
|
文档的头部 | 注意在 head 标签中我们必须要设置的标签是 title |
<title></title>
|
文档的标题 | 让页面拥有一个属于自己的网页标题 |
<body></body>
|
文档的主体 | 元素包含文档的所有内容,页面内容基本都是放到 body 里面的 |
注意:HTMl 标签名、类名、标签属性和大部分属性值统一用小写,不推荐使用大写。
2.3 HTML 元素标签分类
- 常规元素(双标签)
格式:
<标签名> 内容 </标签名>比如:
<body></body>说明:
1. 该语法中 <标签名> 表示该标签的作用开始,一般称为"开始标签(start tag)","</标签名>"表示该标签的作用结束,一般称为"结束标签(end tag)"。
2. 和开始标签相比,结束标签只是在前面加了一个关闭符"/"。
- 空元素(单标签)
格式:
<标签名/> 比如:
<br /> 表示换行说明:
1. 空元素 用单标签来表示,简单点说,就是里面不需要包含内容,只有一个开始标签不需要关闭。
2.4 HTML 标签关系
- 嵌套关系(父子关系)
比如:
<head>
<title></title>
</head>
- 并列关系(兄弟关系)
比如:
<head></head>
<body></body>
注意:
- 两个标签之间的关系如果是嵌套关系,子元素最好缩进一个 tab 键的身位(一个tab是4个空格)
- 如果是并列关系,最好上下对齐
2.5 文档类型 <!DOCTYPE>
- 用法
<!DOCTYPE html>
- 作用
声明位于文档中的最前面的位置,处于标签之前,此标签告知浏览器文档使用哪种 HTML 或 XHTML 规范,也就是告诉浏览器按照 HTML5 规范解析页面。
2.6 页面语言 lang
最常见的2个:
1. en 定义语言为英语
2. zh-CN 定义语言为中文举例:
<html lang="en"> 指定html 语言种类注意:
考虑浏览器和操作系统的兼容性,目前仍然使用 zh-CN 属性值
2.7 字符集
字符集(Character set)是多个字符的集合
计算机要准确的处理各种字符集文字,需要进行字符编码,以便计算机能够识别和存储各种文字
举例:
<meta chaset="UTF-8" />utf-8 是目前最常用的字符集编码方式,常用的字符集编码方式还有 gbk 和 gb2312
1. gb2312 简单中文 包括 6763 个汉字 GUO BIAO
2. BIG5 繁体中文 港澳台等用
3. GBK 包含全部中文字符,是 GB2312 的扩展,加入对繁体字的支持,兼容 GB2312
4. UTF-8 则基本包含全世界所有国家需要用到的字符
2.8 HTML 标签的语义化
什么意思呢?
答: 指的是标签的含义
优点:
1. 方便代码的阅读和维护
2. 同时让浏览器或是网络爬虫可以很多的解析,从而更好分析其中的内容
3. 使用语义化标签会具有更好的搜索引擎优化
三、HTML 常用标签
HTML 语言呢,主要学的是结构,认识标签是干什么的就可以了,添加样式什么的我们主要用 CSS 语言
3.1 排版标签
解释说明: 排版标签主要和 css 搭配使用,显示网页结构的标签,是网页布局最常用的标签。
标题标签
h
说明:
为了使网页更具有语义化,我们经常会在页面中用到标题标签,HTML 提供了 6个等级的标题,即标题标签语义: 作为标题使用,并且依据重要性递减。格式:
<h1> 一级标题 标题内容 </h1>
<h2> 二级标题 标题内容 </h2>
<h3> 三级标题 标题内容 </h3>
<h4> 四级标题 标题内容 </h4>
<h5> 五级标题 标题内容 </h5>
<h6> 六级标题 标题内容 </h6>注意:
一行只能放一个标题
效果如下:
- 段落标签
p
说明:
单词全拼: paragraph作用:
1. 把文本分割为若干段落
2. 文本会在一个段落中根据浏览器窗口大小自动换行格式:
<p></p>
- 水平线标签
hr
说明:
单词全拼: horizontal
它是一个单标签作用:
1. 创建一个横跨网页的水平线
2. 将段落与段落之间隔开
3. 使文档结构清晰,层次分明格式:
<hr />
效果如下:
- 换行标签
br
说明:
单词全拼: break 中文意思是 打断,换行
它是一个单标签作用: 强制换行<br />
div
和span
标签
说明:
单词全拼:
division 中文意思是 分割,分区
span 就是全拼 中文意思是 跨度,跨距,范围作用:
1. div 和 span 标签是我们网页布局主要的 2个盒子注意:
1. div 标签 一行只能放一个 div
2. span 标签 一行上可以放好多个 span
3.2 文本格式化标签
- 解释说明:开发网页时,有时需要为文字设置粗体、斜体、下划线和删除线效果,文本格式化标签呢就是用来显示这些的。
标签 | 显示效果 |
---|---|
<b></b> 和<strong></strong>
|
文字以 粗体 方式显示(XHTML推荐使用strong) |
<i></i> 和<em></em>
|
文字以 斜体 方式显示(XHTML推荐使用em) |
<s></s> 和<del><del>
|
文字以 加删除线 方式显示(XHTML推荐使用del) |
<u></u> 和<ins></ins>
|
文字以 加下划线 方式显示(XHTML推荐使用ins) |
3.3 标签属性
说明:
1. 制作网页时,如果想让HTML标签提供更多的信息,就设置属性
2. 所谓属性就是外在特性,就是一种事物的特点格式:
<标签名 属性1="属性值1" 属性2="属性值2">内容</标签名>举例:
一个手机,它的颜色是黑色的,尺寸是 8寸
<手机 颜色="黑色" 尺寸="8寸"> </手机>
3.4 图像标签 img
说明:
单词全拼: image 中文意思是 图像作用: 插入图片格式:
<img src="图像URL" width="属性值" height="属性值" />注意:
1. 该语法中 src 属性用于指定图像文件的路径和文件名,它是img 标签的必需属性
2. 标签可以拥有多个属性,必须写在开始标签中,位于标签名后面
3. 属性之间不分先后顺序,标签名与属性、属性与属性之间以空格分开
4. 采取 键值对 的格式 key="value" 的格式
属性 | 属性值 | 描述 |
---|---|---|
src | URL | 图像的路径 |
alt | 文本 | 图片不能显示时的替换文本 |
title | 文本 | 鼠标悬停时显示的内容 |
width | 像素(XHTML不支持%页面百分比) | 设置图像的宽度 |
height | 像素(XHTML不支持%页面百分比) | 设置图像的高度 |
border | 数字 | 设置图像边框的宽度 |
3.5 链接标签
说明:
1. 单词全拼: anchor 中文意思是 锚
2. 若创建超链接,只需用标签把文字包起来就好格式:<a href="跳转目标" target="目标窗口的弹出方式">文本或图像</a>注意:
1. 外部链接 需要以下这种方式: https://www.baidu.com/
2. 内部链接 直接写内部页面名称即可,比如: <a href="index.html"></a>
3. 如果要定义空链接需这样写,<a href="#"></a>
4. 还可以给网页中各种网页元素添加超链接,如:图像、表格、音频、视频,最常见的就是文本超链接了。
3.6 注释标签
说明:
注释内容不会显示在浏览器窗口中,但是它也会被存储在用户的计算机内存地址中,查看源码时可以看到作用:
1. 注释是给人看,目的是为了更好的理解这部分的代码是干什么的
2. 一般用于简单的描述,如某些状态描述、属性描述等格式:
<!-- 注释内容 -->
快捷键: ctrl + / 或者 ctrl + shift + /注意:
推荐 注释内容位于需要注释代码的上面,单独占一行
3.7 路径
说明:
1. 实际工作中,我们的文件不能随便乱放,否则很难寻找,因此我们需要一个文件夹来管理
2. 目录文件夹;就是普通文件夹,存放我们做页面所需的相关文件和素材,如: html文件,图片等等。
3. 根目录;打开目录文件夹第一层就是根目录,当我们做的页面需要的图片非常多时,通常我们会新建一个文件夹来存放它们,这时插入图片时就需要采用“路径”的方式来获取图片文件的位置
4. 路径分为 相对路径和绝对路径两种
- 相对路径
路径分类 | 符号 | 说明 |
---|---|---|
同一级路径 |
只需输入图像文件的名称即可,如 <img src="小可爱.jpg">
|
|
下一级路径 |
/
|
图像文件位于 HTML 文件同级文件夹下,假如图像文件存在 imgs 文件夹下,需这样写 <img src="imgs/小可爱.jpg">
|
上一级路径 |
../
|
在文件名之前加入 ../ ,如果是上两级,使用../../ ,以此类推,如<img src="../小可爱.jpg">
|
- 绝对路径
说明:绝对路径以 Web 站点根目录为参考基础的目录路径格式:
"D:Web\imgs\小可爱.jpg" 或者完整的网络地址,例如: "https://imgtu.com/i/5paY5D"注意:
它的写法,符号 \ 并不是相对路径的 /
四、表格 table
作用:
1. 常见显示、展示表格式数据
2. 可以让数据显示的规整,可读性好
4.1 创建表格
说明:
1. 主要由 table、tr、td这三对标签组成,它们是创建表格的核心,缺一不可
2. table 用于定义一个表格标签
tr标签 用于定义表格中的行,必须嵌套在 table 标签中
td(单词全拼:table data) 中文意思是数据单元格的内容,用来定义表格中的单元格,必须嵌套在 tr 标签中
3. 总结一下,一个完整的表格由表格标签(table),行标签(tr),单元格标签(td)组成,没有列的标签,我自己理解是把第一行的 单元格标签 看成表格中的列数。格式:
<!-- boder 是一个属性,意思的表格的边框是1像素,默认是0像素(无边框) -->
<table border="1px">
<!-- 第一行 -->
<tr>
<td>单元格1</td>
<td>单元格2</td>
<td>单元格3</td>
</tr>
<!-- 第二行 -->
<tr>
<td>单元格1</td>
<td>单元格2</td>
<td>单元格3</td>
</tr>
<!-- 第三行 -->
<tr>
<td>单元格1</td>
<td>单元格2</td>
<td>单元格3</td>
</tr>
</table>
效果如下:
4.2 表格属性
作用:
表格的属性主要用来设置表格的样式
属性名 | 含义 | 常用属性值 |
---|---|---|
border | 设置表格的边框(默认boder="0"无边框) | 像素值 |
cellspacing | 设置单元格与单元格边框之间的空白间距 | 像素值(默认为2像素) |
cellpadding | 设置单元格内容与单元格边框之间的空白间距 | 像素值(默认为1像素) |
width | 设置表格的宽度 | 像素值 |
height | 设置表格的高度 | 像素值 |
align | 设置表格在网页中的水平对齐方式 | left、center、right |
如图所示:
4.3 表头单元格标签 th
作用: 一般表头单元格位于表格的第一行或第一列,并且文本加粗居中格式:
<table border="1px">
<!-- 第一行 表头 -->
<tr>
<th>姓名</th>
<th>性别</th>
<th>年龄</th>
</tr>
<!-- 第二行 -->
<tr>
<td>小明</td>
<td>男</td>
<td>18</td>
</tr>
<!-- 第三行 -->
<tr>
<td>小李</td>
<td>男</td>
<td>20</td>
</tr>
<!-- 第四行 -->
<tr><td>小红</td>
<td>女</td>
<td>19</td>
</tr>
</table>
效果图:
4.4 表格标题 caption
说明:
1. caption 元素定义表格标题,通常这个标题会被居中且显示于表格之上
2. caption 标签必须紧随 table 标签之后格式:
<table border="1px">
<!-- 表格标题 -->
<caption>信息表</caption>
<!-- 第一行 -->
<tr>
<th>姓名</th>
<th>性别</th>
<th>年龄</th>
</tr>
<!-- 第二行 -->
<tr>
<td>小明</td>
<td>男</td>
<td>18</td>
</tr>
<tr>
<td>小李</td>
<td>男</td>
<td>20</td>
</tr>
<!-- 第三行 -->
<tr>
<td>小红</td>
<td>女</td>
<td>19</td>
</tr>
</table>
效果如下:
4.5 合并单元格
说明:
1. 两种方式
1) 跨行合并: rowspan="合并单元格的个数"
2) 跨列合并: colspan="合并单元格的个数"
2. 顺序
1) 按照 先上后下 先左后右 的顺序
3. 三步曲
1) 先确定是跨行还是跨列合并
2) 根据 先上后下 先左后右 的原则找到目标单元格,然后写上 合并方式 还有要合并的单元格数量
3) 删除多余的单元格格式:
<table border="1px" width="300px" height="100px">
<!-- 第一行 -->
<tr>
<td rowspan="3"></td>
<td></td>
<td></td>
</tr>
<!-- 第二行 -->
<tr>
<td colspan="2"></td>
</tr>
<!-- 第三行 -->
<tr>
<td></td>
<td></td>
</tr>
</table>
效果如下:
4.6 表格划分结构
说明:
对于比较复杂的表格,表格的结构也就相对的复杂了,所以又将表格分割成了三个部分,分别是题头、正文、脚注,这样可以功能更好的分清表格结构
1) thead: 用于定义表格的头部,用来方标题之类的东西,内部必须拥有标签
2) tbody: 用于定义表格的主体,放数据本体
3) 放表格的脚注之类格式:
<table border="1px">
<!-- 表格标题 -->
<thead>
<caption>信息表</caption>
</thead>
<tbody>
<!-- 第一行 -->
<tr>
<th>姓名</th>
<th>性别</th>
<th>年龄</th>
</tr>
<!-- 第二行 -->
<tr>
<td>小明</td>
<td>男</td>
<td>18</td>
</tr>
<tr>
<td>小李</td>
<td>男</td>
<td>20</td>
</tr>
<!-- 第三行 -->
<tr>
<td>小红</td>
<td>女</td>
<td>19</td>
</tr>
</tbody>
</table>注意:
以上标签都是放到 table 标签中,脚注一般用的不多,就不示例了
效果呢还是一样,没变化
五、列表标签
5.1 认识列表
1. 什么是列表?
答: 前面介绍了表格是用来显示数据的,那么列表就是用来布局的,因为非常整齐和自由2. 概述: 容器里面装载着结构,样式一致的文字或图表的一种形式就是列表3. 特点: 列表最大的特点就是整齐、整洁、有序,可组合自由度高。
5.2 无序列表 ul
说明: 无序列表的各个列表项之间没有顺序级别之分,是并列的格式:
<ul><li>列表项1</li><li>列表项2</li><li>列表项3</li>
</ul>注意:
1. <ul> 标签中只能嵌套 <li>,直接在 <ul> 标签中输入其他标签或者文字,这种做法是不允许的
2. <li>与</li>之间相当于一个容器,可以容纳所有元素
3. 无序列表会带有自己的样式属性
效果如下:
5.3 有序列表
说明: 有序列表即为有排列顺序的列表,各个列表项按照一定的顺序排列定义格式:
<ol><li>我是老大</li><li>我是老二</li><li>我是老三</li>
</ol>
效果如下:
5.4 自定义列表
说明: 常用于对术语或名词进行解释和描述,定义列表的列表项前没有任何项目符号格式:
<dl><dt>我的兴趣爱好</dt><dd>游戏</dd><dd>乒乓球</dd><dd>追剧</dd><dt>我喜欢的明星</dt><dd>胡歌</dd><dd>刘德华</dd><dd>自己</dd>
</dl>
效果如下:
5.5 总结
标签名 | 定义 | 说明 |
---|---|---|
ul
|
无序列表标签 | 里面只能包含 li 没有顺序 |
ol
|
有序列表标签 | 里面只能包含 li 有顺序 |
dl
|
自定义列表 | 里面有 2个 兄弟,dt 和 dd |
六、表单标签
1. 表单标签是什么?
答: 我们注册QQ号时往每个选项中填入信息时,每个选项就是用表单标签来做的2. 说明
1) 表单目的是为了收集用户信息
2) 一个完整的表单通常由表单控件(也叫表单元素)、提示信息和表单域3个部分构成
3) 表单控件包含了具体的表单功能项,分别有单行文本输入框、密码输入框、复选框、提交按钮、重置按钮等
4) 一个表单中通常还需要包含一些说明性的文字,提示用户进行填写和操作
5) 表单域: 相当于一个容器,用来容纳所有的表单控件和提示信息,可以通过它定义处理表单数据所用程序的 url 地址,以及数据提交到服务器的方法,如果不定义表单域,表单中的数据无法传送到后台服务器
6.1 input
控件
说明:
1. input 输入的意思
2. 它是一个单标签
3. 它有很多属性格式:
<input type="属性值" value="你好">
只举例了一些常用的属性
属性 | 属性值 | 描述 |
---|---|---|
type | text | 单行文本输入框 |
password | 密码输入框 | |
radio | 单选按钮 | |
checkbox | 复选按钮 | |
button | 普通按钮 | |
submit | 提交按钮 | |
reset | 重置按钮 | |
image | 图像形式的提交按钮 | |
file | 文件域 | |
name | 用户自定义 | 控件名称 |
value | 用户自定义 | input 控件中的默认文本值 |
size | 正整数 | input 控件在页面中的显示宽度 |
checked | checked | 定义选择控件默认被选中的项 |
maxlength | 正整数 | 控件允许输入的最多字符数 |
- type 属性
说明:
1. 这个属性通过改变值,可以决定属于哪种 input 表单
2. 比如 type="text" 就表示 文本框 可以做 用户名,昵称 等
3. 比如 type="password" 就是表示 密码框,用户输入的内容是不可见的举例:
用户名: <input type="text" />
密 码: <input type="password" />
- value 属性 值
说明:
value 意思是显示默认的文本值
打开网页页面时默认显示指定的文字举例:
用户名: <input type="text" value="请输入用户名" />
- name 属性
说明:
1. name 意思是表单的名字
2. 主要用于区别不同的表单
3. radio 单选按钮属性,这两者经常搭配,因为 radio 如果是一组,必须命名相同的名字,否则就变成多选了举例:
<input type="radio" name="sex" />男
<input type="radio" name="sex" />女
效果如下:
- checked 属性
说明:
表示定义默认状态举例:
<input type="radio" name="sex" checked="checked"/>男
<input type="radio" name="sex" />女打开页面时它就会默认先选中了男,就不放图了,和上图一样,只不过上图那个是我打开页面之后选中的
6.2 label
标签
说明:
用于绑定一个表单元素,当点击 label 标签时,被绑定的表单元素就会获得输入焦点
也就是说,点击 label 标签里面的文字时,光标会定位到指定的表单里面两种写法
1. 用 label 标签直接把 input 表单包起来
<label>用户名:<input type="text" value="请输入用户名"/></label>2. 用 label 的 for 属性规定与哪个表单元素绑定,for 属性值需要与 表单元素的 id 属性值一样
<label for="name1">用户名:</label>
<input type="text" value="请输入用户名" id="name1"/>
6.3 textarea
控件(文本域)
作用:
通过 textarea 控件可以轻松的创建多行文本输入框格式:
<textarea>文本内容</textarea>
文本框和文本域区别
表单 | 名称 | 区别 | 默认值显示 | 用于场景 |
---|---|---|---|---|
<input type="text" />
|
文本框 | 只能显示一行文本 | 单标签,通过 value 显示默认值 | 用户名、昵称、密码 |
textarea
|
文本域 | 可以显示多行文本 | 双标签,默认值写到标签中间 | 留言板 |
6.4 select
下拉列表
说明:
当有多个选项让用户选择时,就使用 select 控件优点: 节约空间格式:
<select><option>选项1</option><option>选项2</option><option>选项3</option>
</select>注意:
1. <select> 中至少包含一对 option
2. 在 <option> 中定义 selected="selected"时,当前项即为默认选中项
效果如下:
6.5 form 表单域
说明:
1. 用于定义表单域,收集和传递用户信息, form 中的所有内容都会被提交给服务器格式:
<form action="url地址" method="提交方式" name="表单名称">各种表单控件
</form>注意:
每个表单都应该有自己表单域
常用属性:
属性 | 属性值 | 作用 |
---|---|---|
action | url地址 | 用于指定接收并处理表单数据的服务器程序的 url 地址 |
method | get/post | 用于设置表单数据的提交方式,值为 get 或 post |
许久不更了,还望多支持
☀️前端基础—【HTML⚡】相关推荐
- html表格联动,html前端基础:table和select操作
html前端基础:table和select操作 发布时间:2020-05-13 09:58:10 来源:亿速云 阅读:196 作者:Leah 这篇文章主要为大家详细介绍html前端基础中有关table ...
- element ui 图片控件 排序_JAVA全栈面试前端基础之四 Vue+Element框架快速开发
本文主要包括以下4个内容 什么是ElementUI Vue 中引入ElementUI Vue+elementUI构建后台管理系统 开源项目推荐 1.什么是ElementUI 官网:https://el ...
- boost log 能不能循环覆盖_前端基础进阶(十四):深入核心,详解事件循环机制...
Event Loop JavaScript的学习零散而庞杂,很多时候我们学到了一些东西,但是却没办法感受到进步!甚至过了不久,就把学到的东西给忘了.为了解决自己的这个困扰,在学习的过程中,我一直在试图 ...
- gif透明背景动画_前端基础系列之bmp、jpg、png、gif、svg常用图片格式浅谈(二)...
IT客栈 作者:大腰子 bmp.jpg.png.gif.svg常用图片格式 之前为大家介绍了几种WEB前端常用的图片格式,对比了它们的特点,参见<前端基础系列之bmp.jpg.png.gif.s ...
- 前端基础知识整理汇总(中)
前端基础知识整理汇总(中) Call, bind, apply实现 // call Function.prototype.myCall = function (context) {context = ...
- 前端基础知识整理汇总(上)
前端基础知识整理汇总(上) HTML页面的生命周期 HTML页面的生命周期有以下三个重要事件: 1.DOMContentLoaded -- 浏览器已经完全加载了 HTML,DOM 树已经构建完毕,但是 ...
- jquery function_前端基础进阶(十三)详细图解jQuery扩展jQuery插件
UI 鉴赏 早几年学习前端,大家都非常热衷于研究jQuery源码. 我至今还记得当初从jQuery源码中学到一星半点应用技巧的时候常会有一种发自内心的惊叹,"原来JavaScript居然可以 ...
- 前端基础-HTML的的标签详解
阅读目录 一.head内常用标签 二. HTML语义化 三. 字符实体 四. h系列标签 五. p标签 六. img标签 七. a标签 八. 列表标签 九. table标签 十. form标签 一. ...
- 前端基础-CSS的各种选择器的特点以及CSS的三大特性
一. 基本选择器 二. 后代选择器.子元素选择器 三. 兄弟选择器 四. 交集选择器与并集选择器 五. 序列选择器 六. 属性选择器 七. 伪类选择器 八. 伪元素选择器 九. CSS三大特性 一. ...
- 前端基础进阶(七):函数与函数式编程
纵观JavaScript中所有必须需要掌握的重点知识中,函数是我们在初学的时候最容易忽视的一个知识点.在学习的过程中,可能会有很多人.很多文章告诉你面向对象很重要,原型很重要,可是却很少有人告诉你,面 ...
最新文章
- iOS10.3 的评论系统
- python【蓝桥杯vip练习题库】ADV-73数组输出
- 同一服务器 数据库间 不同表 的查询
- swiper切换按钮位置改变_swiper插件自定义切换箭头按钮
- 【python】算法引入及算法特性和时间复杂度
- python——全局变量和局部变量
- promise封装ajax
- element 表单回显验证_关于vue el-form表单报错的问题
- 清楚linux缓存文件,Linux删除文件 清除缓存
- 前端ajax数据提交到服务器_详解前端如何让服务器主动向浏览器推送数据
- vba循环通过键盘某个按键按下退出循环_[VBA]For Next与Do Loop循环
- 高性能mysql 第5章 创建高可用的索引
- Fiddler4 抓包分析(基础版)
- Maven经验分享(一)安装部署
- java图书馆抢座系统_java毕业设计_springboot框架的图书馆座位预约占座
- java代码对图片缩放
- 主板温度过高的原因是什么?主板温度高的原因和处理办法
- 【好文】敏捷中国十八年目睹之怪现状
- Win10开了hdr灰蒙蒙的怎么办?
- 服务器藏宝系列,区如其名,这个服务器里果然遍地都是宝藏
热门文章
- K8S、kubernetes no resolver defined to resolve could not be resolved (3: Host not found) 问题解决
- saas 测试_为什么SaaS公司需要进行安全测试?
- java卸载(java卸载 windows installer)
- node.js 链接 数据库
- composite java,java设计模式_Composite模式
- android手机屏幕共享神器踩坑指南
- 在安卓手机上安装Linux子系统
- 做人,该善良时就善良,该勇敢时就要有勇气去对应
- 带你了解地址分配DHCP,IP地址管理方式及分配原则
- 文件下载被浏览器默认打开解决方法