Skip to content

时间轴样式

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;

Released under the MIT License.