随笔分类 - css3
摘要：### demo ``` test demo 这是一个没有 bg 或 line 的 cu-tag 这是一个带有 bg- 的 cu-tag 这是一个带有 bg-开头 的 cu-tag 这是一个带有 line- 的 cu-tag ``` ![](https://img2023.cnblogs.com/b
阅读全文
摘要：``` .cu-tag[class*="line-"] { border-top-right-radius: 6px; border-bottom-right-radius: 6px; } ``` * 解析 ``` 这是一个 CSS 样式代码，它选择任何包含有 `class` 属性且包含 "line
阅读全文
摘要：* 在CSS中，加号（+）是一个相邻兄弟选择器，用于选择指定元素后面满足条件的第一个相邻兄弟元素。 ### demo ``` test demo 这是第一段落 这是第二段落 这是第三段落 这是第四段落 ``` ,linear-gradient(#2d323b, #2d323b); background-image:linear-gradient(45deg,red,blue); backg
阅读全文
摘要：CSS中 > 和 >>> 都是用来选择子元素的选择器，不过两者有一定的区别。 CSS中 > 只能选择直接子元素，而不能选择孙子元素及以下的后代元素。 例如，.parent > .child 可以选择 .parent 的直接子元素中的类为 .child 的元素，但是不能选择孙子元素中的 .child
阅读全文
摘要：首先搞清楚scoped是干啥的？scoped的引入主要是上线了样式的模块化私有化，即当前组件的样式只对当前组件起作用。 当vue组件被vue-loader解析的时候，对于style上加了scope属性的组件，会主动加上data-v-xx的属性来唯一标识当前组件，若当钱组件内部存在子组件，只有子组件的
阅读全文
摘要：mode 有效值： mode 有 13 种模式，其中 4 种是缩放模式，9 种是裁剪模式。 设置height:auto, mode="widthFix" 就行咯～～～ https://blog.csdn.net/qq_40095973/article/details/80352144
阅读全文
摘要：操蛋的地方，在于 blur 阴影的模糊距离，spread设置的阴影大小2个属性，概念有点模糊不清！！！！ 1.blur 阴影的模糊距离 到底是什么距离,依我个人理解:比如blur是10px，沿边界内外10px，都模糊；或者说，把内10px的颜色，淡化到内外10px范围内； 所以blur越大，颜色越淡
阅读全文
摘要：demo 1 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>css设置高和宽相等～～</title> <style> *{ margin: 0; padding: 0; } .box{ width: 300px;/* 也可以用
阅读全文
摘要：<!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="ie=edge" /> <title>div围绕中心点旋转demo</title>
阅读全文
摘要：按照text-overflow: ellipsis;使用规则，在标签样式中添加该属性未生效，例如： 写道 .text { text-overflow: ellipsis; } 长文字长文字长文字长文字长文字长文字长文字长文字长文字长文字长文字长文字长文字长文字 之后，发现并没有达到我们想要的预期效果
阅读全文
摘要：.z-dropdown-menu { background-color: rgba(4, 26, 101, 0.9); border: 1px solid #3e9edd; z-index: 99999; &__item { // & 代表.z-dropdown-menu font-size: 1.
阅读全文
摘要：class是tags-li，并没有active 做悬浮效果 .tags-li:not(.active):hover { background: #f8f8f8; } class是tags-li 并且也有active .tags-li.active { color: #fff; }
阅读全文
摘要：跑一个h5，pc端vue项目，pc端编辑后，样式，字体有变小问题 import "lib-flexible/flexible.js"; 原本个文件是用来适配移动端的，所以这里需要修改一下源码 function refreshRem() { var width = docEl.getBoundingC
阅读全文
摘要：space-evenly 等间距展示 阮一峰的无此属性解释 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <me
阅读全文
摘要：/** * Created by lvlq on 16/1/29. */ !function (N, M) { function L() { var a = I.getBoundingClientRect().width; a / F > 2000 && (a = 2000 * F); var d
阅读全文
摘要：h5 页面设计长度，宽度换算 设计图，宽度安装750px的标准来的 @function px2rem($px) { @return $px / 75px* 1rem; } rem（font size of the root element）是指相对于根元素的字体大小的单位。简单的说它就是一个相对单位
阅读全文
摘要：vh 和vw和百分比区别 vw和vh的大小是相对于视口的宽度和高度。 而百分比是相指所占父元素的百分比。 **视口单位** **在PC端，视口指的是在PC端，指的是浏览器的可视区域；** 而在移动端，它涉及3个视口：Layout Viewport（布局视口），Visual Viewport（视觉视口
阅读全文
摘要：display: flex; flex-wrap: wrap; justify-content: flex-start!important; 没有起到左侧开始排列效果，看你是box子框中设置了margin：auto属性，会吧flex-start给冲掉
阅读全文
