-
CSS3-Transition：过渡属性
查看全部 -
transform:动画2D、3D效果
查看全部 -
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>无标题文档</title>
<style type="text/css">
body ul li {margin: 0px; padding: 0px; font-size: 12px; }
ul { list-style-type: none; height: 27px; width:500px;border-bottom:2px solid #21530C}
li { float: left; }
a {
display: inline-block;
height: 27px;
line-height: 27px;
text-decoration: none;
margin-right: 8px;
color: #000;
}
.ac {
background: url('http://img1.sycdn.imooc.com//538588030001c52300090027.jpg') no-repeat;
padding-left: 8px;
}
.ac span {
display: inline-block;
background: url('http://img1.sycdn.imooc.com//5385882d0001030900080027.jpg') right top no-repeat;
color: #fff;
background-color: #21530C;
padding-right: 8px;
}
.ac:hover{
opacity: 0.9;
}
</style>
</head>
<body>
<ul>
<li><a href="#" class="ac"><span>首页</span></a></li>
<li><a href="#"><span>最新产品</span></a></li>
<li><a href="#"><span>内部新闻</span></a></li>
<li><a href="#"><span>联系我们</span></a></li>
</ul>
</body>
</html>
查看全部 -
慢慢放大查看全部
-
transform参数（实现旋转）查看全部
-
css3-box-sizing: content-box | border-box | inherit 值描述查看全部
-
css:box-sizing查看全部
-
css-transition查看全部
-
css3-transform参数查看全部
-
背景：颜色值 背景图片 图片样式 水平 垂直 background：#fff url() no-repeat center center;查看全部
-
三角形的写法： span{diplay:block; width:0; height:0; overflw:hidden; border:7px solid transparent;（transparent透明） border-top-color:#2DCB70;（朝下，上，左，右） }查看全部
-
box-sizing查看全部
-
box-sizing查看全部
-
Transition查看全部
举报