随笔分类 -  css

1
height:100vh
摘要：1.em 在做手机端的时候经常会用到的做字体的尺寸单位 说白了 em就相当于“倍”，比如设置当前的div的字体大小为1.5em，则当前的div的字体大小为：当前div继承的字体大小*1.5 2.rem 这里的r就是root的意思，意思是相对于根节点来进行缩放，当有嵌套关系的时候，嵌套关系的元素的字体 阅读全文
posted @ 2019-10-25 09:58 阳光‘ 阅读(482) 评论(0) 推荐(0)
设置 textarea 不能被拖动
摘要：在css里写上 阅读全文
posted @ 2019-09-23 11:29 阳光‘ 阅读(768) 评论(0) 推荐(0)
让连续的英文或数字自动换行
摘要：答：div加上word-break:break-all;样式。 阅读全文
posted @ 2019-09-20 13:47 阳光‘ 阅读(215) 评论(0) 推荐(0)
用 input 伪元素做一个复选框
摘要：这个方法有兼容性，ie 不兼容 html css 阅读全文
posted @ 2019-09-11 16:15 阳光‘ 阅读(499) 评论(0) 推荐(0)
css清除浮动
摘要：给父元素添加这个类就能解决父元素没有高度的问题， 阅读全文
posted @ 2019-08-30 15:25 阳光‘ 阅读(174) 评论(0) 推荐(0)
用css设置a标签无效，让链接跳转失效
摘要：这个代码有个坑，就是如果a标签里面放了一个图片，然后给a标签设置这个样式，这个时候是不起效果的，只能在a标签外面包一个div，然后给div设置这个样式 pointer-events:none; 这个是 css3 的代码，这句代码可以把 onlick 事件去掉，相当于变为普通文本 阅读全文
posted @ 2019-08-15 20:41 阳光‘ 阅读(2327) 评论(0) 推荐(0)
css的继承
摘要：line-heigth会从父元素继承给子元素，如果想不要就在子元素设置 line-height: normal; 注意，不要直接设置给这个子元素，要这个子元素的前几层父元素设置。因为我的这个项目是比较大的。line-height是从body继承下来的，body里面有几十层盒子，所以会影响很大，不能只 阅读全文
posted @ 2019-07-19 14:34 阳光‘ 阅读(188) 评论(0) 推荐(0)
CSS属性之word-break:break-all强制性换行
摘要：用于后台返回数据的时候，有很多的空格，导致在不正确的位置换行。写入这句代码，可以强制消除空格 还有一个作用就是，内容撑破盒子的时候，会溢出去，用这句代码可以强制换行 阅读全文
posted @ 2019-07-17 23:01 阳光‘ 阅读(728) 评论(0) 推荐(0)
透明颜色
摘要：透明颜色赋值 阅读全文
posted @ 2019-07-17 10:22 阳光‘ 阅读(305) 评论(0) 推荐(0)
在元素前面添加一个伪元素下边框
摘要：dd:hover:before { content: ""; position: absolute; left: 0; right: 0; bottom: 0; width: 32px; heigh... 阅读全文
posted @ 2019-06-27 18:07 阳光‘ 阅读(538) 评论(0) 推荐(0)
css控制元素显示和隐藏
摘要：有dom结构 没dom结构 阅读全文
posted @ 2019-06-26 10:35 阳光‘ 阅读(3003) 评论(0) 推荐(0)
多行文字溢出隐藏
摘要：兼容 ie 11 浏览器，单行文字隐藏 第二种方法，多行文字隐藏，只适合谷歌浏览器和移动端使用 阅读全文
posted @ 2019-06-20 17:38 阳光‘ 阅读(383) 评论(0) 推荐(0)
css3图片处理
摘要：图片等比例放大然后截取 阅读全文
posted @ 2019-06-20 10:27 阳光‘ 阅读(177) 评论(0) 推荐(0)
flex布局，先两边对齐，然后平分空间，最后一行左对齐。
摘要：我用的方法是添加几个空的的 li 在最后面。空 li 的数量按照你的页面排版来给，然后减少一个li。例如，我的页面排版，一行放四个 li ，那我的空 li 就给三个。因为给多了也看不出效果，够用就好。你可以放多几个也行，不影响。因为，按照我的页面排版来说，我最后一行，只要可以补满四个 li 就满足我 阅读全文
posted @ 2019-06-19 20:02 阳光‘ 阅读(3672) 评论(0) 推荐(0)
css上下左右箭头
摘要：代码： 效果图 结束 阅读全文
posted @ 2019-06-14 14:39 阳光‘ 阅读(4702) 评论(0) 推荐(0)
鼠标经过显示隐藏内容
摘要：鼠标经过的时候，显示出里面的隐藏内容。 我这里的设置是，鼠标只有移到第一个 li 的时候才会触发那个事件，因为 css 有控制。css里面的控制是，鼠标移到li之后，如果里面有 none 这个类才会触发这个样式；如代码所示，第二个li里面并没有 none 这个类，所以并不会有干扰。下面写代码的时候， 阅读全文
posted @ 2019-06-12 10:33 阳光‘ 阅读(4718) 评论(0) 推荐(0)
element表格样式的修改
摘要：修改表格头部背景 修改表格行背景 修改斑马线表格的背景 修改行内线的颜色 修改表格最底部边框颜色和高度 修改表头字体颜色 修改表格内容字体颜色和字体大小 修改表格无数据的时候背景，字体颜色 修改表格鼠标悬浮hover背景色 阅读全文
posted @ 2019-05-30 11:56 阳光‘ 阅读(7060) 评论(0) 推荐(0)
css图片居中
摘要：添加这句代码就行 vertical-align: middle; 阅读全文
posted @ 2019-05-30 11:16 阳光‘ 阅读(170) 评论(0) 推荐(0)
flex布局
摘要：主轴变成垂直排序时的底部对齐 给父元素使用 垂直居中 水平居中 flex换行 阅读全文
posted @ 2019-05-23 10:24 阳光‘ 阅读(200) 评论(0) 推荐(0)
用css实现水平居中，垂直居中
摘要：给父元素添加一个相对定位position: relative;，然后给子元素添加这个css样式 阅读全文
posted @ 2019-05-23 10:21 阳光‘ 阅读(291) 评论(0) 推荐(0)

1