Appearance
时间轴样式
css
<div style="float: left;width: 6px;height: 6px;border:2px solid white; background-color: #08b8e6;-webkit-border-radius: 100px;">
</div>
<div style="float:left;margin-top:-7px;">
2017.03.23 内容内容内容内容内容内容
</div>
<div style="height: 100px;border-left: 2px solid;margin-left: 4px;border-image: -webkit-linear-gradient( #00eba7 , #08b8e6) 30 30;border-image: -moz-linear-gradient( #00eba7 , #08b8e6) 30 30;border-image: linear-gradient( #00eba7 , #08b8e6) 30 30;">
</div> 2017.03.23 内容内容内容内容内容内容
字体间隔
letter-spacing属性用于增加或减少字符间的空白;允许使用负值,但会让字母间挤得更紧。
css
<div style="letter-spacing: 56px;">民族</div>民族
圆形里面对号
css
<div style="flex-shrink: 0;box-sizing: border-box;position: relative;width: 16px;height: 16px;
border: 1px solid #DCDFE6;border-radius: 4px;z-index: 1;"
:style="{backgroundColor: isChecked ? '#2979ff' : '#fff', borderColor: isChecked ? '#2979ff' : ''}">
<div style="position: absolute;top: 1px;left: 5px;height: 8px;width: 4px;border-right-width: 1px;
border-right-color: #fff;border-right-style: solid;border-bottom-width: 1px;border-bottom-color: #fffFFF;border-bottom-style: solid;transform-origin: center;"
:style="{opacity: isChecked ? '1' : '0', transform: isChecked ? 'rotate(45deg)' : ''}">
</div>
</div>el-input换问题
el-input的type为textarea输入,显示为html时,进行换行。 增加样式:white-space: pre-wrap; word-break: break-all;