Day1

从今天开始记录

$HTML$ 篇：

$src$ 和 $href$ 区别

主要功能：加载外部资源

1. $src$ 当浏览器解析到该元素的时候，会暂停其他资源的加载和处理，直到该资源加载完成。

$href$ 指向外部资源所在的位置，和当前元素位置建立链接，当浏览器识别到他指向的位置，将其下载的时候不会阻止其他资源加载解析。

$script$ 标签中 $defer$ 和 $async$ 的区别
主要功能：都表示异步加载外部 $js$ 脚本，不会阻碍页面的加载解析。

执行顺序: 多个标签 $async$ 不能保障先后的执行顺序，但是 $defer$ 可以.
是否立即执行：$async$ 加载完脚本后会立即执行，但是 $defer$ 是要等文档解析完成之后才执行.

$CSS$ 篇

隐藏元素的方式

$display: none :$ 元素在文档中不存在，不会占据位置。交互失效。
$visibility: hidden :$ 元素在文档中的位置还保留，仍然会占据空间。交互禁用。
$opacity: 0 :$ 将透明度设为0。仍然可以交互。
$z-index:$ 负值 : 直接将元素放置到最下层，利用其他的元素来遮盖。可以触发交互。
$position: absolute$ : 将元素定位到可视区域外。无法交互。

文本溢出

单行文本溢出

复制代码

overflow: hidden;//溢出隐藏
text-overflow:ellipsis;//溢出的部分用省略号表示
whtie-space:nowrao;//规定段落中的文本不进行换行

多行文本溢出

复制代码

overflow: hidden;//溢出隐藏
text-overflow:ellipsis;//溢出的部分用省略号表示
display:-webkit-box;//作为弹性伸缩盒子模型显示

$Sass$ 和 $Less$ 的区别

都是 $CSS$ 预处理器，是 $CSS$ 上的一种抽象层。他们是一种特殊的语法/语言编译成了 $CSS$ 。他们增加了 $CSS$ 的复用性。

编译环境: $Sass$ 是在服务器端处理。$Less$ 需要引入 $less.js$ 来处理 $Less$ 代码输出 $CSS$ 到浏览器，也可以在开发服务器将 $Less$ 语法编译成为 $CSS$ 文件，输出 $CSS$ 文件到生产包目录。
变量符号不一样， $Less$ 的是 $@$ ,而 $Scss$ 的是 $ 。
$Sass$ 支持条件语句，可以使用 $if$ $else$ $for$ 循环等。

水平垂直居中

利用绝对定位:

绝对定位

复制代码

.parent{
 position :relative;
}
.child{
 position : absolute;
 left: 50%;
 top: 50%;// 将元素左上角定位到页面中间。
 transform: translate(-50%,-50%);
}

2.绝对定位（2）
绝对定位2

复制代码

.parent{
 position :relative;
}
.child{
 position : absolute;
 top: 0;
 bottom: 0;
 left: 0;
 right: 0;
 margin: auto;//对应方向实现平分，适用于有宽高的情况。
}

$flex$ 布局

flex布局

复制代码

.parent{
display: flex;
justify-content: center;
align-items: center;//通过align-items:center和justify-content:center设置容器的垂直和水平方向上为居中对齐，然后它的子元素也可以实现垂直和水平的居中。

}

英语篇

为了英语四级，最后一次考试了，必须要过.

稍后写四级的复习内容。

$logical$ : 合乎情理的

$outdo$ 胜过

$grit$ 勇气

$be$ $bound$ $to$ 一定，必然

$overrate$ 高估

英语 25年6月第二篇阅读，自己写+小破站视频讲解，真的太菜了。。

从今天开始记录

HTML 篇：

\(CSS\) 篇

英语篇

$HTML$ 篇：