站长中国
站长社区
站长论坛
技术学院
源码下载
模板下载
问高手
建站资源
站长工具
找链接
找链接
特效首页
Js特效
Css特效
javascript 特效
文字特效
菜单导航特效
背景图像特效
图层特效
鼠标特效
页面窗口特效
色彩表格特效
表单按钮特效
游戏娱乐特效
日期时间特效
综合特效代码
csS特效
横向导航
竖向导航
图片css
表单css
divcss
链接按钮
页面布局
其他特效
css 实现一些三角图形效果
分类：其他特效 来源： 作者： 时间：2009-04-21
使用方法＆效果
推荐：
启网
- 专业的主机、服务器合租提供商
17hz.net - 5年服务器合租精品服务
请运行以下代码查看效果
代码
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>www.zishu.cn</title> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <style> /*zishu.cn*/ *{ margin:0; padding:0; font-size:12px; font-family:Verdana, "宋体", Arial; line-height:1.8; list-style:none;} #info,#nav{ margin:50px; border:1px dashed #FF3300; background:#FFFFCC; padding:50px;} #info div{background:#FF0000; width:0px; height:0px; overflow:hidden; margin-bottom:10px;} /*一些三角的写法*/ #com_a{ border-top:10px solid #FFFFCC;border-left:10px solid #FF3300;border-bottom:10px solid #FFFFCC;} #com_b{ border-top:10px solid #FFFFCC;border-right:10px solid #FF3300;border-bottom:10px solid #FFFFCC;} #com_c{ border-top:10px solid #FFFFCC;border-right:10px solid #FF3300;border-bottom:10px solid #FFFFCC;border-left:10px solid #FF3300;} #com_d{ border-top:10px solid #FF3300;border-right:10px solid #FFFFCC;border-bottom:10px solid #FF3300;border-left:10px solid #FFFFCC;} #com_e{ border-top:10px solid #FFFFCC;border-left:10px solid #FF3300;} #com_f{ border-top:10px solid #FF3300;border-right:10px solid #FFFFCC;border-left:10px solid #FFFFCC;} #com_g{ border-right:10px solid #FFFFCC;border-bottom:10px solid #FF3300;border-left:10px solid #FFFFCC;} #com_h{ border-top:10px solid #FF3300;border-bottom:10px solid #FF3300;border-left:10px solid #FFFFCC;} #com_i{ border-top:10px solid #FF3300;border-right:10px solid #FF3300;border-bottom:10px solid #FF3300;border-left:10px solid #FFFFCC;} </style> </head> <body> <div id="info"> <h1>一些三角形的写法</h1> <div id="com_a"></div> <div id="com_b"></div> <div id="com_f"></div> <div id="com_g"></div> <div id="com_c"></div> <div id="com_d"></div> <div id="com_e"></div> <div id="com_h"></div> <div id="com_i"></div> </div> </body> </html>
运行代码
复制代码
© CopyRight 2006-2009,CNZZAD.COM, Inc. All Rights Reserved 1.89MB 0.0418
鲁ICP备05001756号
站长中国群1：
30492658
精致合租咨询群1：
21445564
