css
付月半子
月亮很亮,亮也没用,没用也亮。
展开
-
颜色反转规则
颜色反转规则原创 2023-02-03 17:26:04 · 1092 阅读 · 0 评论 -
border-radius:x x x x / y y y y
border-radius: 接受8个属性,前四个为x轴,后四个为y轴,以斜杠划分x轴、y轴,即border-radius:左上较 右上角 右下角 左下角 / 左上角 右上角 右下 角 左下角 ;(x轴/y轴 ),如:border-radius: 100px 0 100px 0/100px 0 100px 0。border-radius: 2em 1em 4em / 0.5em 3em;//效果等同于border-top-left-radius: 2em 0.5em;border原创 2022-02-10 11:04:43 · 389 阅读 · 1 评论 -
解决element-ui表格表头内容太长时的换行问题
用render-header(列标题 Label 区域渲染使用的 Function,即渲染这一列的列标题区域所用的函数)HTML:<el-table border :data="tableData" v-loading="loading" @row-dblclick="handleSelect" :row-class-name="tableRowClassName"> <el-table-column v-for="(item,index) in t.转载 2021-12-24 09:50:25 · 2578 阅读 · 0 评论 -
css中“~”(波浪号)、“,”(逗号)、 “ + ”(加号)和 “ > ”(大于号)是什么意思?
1、群组选择器(',') 2、后代选择器(空格) 3、子元素选择器('>') 4、相邻兄弟选择器('+') 5、兄弟选择器('~')转载 2021-12-22 10:23:15 · 8844 阅读 · 2 评论 -
::before 和:before 区别
::before 是一个伪类元素,代表生成的内容元素,表示相应元素的可抽象样式的第一个子元素,即:所选元素的第一个子元素 利用::before可以把需插入的内容插入到元素的其他内容之前,并且默认内联显示。::before需要使用content属性来指定内容的值。区别:单冒号(:)用于CSS3伪类,双冒号(::)用于CSS3伪元素。伪元素和伪类之所以这么容易混淆,是因为他们的效果类似而且写法相仿,但实际上css3为了区分两者,已经明确规定了伪类用一个冒号来表示,而伪元素则用两个冒号来表示。但因...转载 2021-11-25 11:46:01 · 827 阅读 · 0 评论 -
vue+element+sortablejs实现表格列的拖拽
1. css: dragTable.css@charset "UTF-8";.w-table{ height: 100%; width: 100%; float: left;}/* 拖动过程中,鼠标显示样式 */.w-table_moving .el-table th .thead-cell{ cursor: move !important;}.w-table_moving .el-table__fixed{ cursor: not-allowed;}.w-..原创 2021-09-13 11:09:48 · 1317 阅读 · 0 评论 -
vue element tree自定义树。内容过长显示...鼠标悬浮显示全部
css/*树悬浮框: 名字过长则显示...*/.span-ellipsis { width: calc(100% - 4px); overflow: hidden; white-space: nowrap; text-overflow: ellipsis; min-width: auto; padding: 4px 2px; border-radius: 4px;}应用<el-tree :data="Datas" :props="defaultProps原创 2021-09-01 15:05:29 · 5023 阅读 · 0 评论 -
css滚动条隐藏/显示,不产生晃动
实现效果:内容超出div高度,出现滚动条。鼠标在div上时滚动条显示,鼠标不在div上时滚动条隐藏。鼠标不在div上时:在右侧为滚动条预留10px宽度。(注:10px是自己设置的滚动条的宽度,若滚动条宽度为8,则改为8px)鼠标移入div上后:宽度还原100%。但是overflow-y值一定是scroll,不能是auto。因为scroll一直占据一个宽度,而auto是出现滚动条才占据宽度,会出现晃动。值 描述 测试 visible 不裁剪内容,可能会显示在内容框..原创 2020-09-16 15:47:10 · 965 阅读 · 0 评论 -
css滚动条样式
<div class="acrossTimeLine-body-box"> <div> <div> ... </div> </div></div>/* 内部滚动条样式 ----- begin*/.acrossTimeLine-body-box ::-webkit-scrollbar { /*滚动条整体样式*/...原创 2020-09-15 11:22:25 · 1451 阅读 · 0 评论 -
vue-element更改分页样式(颜色)
默认样式:更改颜色为:css:/*带背景的分页按钮背景色begin*/.el-pagination.is-background .el-pager li:not(.disabled).active { background-color: #08C0B9; color: #FFF;}.el-pagination.is-background ....原创 2020-04-20 15:50:16 · 10992 阅读 · 7 评论 -
vue 设置浏览器左上角图标
1.进入项目根目录下的index.js2.将自己的.ico图标放入static目录下,放入src下找不到。3.在<head></head>中加入 <link rel="icon" type="image/x-icon" href="static/heart_64px.ico">如下,已改...原创 2020-01-07 10:45:55 · 3418 阅读 · 0 评论 -
js鼠标移动到某个元素上改变鼠标样式,如悬浮小手、禁用鼠标、等待...
js鼠标移动到某个元素上改变鼠标样式:则在这个元素的样式里加上 cursor:(你想改的样式)。eg:<table border="0" style="cursor:default">原创 2018-07-12 10:45:11 · 15745 阅读 · 2 评论 -
CSS:div中的内容垂直居中
flex布局<div class="flex"> <div> <p>我是多行文字我是多行文字我是多行文字我是多行文字</p> <p>我是多行文字我是多行文字我是多行文字我是多行文字</p> </div></div>原创 2019-02-28 09:21:40 · 373 阅读 · 1 评论 -
css:div的不透明度opacity问题(父级的opacity会影响子级)
不透明度会作用于整个元素以及它所有的子元素子元素不透明度=父元素不透明度乘以子元素本身不透明度,而opacity的范围是0~1,所以就算把子级的div的opacity设为1也没有用,子元素是没办法获得大于父元素的不透明度值的。解决方法:如果是万不得已视觉排版效果上的需要,可以分别设置两个兄弟元素的不透明度,然后用position的方法将一个放在另一个的上方。...原创 2019-02-28 10:58:10 · 2988 阅读 · 0 评论 -
css 画多边形、不规则边框
1.画梯形: width: 200px; height: 0px; border-top: 0px; border-bottom: 70px solid #1E6AA4; border-right: 50px solid transparent; border-left: 50px solid transparent;2.画三角形: ...原创 2019-07-10 16:03:47 · 15621 阅读 · 1 评论 -
css 动态计算宽高、添加背景边框
1.动态计算宽高 width: 100%; height: calc(100% - 40px); //-号两旁必须加空格2.添加背景边框(4个小角角)background: linear-gradient(to left, #23fff8, #23fff8) left top no-repeat, linear-gradient(to b...原创 2019-07-05 14:22:54 · 394 阅读 · 0 评论 -
css 自定义悬浮框
<html><head> <meta charset="UTF-8"> <title>自定义悬浮框</title> </head><style> /* 自定义悬浮框 begin */.dui-tips { position: relative; ...转载 2019-07-25 16:05:19 · 1795 阅读 · 0 评论 -
css发光动画
<!DOCTYPE html><html> <head><meta charset="UTF-8"> <title>横向滑动</title> <meta name="viewport" content="width=device-width, initial-scale=1.0"> ...原创 2019-10-08 10:24:37 · 617 阅读 · 0 评论 -
vue 监听某div滚动条的滚动事件
监听此div , 定义ref <div class="productSec" ref="rightContent" @mousewheel="scrool">mounted: function(){ //在mounted钩子函数绑定滚动条事件 this.$refs.rightContent.addEventListener('scroll', this.scroo...原创 2019-10-09 16:36:15 · 10771 阅读 · 0 评论 -
CSS3自定义滚动条样式 -webkit-scrollbar
滚动条组成::-webkit-scrollbar 滚动条整体部分::-webkit-scrollbar-thumb 滚动条里面的小方块,能向上向下移动(或往左往右移动,取决于是垂直滚动条还是水平滚动条)::-webkit-scrollbar-track 滚动条的轨道(里面装有Thumb)::-webkit-scrollbar-button 滚动条的轨道的两端按钮,允许通过点击微调小方块的位置。...原创 2018-07-11 16:33:13 · 251 阅读 · 0 评论