简介Sass 是一款强化 CSS 的辅助工具，它在 CSS 语法基础上增加了变量 (variables)、嵌套 (nested rules)、混合 (mixins)、导入 (inline imports) 等高级功能，这些拓展令 CSS 更加强大与优雅。使用 Sass 以及 Sass 的样式库（如Compass）有助于更好......
YANGWW1111Web前端 · 文档2022-06-26阅读 · 25
属性嵌套 (Nested Properties)有些 CSS 属性遵循相同的命名空间，比如font-family, font-size, font-weight都以font作为属性的命名空间。为了避免了重复输入，Sass 允许将属性嵌套在命名空间中，例如：.funky { font: { family: fantasy; size: 30em; ......
YANGWW1111Web前端 · 文档2022-06-24阅读 · 23
运算 (Number Operations)SassScript 支持 +, -, *, /, %，<, >, <=, >=，==, !=等运算，如果有必要会在不同单位间转换值。p { width: 1in + 8pt; ## in为英寸单位}编译为p { width: 1.111in; }除法运算/(Division and/)/在 CSS 中通常起到分隔数字的用......
YANGWW1111Web前端 · 文档2022-06-24阅读 · 23
圆括号 (Parentheses)圆括号可以用来影响运算的顺序：p { width: 1em + (2em * 3);}编译为p { width: 7em;}函数 (Functions)SassScript 定义了多种函数，有些甚至可以通过普通的 CSS 语句调用：p { color: hsl(0, 100%, 50%);}编译为p { color: #ff0000;}关键词......
YANGWW1111Web前端 · 文档2022-06-24阅读 · 24
webpack webpack是一个静态模块打包工具；webpack 处理应用程序时，会在内部从一个或多个入口点构建一个依赖图(dependency graph)，然后将项目中所需的每一个模块组合成一个或多个bundles 导出。webpack的核心概念有如下：入口(entry)：指......
YANGWW1111Web前端 · 文档2022-06-23阅读 · 32
1. CSS预处理器CSS预处理器定义了一种新的编程语言，为CSS增加了一些编程特性，让CSS更加简洁、强大、易维护，常见的CSS 预处理器语言有 scss（sass）、less 等。2.SASS和SCSS的区别除了文件后缀不同（分别是“.sass” 和 “.scss”）......
YANGWW1111Web前端 · 文档2022-06-23阅读 · 32
层级嵌套#main p { color: #00ff00; width: 97%; .redbox { background-color: #ff0000; color: #000000; }}父选择器&a { font-weight: bold; text-decoration: none; &:hover { text-decoration: underline; } // 此处的 & 等价于父元素 a body.firefox & { font-weight:......
YANGWW1111Web前端 · 文档2022-06-23阅读 · 25
CLI(@vue/cli) CLI(@vue/cli) 是一个全局安装的 npm 包，提供了终端里的vue命令，如：vue create、vue ui等；CLI 服务 (@vue/cli-service)CLI 服务 (@vue/cli-service) 是一个开发环境依赖，是一个局部安装在每个项目中npm包；CLI 服务构建于webpack和webpack......
YANGWW1111Web前端 · 文档2022-06-22阅读 · 33
1. 拉取gitlab docker镜像docker pull gitlab/gitlab-ce2. 创建数据卷docker volume create gitlab-data-vol;docker volume create gitlab-log-vol;docker volume create gitlab-config-vol;3.启动gitlab注：自行根据宿主机情况设定映射端口docker run --detach--publish 10443:443 --publish ......
1.0 禁止换行white-space:nowrap;overflow:hidden;text-overflow:ellipsis;/*使用省略号来代表被修剪的文本*/2.0 CSS通过索引的方式选择元素div:nth-child(1){}// 或div:nth-of-type(1){}两者区别详见 ： https://sidoc.cn/doc/1227.html3.0 CSS阴影box-shadow: 3px 1px 12px 1px#c......
YANGWW1111Web前端 · 文档2022-06-20阅读 · 567