Css
陈善强
前端技术分享,共同进步
展开
-
清除浮动
代码如下 <style> .box { border: 1px solid #ccc; background: pink; } .red, .green, .blue { float: left; width: 100px; height: 100px; } .red { background: red; } .green { background: green; } .blue { background: blue; } </style> <body&g原创 2021-05-25 17:13:38 · 79 阅读 · 0 评论 -
文字溢出尾部显示省略号
单行文本溢出 盒子的宽度设置为固定宽度100px; white-space设置为nowrap,文字不可换行 overflow设置为hidden,内容将被剪裁以适合填充框。 不提供滚动条。 text-overflow设置为ellipsis,用省略号来表示被截断的文本,这个省略号被添加在内容区域中,因此会减少显示的文本。如果空间太小到连省略号都容纳不下,那么这个省略号也会被截断。 .single-line{ width:100px; white-space:nowrap; overf原创 2021-05-21 17:20:54 · 168 阅读 · 0 评论 -
Css属性书写顺序
建议遵循以下顺序: 布局定位属性:display / position / float / clear / visibility / overflow(建议 display 第一个写,毕竟关系到模式) 自身属性:width / height / margin / padding / border / background 文本属性:color / font / text-decoration /...原创 2020-04-22 21:59:09 · 169 阅读 · 0 评论 -
H5中是怎么做适配的?
原创 2020-03-08 10:57:45 · 862 阅读 · 0 评论 -
Css中伪类和伪元素的区别
伪类 :hover :active :link :visited :focus等这些是伪类选择器(css样式表 类)这种并不是真正的样式类,是在用户某些操作下来呈现的样式,称之为伪类。 伪元素 ::before ::after等这些会在dom结构中插入节点,生成一个dom元素,但是这些dom元素又不存在于dom结构中,不能够像其他dom元素进行操作,所以称之为伪元素。::before ::afte...原创 2020-03-08 10:47:32 · 120 阅读 · 0 评论 -
定位默认转换
display是显示模式,可以改变显示模式有以下方式: 可以用inline-block转换为行内块 可以用浮动float默认转换为行内块(类似,并不完全一样,因为浮动是脱标的) 绝对定位和固定定位 也和浮动类似,默认转换的特性转换为行内块。 所以说,一个行内的盒子,如果加了浮动、固定定位和绝对定位,不用转换,就可以给这个盒子直接设置宽度和高度等。 同时注意: 浮动元素、绝对定位(固定定位...原创 2019-11-08 22:21:12 · 249 阅读 · 0 评论