随笔分类 -  css

记录css相关的内容
div垂直居中的方法
摘要：父元素：box1,子元素：box2； 持续补充中。。。。。 一、子div定宽高 1. flex布局 .box1{ width: 300px; height: 300px; border: 1px solid red; display: flex; align-items: center; } .bo 阅读全文
posted @ 2021-04-01 08:50 考拉很OK 阅读(70) 评论(0) 推荐(0) 编辑
修改input placeholder文字颜色
摘要：/*input placeholder文字颜色*/ ::-webkit-input-placeholder { /* WebKit browsers */ color: #ccc;}:-moz-placeholder { /* Mozilla Firefox */ color: #ccc;}:-ms 阅读全文
posted @ 2020-06-02 18:57 考拉很OK 阅读(710) 评论(0) 推荐(0) 编辑
浏览器滚动条设置
摘要：1. 谷歌、safari、qq浏览器、360浏览器滚动条可以设置，火狐不能这样设置 /*滚动条样式开始*/ /*谷歌、safari、qq浏览器、360浏览器滚动条样式*/ /*定义滚动条宽高及背景，高宽分别对应横竖滚动条的尺寸*/ /*以下会设置全部的滚动条，如果设置局部div滚动条，可在前面加 . 阅读全文
posted @ 2020-05-21 16:57 考拉很OK 阅读(3069) 评论(0) 推荐(0) 编辑
单行文本、多行文本显示省略号...
摘要：一、单行文本 .s-ellipsis{ width: 200px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } 二、多行文本 1. csss实现，适用于webkit内核浏览器、移动端、微信可以，火狐不可以 .m- 阅读全文
posted @ 2019-08-30 12:13 考拉很OK 阅读(3349) 评论(0) 推荐(0) 编辑
input文字颜色、光标颜色
摘要：input{ color: red;/*输入文字、光标颜色*/ -webkit-text-fill-color: blue;/*输入文字、placeholder颜色*/ caret-color: yellow;/*光标颜色*/ } 阅读全文
posted @ 2018-08-03 17:47 考拉很OK 阅读(11454) 评论(0) 推荐(0) 编辑
文字两端对齐
摘要：在固定宽度的div中实现文字两端对齐有浏览器兼容问题：以下测试在谷歌67 火狐59 IE11 一、谷歌浏览器 text-align-last: justify; 即可 二、火狐浏览器 1. 文字之间必须有空格 2. 添加 text-align-last: justify; 三、IE浏览器 1. 文字 阅读全文
posted @ 2018-07-09 15:08 考拉很OK 阅读(3041) 评论(0) 推荐(0) 编辑
img 边距的问题
摘要：一、*{margin:0;padding:0} 不能消除img的边距 二、布局中可以使用以下方法： 1.img:{flot:left} 2.img:{vertical-align: top;} img:{vertical-align: super;}或其他选项做调整 3.对img做定位（不推荐） 阅读全文
posted @ 2018-01-01 22:19 考拉很OK 阅读(1519) 评论(0) 推荐(0) 编辑