css3中我们不知道的一些属性

时间：2023-03-09 09:39:14
css3中我们不知道的一些属性

1、图片作为边框：border-image;

2、圆角问题：border-radius:上、下、左、右；

3、字体的阴影与自动换行：

阴影：

h1

{text-shadow: 5px 5px 5px #FF0000;}   

换行：

p {word-wrap:break-word;}

　　

css3中我们不知道的一些属性

4、旋转

5、过渡

<!DOCTYPE html>

<html>

<head>

<style>

div {

    width: 100px;

    height: 100px;

    background: red;

    -webkit-transition: width 3s, height 3s, -webkit-transform 2s; /* For Safari 3.1 to 6.0 */

    transition: width 3s, height 3s, transform 2s;

}

div:hover {

    width: 300px;

    height: 300px;

    -webkit-transform: rotate(10deg); /* Chrome, Safari, Opera */

    transform: rotate(10deg);

}

</style>

</head>

<body>

<p><b>注意：</b>该实例无法在 Internet Explorer 9 及更早 IE 版本上工作。</p>

<div>鼠标移动到 div 元素上，查看过渡效果。</div>

</body>

</html>

　　

相关文章