AI智能
改变未来

CSS/SCSS长期更新。


1、多个div在一个父div的布局

例:
【弹性盒子】

<div style=\"display:flex;justify-content:space-between;text-align:center\"><div style=\"\"><img src=\"/i/eg_tulip.jpg\"  alt=\"上海鲜花港 - 郁金香\" /><br>123</div><div style=\"\"><img src=\"/i/eg_tulip.jpg\"  alt=\"上海鲜花港 - 郁金香\" />456</div></div>

效果

2、style只支持普通的style。想启用scss和less需要设置

<style lang=\"scss\" scoped><--scoped表示只作用于当前节点-->

3、元素的特定说明

选择属于其父元素的首个子元素的每个 td元素,并为其设置样式:

td:first-child {color: red;height: 38px;text-align: center;}

规定属于其父元素的第二个子元素的每个 td 的背景色:

td:nth-child(2) {color: red;height: 38px;text-align: center;}

指定属于其父元素的最后一个子元素的td 元素的背景色:

td:last-child {color: red;height: 38px;text-align: center;}

4、div圆角

div{border:2px solid #a1a1a1;padding:10px 40px;background:#dddddd;width:300px;border-radius:25px;}<div style=\"border-radius:25px\">border-radius 属性允许您为元素添加圆角边框! </div>

效果图

5、DIV阴影

div{width:300px;height:100px;background-color:yellow;box-shadow: 10px 10px 5px #888888;}

效果图

赞(0) 打赏
未经允许不得转载:爱站程序员基地 » CSS/SCSS长期更新。