这是我在一个网站上看到的,CSS控制一个菜单,很经典实用
Css文件如下:css.css
@charset "UTF-8";
/* navigation.css
$Revision: 1.0 $
(c) 2008 Fortinet, Inc. All rights reserved.
*/
/* Navigation Styles ------------------------------------------- */
#wrapper
{
width:1000px;margin:0 auto;
}
#nav_bar {
clear: both;
background: url(./menu_bkrd.jpg) repeat-x;
height: 26px;
width: 100%;
}
#navigation {
padding: 0 0 0 10px;
}
#nav, #nav ul {
float: left;
list-style: none;
line-height: 1;
padding: 0 0 0 0; /* 0 0 0 0.5em; */
margin: 0; /* 0 0 1em 0; */
/* border: solid 1px #33FF00; /* (Green) remove this item after testing */
width:auto;
}
#nav a {
font: 11px/12px Tahoma, Arial, Helvetica, Verdana, sans-serif;
color: #6a737b;
display: block;
width: 150px; /* 6em; 3em; 10em -- 150px*/
text-decoration: none;
padding: 7px 10px 4px 6px; /* 0.5em 3.5em 0.2em .5em; 0.4em 0 0.2em 0; // 0.4em 2em 0.2em 2em; // 0.5em 2em; */
margin: 0px; /* 0.5em 2em; uncommented - fixes extra space on right for IE 0 0 0 1px */
/* border: solid 1px #FF0000; /* (Red) remove this item after testing */
}
#nav a.top_nav {
font: 12px Arial, Helvetica, sans-serif;
color: #6a737b;
text-align: center;
width: 90px;
margin: 0;
padding: 6px 0 4px 0;
text-decoration: none;
font-weight: bold;
white-space: nowrap; /* */
}
#nav a.nav_parent {
background: url(./rightarrow.gif) center right no-repeat;
/* white-space: nowrap; /* */
/* border: solid 1px #FFFF00; /* (yellow) remove this item after testing */
}
#nav li {
/*float: left;*/
padding: 0;
/* width: 150px; /* 7.5em; 10em; 12em 178px; this has no affect whatsoever */
/* border: solid 1px #FFFF00; /* (yellow) remove this item after testing */
}
#nav li.top_nav
本文列举了兼容 IE 和 FF 地换行 CSS 推荐样式,详细介绍了word-wrap同word-break地区别.兼容 IE 和 FF 地换行 CSS 推荐样式：
最好地方式是
word-wrap:break-word; overflow:hidden;
而不是
word-wrap:break-word; word-break:break-all;
也不是
word-wrap:break-word; overflow:auto;
这种最好地方式,在 IE 下没有� ......
虽然CSS样式的学习需要我们动手多实践，需要多做案例，思致思考，但有时候注意资料的收集与整理也是非常重要的，在实际开发中往往会起到事半功倍的效果。在www.phpq.net的文档中，也提供了丰富的内容。下面一些关于按钮、文本框、表单的常用CSS样式。大家可以参考。
一、按钮样式
.buttoncss {
font-family: "tahoma", ......
几个css元素的简单解释 div ul dl dt oldiv，这个很常见，块级元素，div尽量少用，和table一样，嵌套越少越好
ol 有序列表。
<ol>
<li>……</li>
<li>……</li>
<li>……</li>
</ol>
表现为：
1……
2…& ......
