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;
}

效果图