web嵌入字体
@font-face{
font-family: "字体名字";
src:url("路径");
font-weight:bold;
}
例
@font-face{
font-family: "123";
src:url("font/BlackoakStd.otf");
}
div{
font-family: "123";
}
box-sizing:border-box;
宽高固定 边框不在往外撑 而是向内占内容
outline 和border效果相似 但不占网页空间
outline: 10px dashed black;
resize
将textarea的大小拖动关闭 resize:none不能修改 both可修改宽高 horizontal只改宽度 vertical 只能改高度l inherit
textarea{
width: 100px;
height: 50px;
resize:none;}
给div设置拖动
div{
width: 100px;
height: 100px;
background-color: red;
resize:both;
overflow: hidden;
}
分栏
column-count: 3; 栏的数量
column-gap:100px;栏之间的距离
column-rule: 5px dashed red;分割线
例
div{
/*列的数量*/
-webkit-column-count: 3;
-moz-column-count: 3;
-o-column-count: 3;
column-count: 3;
/*列之间的距离*/
column-gap:100px;
-webkit-column-gap:100px;
/*分割线*/
column-rule: 5px dashed red;
-webkit-column-rule: 5px dashed red;
}
弹性盒模型
display: -webkit-box; 将一个元素的子元素以弹性布局进行布局
-webkit-box-orient: vertical;子元素的排列方式（竖向）默认横向
-webkit-box-direction:reverse;（逆序）子元素的排列顺序
-webkit-box-flex:1;子元素如何分配剩余空间
-webkit-box-align:center;子元素的垂直对齐方式 start左 end右 center居中
-webkit-box-pack:center;子元素的水平对齐方式
