css中有哪些命名规范 1、小写字母加连字符(又称烤串命名法)，禁止下划线和驼峰命名。 2、布局：以g命名空间。 3、状态：以s为命名空间。 表示动态、交互状态。 4、工具：以u为命名空间。...5、组件：以m为命名空间。 表示可重用、移植的组件模块。...} .modExample { padding-left: 15px; } /* good */ .mod-example { padding-left: 15px; } 以上就是css...中的命名规范，希望对大家有所帮助。...更多css学习指路：css教程
.NET中至少有6种定时器，每一种定时器都有它的用途和特点。根据定时器的应用场景，可以分为UI相关的定时器和UI无关的定时器。本文将简单介绍这6种定时器的基本用法和特点。
前言 .NET中至少有6种定时器，每一种定时器都有它的用途和特点。根据定时器的应用场景，可以分为UI相关的定时器和UI无关的定时器。 本文将简单介绍这6种定时器的基本用法和特点。
选择器的命名规范 1.模块化命名 例如： 与布局相关的样式以“g”为开头。如“g-content”和“g-header”； 与挂钩相关的样式以“j”为开头。...以上的说明只是举例，大家可以根据项目需求自定义开头的字符，这样做的目的是使CSS代码整洁易维护。...针对后一种情况，只要增加新样式选择器的权重值就可以完全避开这个问题，无需用到“！important”。...Hack 所谓“CSS Hack”，就是在样式表中加入少许特殊符号，让能够辨识不同符号的浏览器在同一个元素上计算出来的样式各不相同。...因此在过去，我们通常要针对个别怪异的浏览器撰写有针对性的CSS。
CSS中的颜色是由三原色：红、绿和蓝按不同比组成的。...这两张图片展示了三原色： CSS颜色有三种表示方式 颜色名称，如”red”、”green”、”blue”等 RGB值，如 “rgb(255,0,0)” #符号后接4位的十六进制数值，如 “#ff0000...” CSS中使用颜色名称指定颜色 CSS中使用RGB值指定颜色 CSS中使用十六进制值指定颜色 RGB颜色查询对照表
CSS背景属性用于定义元素的背景效果，常用的有5种背景属性：背景颜色、背景图片、背景图片重复展示的方式、背景附着的方式以及背景位置 background-color background-image background-repeat...background-attachment background-position 背景颜色background-color CSS中可以通过background-color属性指定元素的背景颜色，例如指定...body元素的背景颜色： body { background-color: lightblue; } 颜色的表示方式也有3中，具体可参见RGB颜色对照表以及详细介绍CSS中的三种颜色表示方式 背景图片...background-image CSS通过background-image属性指定元素的背景图片。...background-image: url("https://img-blog.csdn.net/20161118220122095"); } 背景图片显示方式background-repeat CSS
我们单独写一份样式表（css 文件 深空蓝.css），以一个特定的命名开头（比如 .blue-theme），然后在这个 css 文件中，完成我们第二套皮肤的样式代码，然后当我们点击换肤的时候，就将 blue-theme...所以，我们还是用上面的方法，给这个生成的css文件里面的每一个 css 样式加上一个独特的命名前缀，然后换肤的时候，就将这个 class 添加到 body 上面，如此一来，也能实现很丰富的换肤功能（因为我们可以自己配很多套好看的配色...） 现在摆在眼前的一个需要解决的问题是：这个 css 文件加命名空间怎么加？...image.png 我们看一下这个工具生成的，或者 配置页面 导出的这个 css 文件，混淆压缩的代码，手动给每一个样式外面包裹一个 class 来做命名空间是不现实的，所以这里要用到一个 gulp 插件...ElementUI 官网中有实现动态换肤，它能让用户自定义颜色值，而且展示效果也更加优雅。
总共 99% 的calc()表达式使用了一种或两种单位类型。 3. 全局关键字 下面是最常用的全局关键字以及其分布： image.png 4....最常用的颜色关键字值： 四、图片 1. CSS中图片格式 下面是CSS中图像格式比例分布： 2....命名 对于自定义属性的命名，最常使用的自定义属性名称如下： image.png 使用最多的自定义属性是--wp开头的，这些都是WordPress网站中的属性。 2....重复声明 “声明重复”的数量——通过确定有多少声明使用相同的属性和值，以及有多少声明在页面的内部是唯一的，从而粗略估计样式表的效率。 下面是每个页面重复声明的分布： image.png 2....函数中有 28% 是修改颜色的函数（例如darken、mix），另外 6% 用于读取颜色（例如alpha、blue）。
「①h1的美化」 如果纯用HTML，是没法对标题进行颜色设置的。 但使用CSS，就可以对标题进行各种样式的设置，上图只举了颜色这个例子。...其中有最基本的三种选择器： ? 「①id选择器」 格式为：#+id名{} 关于id我做了个测试，发现不能用纯数字，老实说我还挺奇怪的，一般id不都是纯数字么。...就当是CSS的命名规则好了，不能是纯数字，否则没有作用。 其中id选择器是唯一的，也就是一个id在一个HTML文件中只能有一个。 「②类选择器」 格式为：....在HTML中有一个div标签，这个标签和CSS结合起来很有用。 比如上述例子中，同样是h1标签，但是只渲染div标签中的h1标签。 ?...「③属性选择器」 格式为：标签名[属性名="对应的值"]{} font标签中有很多属性，CSS可以指定其中对应的属性。
在 CSS 中，颜色无处不在，它可以作为文字、背景、阴影、表格、边框、链接等属性。...我们在 CSS 中使用的大多数颜色都是 hex 和 RGB，其实表示颜色的方式有很多，下面就来看看CSS中的颜色体系。 1....CSS 命名颜色 CSS中提供了148个命名颜色，所有浏览器都支持这些名称，这些名称都是被预定义过色值的。...除了颜色名称，还有一些其他命名的颜色和关键字值得一提： （1）transparent transparent关键字用作rgba(0, 0, 0, 0)的快捷方式，它表示完全透明。...值越高，颜色越黑。 与 HSL 一样，色调可以是 0 到 360 内的任何值。黑度和白度用来控制有多少黑色和白色混合在已选色调中，它们也是0-100%之间的值，当为100%时，就会出现全黑或者全白。
其中每个颜色都有六个亮度值，分别用 -lightest、-lighter、-light、-dark、-darker、-darkest 表示，此处有参考 tailwindcss 的颜色命名。...不过 helper 的命名比较简单，因为几乎大多数都是单一的 CSS 样式，所以命名策略基本都是对 CSS 属性的抽象与简化。 数字型命名 VS....尺寸型命名 我在工作中接触过两种 helper 序列的表示方法，一种是常见的数字型，另一种是尺寸型。以 padding 为例： 数字型 .p-5 { padding: 5px !...关于强度表示法 通过 font-weight 说一下关于强度的表示法，font-weight 的 CSS 属性本身就有两种表示法，一种是直接文字命名，比如 .f-s-thin , .f-s-normal...不过这只是暂时的想法，毕竟我们已经有一套轻量级 CSS 框架了。 序列数量 因为 helper 是循环生成的，所以循环的数量决定了 helper 的丰富度。那么循环的数量多少合适呢？
命名空间 我对于命名空间的理解：属于 less 自己的命名空间，也就是这些代码并不会在转换后的 CSS 文件中出现，因为它只属于 less。...所以，其实也就是上述例子中，类似函数存在的那些模板选择器，当在书写选择器时，在其后面增加 () 括号，则表示这个选择器只属于 less 的命名空间，转成 CSS 后并不会出现。...内置函数 less 内置了一些基础函数，可用于转换颜色、处理字符串、算术运算等，这里列举一些函数： color("#aaa"); //输出 #aaa， 将字符串的颜色值转换为颜色值 image-size...下面就主要列一些不同的地方： 变量 Sass 中的变量用 $变量名: 定义，用 $变量名 使用，其余跟 Less 差不了多少。...另外，教程中也说了： 除非你的代码中有偏复杂的逻辑，否则没必要在日常开发的样式表中使用条件语句。实际上，条件语句主要适用于库和框架。 其他区别，等用段时间，熟悉了再来讲讲。
它表现为一种对人类友好的表达颜色的方式，因为它只是一种色调，加上一定量的白色或黑色以使其变亮或变暗。...你可以从另一种颜色创建一种颜色，访问所用颜色函数命名的三个通道值，并有机会调整这些通道。总而言之，这是一种非常酷且强大的颜色语法。...在以下示例中，BEM 命名约定范围可以转换为实际意图。BEM 选择器试图将 header 元素的颜色范围限定为具有命名约定的 .card 容器。这要求header上有这个类名，从而完成目标。...这不能通过任何命名约定或预处理器来完成；它很特别，只有浏览器内置的 CSS 才能做到。...: line-through; } 如果你熟悉状态机，可能会注意到 toggle() 有多少交叉。
为了克服这种局限性，我们将引入另外2种选择器- ID选择器和类选择器。 ID选择器 每个 HTML 标签都有一个 id 属性，具有和其它不一样的命名。...例如，HTML 文档中有2个 标签，我们可以将它们中的一个命名为“para1”，而另一个命名为“ para2”。要在 CSS 代码中选择它们，需要在 ID 名称之前添加“＃”。...例如，如果 HTML 文档中有4个 标签，我们将其中的两个命名为“group1”。要在 CSS 代码中选择它们，需要在其类名之前添加一个点字符（.）。...CSS背景 可以通过以下的 CSS 背景属性设置网页的背景： 背景颜色 我们使用 backgrounf-color 属性来设置任何 HTML 元素的背景颜色，包括 标签。...文本 网页上的任何文本效果，都可以通过以下的 CSS 属性来设置： 颜色 color属性用于设置任何 HTML 元素的文本颜色。
例如： 2.1.2.1 当给某个元素设定 hover 样式时 2.1.2.2 当 body 元素有某个 classname 时 2.1.3 属性嵌套 有些 CSS 属性遵循相同的命名空间...2.2 代码注释 SCSS 支持两种注释： 标准的css多行注释 /* ... */ 会编译到.css文件中 单行注释 // 不会编译到.css文件 2.3 SCSS 变量...嵌入选择器 2.5.1.3 使用变量 2.5.1.4 使用变量（多参数） 注意：必须多少参数，多少值，没有值可为0 2.5.1.5 指定默认值 2.5.1.6...） SCSS 包含很多操作颜色的函数。...例如：lighten() 与 darken()函数可用于调亮或调暗颜色，opacify()函数使颜色透明度减少，transparentize()函数使颜色透明度增加，mix()函数可用来混合两种颜色。
解题不考虑兼容性，题目天马行空，想到什么说什么，如果解题中有你感觉到生僻的 CSS 属性，赶紧去补习一下吧。 不断更新，不断更新，不断更新，重要的事情说三遍。...谈谈一些有趣的CSS题目（一）-- 左边竖条的实现方法 谈谈一些有趣的CSS题目（二）-- 从条纹边框的实现谈盒子模型 谈谈一些有趣的CSS题目（三）-- 层叠顺序与堆栈上下文知多少 谈谈一些有趣的CSS...- 结构性伪类选择器 谈谈一些有趣的CSS题目（十一）-- reset.css知多少 谈谈一些有趣的CSS题目（十二）-- 深入探讨 CSS 特性检测 @supports 与 Modernizr 谈谈一些有趣的...CodePen Demo（-webkit- Only） 这里使用了 mix-blend-mode: screen 滤色模式，这是一种提亮图像形混合模式。...CodePen Demo（-webkit- Only） 不用怀疑你的眼睛，上图的效果是纯 CSS 实现的效果，运用了多种颜色混合模式实现颜色叠加，变亮等效果。
楼层区 floor 注意这个floor 一个大盒子 包含， 不要给高度，内容有多少，算多少 ? 2). 家用电器模块 ?...知识点 -过渡(CSS3) 过渡（transition)是CSS3中具有颠覆性的特征之一，我们可以在不使用 Flash 动画或 JavaScript 的情况下，当元素从一种样式变换为另一种样式时为元素添加效果...3 属性 属性就是你想要变化的 css 属性， 宽度高度 背景颜色 内外边距都可以 。如果想要所有的属性都变化过渡， 写一个all 就可以。...同时 需要新的 list.css 文件 这个 样式文件，里面只写 list.html 结构里面的内容就好了 2)....H5 命名为 sk_goods_title 3号 位置 为 价格 div 命名为 sk_goods_price 4号位置 为 div 命名为 sk_goods_progress 此处，我们 采取 代码的形式
如果将 元素的背景颜色设置为红色，则所有 都将被强制继承红色背景。...即将分享的第二种方法是使用普通的 CSS，所以你也可以使用它！ 方法 2：使用 CSS 属性选择器 第二种方法 使用CSS属性选择 器执行稍微更复杂的选择。...所以，如果你看到一个像那样的名字，比如 form__row ，你将立即知道 .form 块中有一个 row 元素。 ? ? BEM 元素有两个优点 ： 你可以让 CSS 的优先级保持相对扁平。...你会命名什么来保持在上下文中有意义？ 在这种情况下，我一般会为 block__item 创建一个名为 .item 的伪块。看下面的HTML。 ? 伪块，正如名字所示，是伪的。...但是，在.block__item中有连接到 .item 的元素中。 在我的 CSS（Sass）中，我在 .block__item 中嵌套 .item 元素，赋予了它所需的上下文。 ?
CSS命名规则 4、不允许通过1、2、3等序号进行命名 5、避免class与id重名 6、id用于标识模块或页面的某一个父容器区域，名称必须唯一，不要随意新建id 7、class用于标识某一个类型的对象...8、尽可能提高代码模块的复用，样式尽量用组合的方式 9、规则名称中不应该包含颜色（red/blue）、定位（left/right）等与具体显示效果相关的信息。应该用意义命名，而不是样式显示结果命名。...，则颜色取值应该大写。...其他 1、字体名称请映射成对应的英文名，例如：黑体(SimHei) 宋体(SimSun) 微软雅黑 (Microsoft Yahei)，如果字体名称中有空格，则必须加单引号。...6、制作css sprites时，尽量把颜色相近的图标放在一起，存储为png8格式，存储完以后还能用一些压缩工具进行无损压缩。 7、避免过小的背景图片平铺。 8、尽量少用!
从另一个角度来说，css的工程化会遇到更多的挑战，因为css不像JS，它的语法本身经过这么多年并没有发生多少的变化（css3也仅仅是多了一些属性而已），对于css语法本身的改变也是一个工程化的课题 如何解决...解决类名冲突 一些第三方机构提出了一些方案来解决该问题，常见的解决方案如下： 「命名约定」 就是提供一种命名的标准，来解决冲突，常见的标准有： BEM OOCSS AMCSS SMACSS 其他 我主要以...BEM为例说下： BEM是一套针对css类样式的命名方法。...，绝对不重名 通过命名规范来限制类名太过死板，而css in js虽然足够灵活，但是书写不便。...预编译器的原理很简单，即使用一种更加优雅的方式来书写样式代码，通过一个编译器，将其转换为可被浏览器识别的传统css代码。
领取专属 10元无门槛券
手把手带您无忧上云
云服务器
即时通信 IM
ICP备案
云直播
实时音视频
