易截截图软件、单文件、免安装、纯绿色、仅160KB

CSS 中英文导航

CSS:
<style type="text/css">
a{
  color: #FFFF99;
  text-decoration: none;
}
a:hover{
  color: #FFFFFF;
  text-decoration: underline;
}
  
#nav{
  padding: 10px 10px 0;
  font-size: 12px;
  font-weight: bold;
  margin: 1em 0 0;
  list-style:none;
}
#nav li{
  float: left;
  margin-right: 1px;
}
.bi{
  position: relative;
  z-index: 0;
}
.bi:hover{
  z-index: 99;
}
.bi:hover span{
  visibility: visible;
  top: 0;
  left: 0;
  cursor: pointer;
}
.bi span{
  position: absolute;
  left: -999em;
  visibility: hidden;
}
#nav li a,.bi:hover span{
  line-height: 20px;
  text-decoration: none;
  background: #DDDDDD;
  color: #666666;
  display: block;
  width: 80px;
  text-align: center;
}
#nav li a:hover,.bi:hover span{
  color: #FFFFFF;
  background: #DC4E1B;
}
.bi:hover span{
  padding-top: 2px;
}
#navbar{
  background: #DC4E1B;
  height: 8px;
  overflow: hidden;
  clear: both;
}
</style>
<ul id="nav">
    <li><a class="bi" href="http://download.csdn.net//">hanlinwang.org<span>我爱CSS</span></a></li>
    <li><a class="bi" href="#">About us<span>关于我们</span></a></li>
    <li><a class="bi" href="#">Products<span>产品展示</span></a></li>
    <li><a class="bi" href="#">Services<span>售后服务</span></a></li>
    <li><a class="bi" href="#">Contact<span>联系我们</span></a></li>
</ul>
<div id="navbar"></div>


相关文档:

IE6 下:hover 中bug解决了(纯CSS)

这个bug,主要是一个二级菜单,在ie7中hover时正常显示出来,在ie6下没有效果。在网上找了很多资料,弄了好几天,最终是参照别人的代码,用的纯css经过自己的整理,就把它给弄下来了。希望以后自己多来看看。
如下:
 -------------------
css代码:
.allMenu
{
    width: 8 ......

常用的CSS命名规则

头:header
  内容:content/container
  尾:footer
  导航:nav
  侧栏:sidebar
  栏目:column
  页面外围控制整体布局宽度:wrapper
  左右中:left right center
  登录条:loginbar
  标志:logo
  广告:banner
  页面主体:main
  热点:hot
  新闻:news
  下载:down ......

Css代码

Css代码
1.line-height:24px; 
line-height:24px;
 
使用固定宽度的容器并且需要一行垂直居中时,使用 line-height 即可(高度与父层容器一致),更多的垂直居中总结可以看这里。
清除容器浮动
Css代码
1.#main {  
2.    overflow:hidden;  
3.} 
#ma ......

CSS實現文字的邊框效果

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"><head><title>Cross-Browser Text Glow Demo</title>
<mce:style type="text/css"><!--
* {
font ......

CSS 高级语法

选择器的分组
意思就是说几个选择器可以同时使用一个声明,但是选择器之间记住一定要用逗号来隔开,这样我们会节省了很多代码
我们举个例子吧!
h1,h2,h2,h3,h5,h6 {
color: red; background:blue;
  }
这样所有的h标题标签的字体颜色是红色,背景是蓝色;应该清楚了吧!
css继承性的问题
子元素继承父元素的 ......
© 2009 ej38.com All Rights Reserved. 关于E健网联系我们 | 站点地图 | 赣ICP备09004571号