普陀总校  北桥教学点  颛桥教学点  泗泾教学点  | 设为首页 | 加入收藏 | 官方微信
内威培训
打造“培训+就业”一站式服务品牌!
  • Web前端工程师
  • 电脑艺术设计师
  • 网页设计制作员
  • Java软件开发工程师
banner1

首页>>学员天地

CSS实现小三角
编辑:Simon  阅读:3710次  发布:11-04-20
[代码]

<style>
#up {                                       
  width:0px; 
  height:0px; 
  border-bottom:10px solid  #89b007; 
  border-left:10px solid #fff; 
  border-right:10px solid #fff; 

#down {
  width:0px; 
  height:0px; 
  border-top:10px solid  #89b007; 
  border-left:10px solid #fff; 
  border-right:10px solid #fff;    

#left { 
  width:0px; 
  height:0px; 
  line-height:0px;             /*解决ie出现梯形问题*/
  border-right:10px solid  #89b007; 
  border-top:10px solid #fff; 
  border-bottom:10px solid #fff;   

#right { 
  width:0px; 
  height:0px; 
  line-height:0px;             /*解决ie出现梯形问题*/
  border-left:10px solid  #89b007; 
  border-top:10px solid #fff; 
  border-bottom:10px solid #fff;   

#trapezoid {                         
  width:7px; 
  height:15px; 
  border-bottom:10px solid  #89b007; 
  border-left:10px solid #fff; 
  border-right:10px solid #fff; 
}

</style>

[代码] body
<div id="up"></div> 
<br/> 
<div id="down"></div> 
<br/>
<div id="left"></div> 
<br/> 
<div id="right"></div>
<br />
<div id="trapezoid"></div>




上一篇: VS.NET 2005/2008快捷键大全   下一篇: 解决span float:right不能右对齐而是换行显示
网络大专、自考本科,学历轻松拿!
©2016-2020 万博体育APP 版权所有
普陀区武宁路1500号中楼2-3层(邮编:200062)
咨询:021-62434966  合作:021-13371929650  就业:021-62434966  传真:021-52662428  电邮:service@snetway.com
《中华人民共和国电信与信息服务业务》经营许可证沪ICP备15002602号