随笔分类 -  css

卡片展示（不定宽），最后一行左对齐 的几种实现方式
摘要：1. 栅格布局 栅格布局常见有12，或24栅格，根据每个div的栅格数量，得到宽度占比。 平时可以利用一些栅格布局组件， 如antd的Row，Col 2. 弹性布局 2.1 单行数据 2.2 多行数据 加占位标签， 使用隐藏的div 填满每行： 或利用flex属性， 2.3 每行列数固定， 可用 阅读全文
posted @ 2019-07-22 18:38 doublealoe 阅读(1010) 评论(0) 推荐(0)
styled-components 使用小结
摘要：1. 常规使用 2. 使用props 3. 修改三方组件的样式 ps: 为辨别类名， 我们可以在package.json文件 babel中加入styled-components 的插件， 即： 阅读全文
posted @ 2019-06-11 19:49 doublealoe 阅读(1567) 评论(0) 推荐(0)
背景图自适应屏幕居中显示，且不变形
摘要：html： css: .item { width: 100%; height: 100%; .container { max-width: 100%; height: auto; min-height: 600px; // 这里可... 阅读全文
posted @ 2019-01-08 12:19 doublealoe 阅读(980) 评论(0) 推荐(0)
css Modules 使用
摘要：我目前常用的也就是引用类名，以及在需要修改某个ui组件原有的样式比较麻烦时，会使用 :global className{ color: red;}这样来修改。。。 更多请参考阮老师博客： http://www.ruanyifeng.com/blog/2016/06/css_modules.html 阅读全文
posted @ 2018-08-13 15:30 doublealoe 阅读(109) 评论(0) 推荐(0)
修改输入框placeholder的样式
摘要：1. h5页面： 2. 小程序里： 阅读全文
posted @ 2018-06-14 00:48 doublealoe 阅读(278) 评论(0) 推荐(0)
span i s等行内元素标签之间出现奇怪空格符号
摘要：上述展开信息本来是这样写的，但是很奇怪windows下的测试环境支付时间前面莫名其妙多了个小方框 一般是由于行内元素之间在换行时会产生一个换行符号，然后会占用一定的宽度，并且这个宽度是小于一个空格的. 解决方法如下： 1.将span元素写在一行，但是较多的话看着就不方便了； 2.js里拼接字符串，再 阅读全文
posted @ 2018-05-14 22:05 doublealoe 阅读(2012) 评论(0) 推荐(0)
css3动画实现旋转木马
摘要：写旋转木马的时候，突发奇想想加个遮罩效果，那当然是用box-reflect属性了，写的效果就是不出来，原来就是手残给包图片的li标签加了个overflow：hidden，也是醉了哈哈哈哈，去掉就好啦，上代码： 阅读全文
posted @ 2017-08-13 21:48 doublealoe 阅读(313) 评论(0) 推荐(0)