朦胧淡月的博客_css进阶

产生垂直滚动条和修改滚动条的样式兼容谷歌和火狐

##产生垂直滚动条和修改滚动条的样式兼容谷歌和火狐我们为什么会处理浏览器滚动条的样式了？因为浏览器的滚动条，会影响页面的宽哈；

滑块

5e

微信

原创 2022-09-01 20:06:50 170 阅读

文本溢出显示省略号

######在项目的实际开发中，如果文字太长了，就显示省略号哈！！！ <a class="teacher-cont-name">{{item.ke}}</a> .teacher-cont-name{ color: #606266; display: inline-block; width:70px;

微信

省略号

父级元素

原创 2022-09-01 18:09:13 111 阅读

sass中使用穿透属性(deep)修改第三方组件样似

``` 保存 //按钮的字体色是白色.save-btn /deep/ span{ color: #fff;}.save-btn:hover{ background: #409EFF;}.save-btn:focus{ background: #409EFF;}```

微信

支付宝

javascript

原创 2022-09-01 18:09:06 53 阅读

css 修改placeholder的颜色

有些时候需要给html中的placeholder添加背景色

微信

背景色

javascript

原创 2022-09-01 18:08:59 134 阅读

elementUI日期选择器，对日期格式进行处理

使用elementUI日期选择器中，获取不同格式的时间

微信

支付宝

日期选择器

原创 2022-09-01 18:08:53 73 阅读

图片三像素问题如何解决css

一、提出问题在浏览器中，图片有一个下间隙问题，有人也称之为图片3像素BUG 1.这并不是什么浏览器bug，而只是英文字母书写时有个基线的问题，基线决定了图片的对其方式。这才是造成浏览器中图片下间隙的本质。那么，什么是基线？我们小时候学英文，一开始都是用的四线本写英文字母，就是那个长的跟五线谱

基线

微信

javascript

转载 2022-09-01 17:58:34 195 阅读

css hover频繁闪烁

``` 今天遇见一个问题。在鼠标放上图片上的时候。删除图标一直不停的闪烁。我当时觉得

微信

html

css

原创 2022-09-01 17:58:25 1179 阅读

css伪类和伪元素在项目中的使用-红色*显示

CSS使用伪类给表单添加星号 <style type="text/css"> .form-item label::before { content: '*'; color: #e54d42; } </style> <form> <div class="form-item"> <label for="

伪元素

css

微信

原创 2022-09-01 17:43:05 219 阅读

css中使用蒙层会带来哪些问题。

微信

支付宝

背景颜色

原创 2022-09-01 17:00:07 170 阅读

限制input框中字数的输入maxlength

``` 今天产品提出一个需求就是。限制input框中的的值。当用户超过10个字符时，用户再次输入的时，就不能够输入了。（最后就能够输入10个字符） maxlength=10 ``` ``` 此时用户最后就只能够输入10个字符了 ```

微信

支付宝

javascript

原创 2022-09-01 16:59:57 278 阅读

去除 i 标签的倾斜样式;如何引入本地的阿里字体图标

去除 i 标签的倾斜样式 i{ font-style:normal; } 如何引入本地的阿里字体图标将代码下载下来当然你将下载下载来的资源有用的放在静态资源中然后在 main.js 引入； main.js import '@/assets/icon/iconfont.js' import '@

ico

微信

javascript

原创 2022-09-01 16:59:47 64 阅读

边框引起页面抖动

在添加边框的时候，有边框的元素会挤压四周的元素，形成挤压；从而造成了；页面区域的变化(抖动) 解决办法：==》有边框的时候；添加边框；没有边框的时候；也添加一个边框；边框的颜色和四周的颜色相融就可以了；这样就不会造成；页面的抖动

微信

支付宝

javascript

原创 2022-09-01 16:59:35 131 阅读

hover时行级元素变成了块级元素，导致位置错乱

在hover时，i元素变成了块级元素；导致这两个元素各自占了一行；最终导致样式错乱； <div class="demo">  <i class="iconfont add-icon"></i> <i class="iconfont add-icon"></

ico

微信

块级元素

原创 2022-09-01 16:59:18 40 阅读

css 宽度分离原则

我们想设计一个w=180px；h=100px的div; .demo1 { width: 180px; height: 100px; background: pink; padding: 10px; border: 1px solid #c1c1cc; margin: 5px; } <div clas

微信

父级元素

javascript

原创 2022-09-01 16:59:02 42 阅读

vue和uni-app不同的类型绑定不同的类名

vue不同的类型绑定不同的类名第一种 <div v-for="(item, index) in list" :key="index" > <div class="item-tag" :class="addclassName(item)"> {{ item.cont}} </div> </div>

css

微信

支付宝

原创 2022-09-01 16:58:12 63 阅读

dispaly结合背景图片会提升加载性能

1.display的常见现象我们很多人都知道，display可以让元素实现隐藏或者显示。或者让行级元素变成块级元素。对它的认识也是比较准确的。如果一个元素使用了display:none; 那么该元素将会隐藏，无法进行点击，屏幕设置将会无法访问。但是今天我的意外发现， display: no

网络请求

插入图片

加载

原创 2022-09-01 16:58:04 22 阅读

display:none与visibility: hidden的区别

1.visibility: hidden/visible与dispaly：none 有些人简单的认为display: none;和visibility: hidden; 这两个属性的区别在于前者隐藏后不占据文档空间。后者隐藏后会占据文档空间。其实visibility: hidden并不是你想的这

动画效果

微信

css

原创 2022-09-01 16:57:21 55 阅读

css中也可以使用变量了？

前言大家都听说过变量，我们学习的任何语言都有变量的存在。 css中是否也存在变量呢？也许很多小伙伴也是通过less,scss中来使用css变量其实在css中也是有变量的，今天我们也来学习一下。为什么要使用变量变量有一个很大的作用就是降低维护成本。不仅如此，还可以提高我们的开发效率。实现

css

微信

ide

原创 2022-09-01 16:56:50 95 阅读

overflow的所有值，overlay不占位

visible: 默认值.内容不会被修剪,会呈现在元素框之外。 hidden: 内容会被修剪,并且其余内容是不可见的。 scroll: 内容会被修剪,总是显示滚动条。 auto: 内容被修剪,超出浏览器会显示滚动条以便查看其余内容，没有超出则不显示滚动条。 overlay:它的行为与auto相同的

微信

火狐浏览器

支付宝

原创 2022-09-01 16:56:28 819 阅读

官方博客	全部文章	热门标签	班级博客
了解我们	在线客服	网站地图	意见反馈

开源基础软件社区	51CTO学堂
51CTO	汽车开发者社区

51CTO博客