建站学 - 轻松建站从此开始!

建站学-个人建站指南,网页制作,网站设计,网站制作教程

当前位置: 建站学 > 网页设计 > css教程 >

CSS3实例教程:box-shadow阴影和表格阴影

时间:2012-04-30 14:48来源: 作者: 点击:
box-shadow-对表格及单元格使用阴影写法及两种浏览器效果的对比。 <!DOCTYPE HTML> <html> <head> <meta charset="utf-8"> <title>对表格及单元格使用阴影</title> <style type="text/css"> table{ border-
box-shadow-对表格及单元格使用阴影写法及两种浏览器效果的对比。 <!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>对表格及单元格使用阴影</title>
<style type="text/css">
table{
border-spacing:10px;
-webkit-box-shadow:2px 2px 5px #00f;
-moz-box-shadow:2px 5px 5px #999;
}
td{
background:#000;
-webkit-box-shadow:5px 2px 5px #00f;
-moz-box-shadow:2px 5px 5px #999;
padding:10px;
}
</style>
</head>

<body>
<table width="200" border="0">
<tr>
<td>1</td>
<td>1</td>
<td>1</td>
</tr>
<tr>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
</table> </body>
</html>

 

(责任编辑:admin)
织梦二维码生成器
顶一下
(0)
0%
踩一下
(0)
0%
------分隔线----------------------------
发表评论
请自觉遵守互联网相关的政策法规,严禁发布色情、暴力、反动的言论。
评价:
表情:
用户名: 验证码:点击我更换图片