CSS
濮家大少
我是一个粉刷匠(前端开发)
展开
-
vue修改Element UI样式,样式穿透
在vue组件中,为了使样式私有化(模块化),不对全局造成污染,在style标签上添加scoped属性,以表示它只属于当下的模块。这样在打包的时候会生成一个独一无二hash值,这样父组件的样式就不会影响到子组件了。但是如果你要想修改子组件的样式,就只能修改公共的样式,这样的话其他使用这个组建的地方都会改变,需要在组件中局部修改第三方组件的样式,而又不想去除scoped属性造成组件之间的样式污染。此时只能通过>>>,穿透scoped。有些Sass 之类的预处理器无法正确解析 >>原创 2020-08-10 12:57:48 · 12005 阅读 · 0 评论 -
霓虹灯特效按钮
效果:html部分<div class="body"> <a href="#">Button</a> <a href="#">Button</a> <a href="#">Button</a></div>css部分.body{ display: flex; flex-direction: column; justify-content: center;原创 2020-07-17 18:22:45 · 161 阅读 · 0 评论 -
一行css代码实现禁用事件触发
.disabled-trigger pointer-events:none;}作用: 禁用默认事件,冒泡事件,鼠标事件,键盘事件等原创 2020-02-17 17:13:57 · 409 阅读 · 0 评论 -
rem的使用
rem是相对于根元素,相对于根元素font-size计算值的倍数,这样就意味着,我们只需要在根元素确定一个参考值,这个参考值设置为多少,完全可以根据您自己的需求来定。1rem等于html根元素设定的font-size的px值,假如我们在css里面设定下面的css。html{font-size:14px}那么后面的CSS里面的rem值则是以这个14来换算,例如设定一个div宽度为3rem,高...原创 2019-11-20 17:39:11 · 312 阅读 · 0 评论 -
input & button对不齐、有间隙、高度不一致等问题解决方法
1.input和button对不齐的原因对不齐是因为行内元素的基线是不同的,所以会导致高低不同。解决办法:每一个元素都加上下面即可;vertical-align:middle;如下.content{ width:200px; height:30px; vertical-align:middle;}.btn{ width:80px; heigh...原创 2019-10-24 10:58:40 · 8082 阅读 · 2 评论 -
CSS渐变知识点
渐变知识点一、渐变介绍1.什么是渐变渐变指的是多种颜色平缓变化的一种显示效果。2.渐变的主要因素色标:一种颜色 及其 出现的位置一个渐变是由多个色变组成(至少两个)二、渐变的分类线性渐变——以直线的方向来填充颜色属性:background-image取值:linear-gradient(angle,color-point1,color-point2…)angle:表示渐变...原创 2018-11-15 10:44:47 · 524 阅读 · 0 评论 -
边框线笔记
边框线笔记一、内容溢出当内容多,元素区域小的时候,就会产生溢出,默认都是纵向溢出的。属性:overflow,overflow-x,overflow-y1.visible 可见的,默认值,溢出可见2.hidden 隐藏的,溢出的内容全部隐藏,不可见。3.scroll 显示滚动条,溢出时,可用4.auto 自动,溢出时才显示滚动条并可用二、 边框线1.solid 实线条2.dott...原创 2018-11-15 09:55:48 · 173 阅读 · 0 评论