常用的css属性

//水平垂直居中
display:flex
align-items : center; //弹性盒子元素在该行的侧轴（纵轴）上居中放置。（居中对齐）
justify-content : center;//元素在主轴（页面）上居中排列
flex-direction：column;//设置纵向排列

font-weight：100-900;//400是初始大小
letter-spacing: 2px;//字间距
text-decoration: underline;//下划线
text-decoration: line-through;//删除线

//定位时水平居中
position:fixed;
left: 50%;
transform: translateX(-50%)

//定位时垂直水平居中
position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    margin: auto;
position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);

//input-placeholder 适配
input::-webkit-input-placeholder {
    font-size: 16px !important;
    color: #ccc;
  }
/*webkit 内核浏览器*/
input::-moz-placeholder {
    font-size: 16px !important;
    color: #ccc;
  }
/*Mozilla Firefox 19+*/
input:-ms-input-placeholder {
    font-size: 16px !important;
    color: #ccc;
  }
/*Internet Explorer 10+*/

word-wrap: break-word; //強制換行

//filter
filter: grayscale(1);//灰度
filter: drop-shadow(0 0 0.75rem crimson);//创建一个符合图像本身形状(alpha通道)的阴影

//阴影
/* x偏移量 | y偏移量 | 阴影颜色 */
box-shadow: 60px -16px teal;
/* x偏移量 | y偏移量 | 阴影模糊半径 | 阴影颜色 */
box-shadow: 10px 5px 5px black;
/* x偏移量 | y偏移量 | 阴影模糊半径 | 阴影扩散半径 | 阴影颜色 */
box-shadow: 2px 2px 2px 1px rgba(0, 0, 0, 0.2);
/* 插页(阴影向内) | x偏移量 | y偏移量 | 阴影颜色 */
box-shadow: inset 5em 1em gold;

//背景色充满屏幕
background-color: #181A28;
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;

//垂直方向自右而左的书写方式
writing-mode: vertical-rl;
//将元素内的字符水平排列，使其它们在竖行中占据单个字符空间
text-combine-upright: all;
letter-spacing: 2em//间隔2个字符