![](https://img-blog.csdnimg.cn/20201014180756913.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
css
zeroyulong
前端攻城狮,日常撸代码
展开
-
vant UI 和 element UI样式穿透方法
1./deep/.van-search /deep/ .van-search__content{ background: red;}2.失效的话使用 ::v-deep.van-search .van-search__content::v-deep{ background: red;}原创 2020-09-07 09:49:50 · 862 阅读 · 0 评论 -
css溢出显示省略号
多行文本溢出显示省略号(...)overflow : hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;遇到的bug编译后发现-webkit-box-orient不见了,原因是autoprefixer编译时将其删除了。...原创 2019-04-04 09:47:52 · 144 阅读 · 0 评论 -
text-align:justify对齐的使用
需求:使‘姓名’‘曾用名’‘电子邮箱’对齐方案:一 、使用&nbsp;加空格来使文案对齐。缺点:调试起来麻烦,而且最终结果不会太好,字间距不好分摊二 、使用text-align:justify来调试代码如下<!DOCTYPE html><html lang="en"><head> <meta charset="UT...原创 2019-02-25 15:01:05 · 4879 阅读 · 1 评论 -
word-break 换行
属性规定自动换行的处理方法。在恰当的断字点进行换行:p.test {word-break:hyphenate;}定义和用法word-break 属性规定自动换行的处理方法。提示:通过使用 word-break 属性,可以让浏览器实现在任意位置的换行。默认值: normal 继承性: yes 版本: CSS3 JavaScript 语法: ...原创 2018-12-10 10:51:41 · 3025 阅读 · 0 评论 -
sketch中Regular、Normal、Medium、Light 对应的font-weight值
‘font-weight’属性执行字体中字形的重量,这取决于黑度等级或笔划粗细。其值的意义如下:100至900这些有序排列中的每个值,表示至少与其起身拥有相同黑度的重量。其大致符合下列通用重量名称:100 - Thin 200 - Extra Light (Ultra Light) 300 - Light 400 - Normal 500 - Medium 600 - S...原创 2018-11-08 18:18:24 · 3865 阅读 · 0 评论 -
position:sticky;新属性小记
偶然得知了position:sticky这个新属性,想起了从前写这个功能时的蛋疼时光。。。一堆高度算来算去,比来比去,emmm。。。position:sticky;基于用户的滚动位置来定位。粘性定位的元素是依赖于用户的滚动,在 position:relative 与 position:fixed 定位之间切换。在目标区域以内,它的行为就像 position:relative; 而当页面...原创 2018-11-02 16:26:51 · 249 阅读 · 0 评论 -
px2rem 使用技巧
安装px2rem后,再使用px上有些不同,大家可以参考px2rem官方介绍,下面简单介绍一下。直接写px,编译后会直接转化成rem ---- 除开下面两种情况,其他长度用这个在px后面添加/*no*/,不会转化px,会原样输出。 --- 一般border需用这个在px后面添加/*px*/,会根据dpr的不同,生成三套代码。---- 一般字体需用这个 ...原创 2018-10-17 16:48:58 · 4311 阅读 · 0 评论 -
select默认样式删除
CSS去除selec框默认样式select{ /*隐藏select的下拉图标*/ appearance: none; -webkit-appearance: none; -moz-appearance: none; /*去除高亮*/ -webkit-tap-highlight-color: #fff; /*去除边框样式*/ out...原创 2018-04-26 11:35:50 · 1331 阅读 · 0 评论 -
select 内容居右显示
select{ direction: rtl;}详解见https://stackoverflow.com/questions/7920677/text-align-right-on-select-or-option原创 2018-05-02 14:44:12 · 4579 阅读 · 0 评论 -
css3的calc()属性
语法:calc() = calc(四则运算)说明:用于动态计算长度值。需要注意的是,运算符前后都需要保留一个空格,例如:width:calc(100% - 10px);任何长度值都可以使用calc()函数进行计算;calc()函数支持+ - * / 运算calc()函数使用标准的数学运算优先级规则示例:<!DOCTYPE html><html> <head>...原创 2018-04-19 15:59:43 · 263 阅读 · 0 评论 -
css实现多行文本在容器内垂直居中
提供两种方法line-height和flex布局方法<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>文字固定容器居中</title> <style type="text/css">原创 2018-04-19 11:52:29 · 2795 阅读 · 0 评论 -
一个div设置多张背景图片
一个div设置多张背景图片,效果如下图代码如下<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>一个div设置多张背景图</title> </head> <style type="text原创 2018-04-03 16:09:39 · 2367 阅读 · 0 评论