css3
html&css3学习笔记
--------------------------------------------------
html5
css3
1.自动换行
word-wrap:break-word;
2.字体阴影
您能够规定水平阴影、垂直阴影、模糊距离,以及阴影的颜色、
text-shadow: 5px 5px 5px color;
3.自定义字体
@font-face{
font-family:,
src:url(''); //下载好字体存放的位置
}
4.背景
background-size:
background-origin:
content-box
padding-box
border-box
5.2D转换
属性:transform
translate() /*左右移动*/
rotate() /*旋转多少度*/
scale() /*两个值,x放大多少倍,y放大多少倍*/
6.3D转换
rotateX() 延自身的x轴旋转
rotateY() 延自身的轴旋转
7.过渡效果
transition:
第一步定义要过渡的属性
如:
div{
transition:width 2s,border 3s;
}
然后加伪类或者是事件
div:hover{
width:400px;
border:1px solid yellow;
}
8.多列
多少列
column-count (注意兼容性)
列间距
column-gap
给列加分界线(加一个右边框)
column-rule
-moz-column-count: (兼容火狐)
-webkit-column-count: (兼容saria与谷歌)
-o-column-count: (兼容欧鹏)
-ms-column-count:
9用户界面
在 CSS3 中,新的用户界面特性包括重设元素尺寸、盒尺寸以及轮廓等。
resize:resize:none | both | horizontal | vertical
outline-offset
box-sizing : content-box | border-box | inherit
resize:
div{
width: 500px;
height: 300px;
border:1px solid yellow;
resize: both;
overflow: auto;
/*overflow: auto;*/
}
box-sizing:border-box
边框将不再占用外面的距离,而占用里面的
轮廓
outline-style:
outline-color:
outline-width:
一新问题
1)一个电话或者是一个工单的内容中会有多个问题,产品与