1. CSS拾遗之图标
图标有三种 制作方法 :
图片 css(小箭头用CSS 搞定 ) 自己画font(fontawsome插件)fontawsome插件下载之后,解压,新版的与老版不一样。
2. ht ML 文件的目录结构
xxx PR oject
- app
- s1.html
- s2.html
- css
- commons.css
- script
- commons.js
- plu gin
- fontawsome
- bootstrap
- .. .
3. CSS拾遗之a包含标签
image默认是有个边框的,在ch rom 中没事,但是在IE br owser里面就会把边框显示出来,所以要将image标签的边框设为0.
<hedad>
<style>
img {
border: 0;
}
/* IE浏览器会产生边框,所以要将边框设为0 */
</style>
</head>
<body>
<a hr ef="wHdhCmsTestb ai du .COM ">lanxing</a>
<a href="HdhCmsTestbaidu测试数据">
<img sytle="h ei ght:300px;width:400px" src="wallpa PE r1. jpg " alt="lanxing">
<a>
<body>
4. CSS拾遗之箭头画法
<style>
.up {
border -t op: 30px solid green;
border-right: 30px solid transparent;
border-bottom: 30px solid transparent;
border-left: 30px solid transparent;
dis play : inline-block;
}
.down {
border-top: 30px solid transparent;
border-right: 30px solid transparent;
border-bottom: 30px solid red ;
border-left: 30px solid transparent;
display: inline-block;
}
.c1 {
border: 30px solid transparent;
border-top: 30px solid green;
display: inline-block;
m arg in-top: 40px;
}
.c1:hover {
border: 30px solid transparent;
border-bottom: 30px solid green;
margin-top: 10px;
}
</style>
</head>
<body>
<div class="up"></div>
<div class="down"></div>
<div style="height: 100px; background-color: red;">
<div class="c1"></div>
</div>
</body>
总结
以上所述是小编给大家介绍的CSS拾遗之箭头,目录,图标的实现代码, 希望对大家有所帮助 ,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对网站的支持!
如果你 觉得 本文对你有帮助,欢迎 转载 ,烦请注明出处,谢谢!
总结
以上是 为你收集整理的 CSS拾遗之箭头,目录,图标的实现代码 全部内容,希望文章能够帮你解决 CSS拾遗之箭头,目录,图标的实现代码 所遇到的问题。
如果觉得 网站内容还不错, 推荐好友。
查看更多关于CSS拾遗之箭头,目录,图标的实现代码的详细内容...
声明:本文来自网络,不代表【好得很程序员自学网】立场,转载请注明出处:http://haodehen.cn/did200937