请高人解释下这些css代码小弟刚学有些东西不理解

1个回答

  • 全文注释了 写法可以改进 有一处不规范的地方

    /* ID为zishu下的标签的样式

    float:left; 左边浮动 margin-left:5px;左外边距为5px px为像素 margin-top:50px;上外边距为50px*/

    #zishu li{ float:left; margin-left:5px; margin-top:50px;}

    /* nav_a类的链接和链接点击后样式

    text-decoration:none; 没有下划线 display:block;块对象显示 padding-right:10px;右内边距为10px

    background:url(xx.gif) no-repeat right top; 背景为XX.GIF 平且右和上不平铺

    margin-top:3px; 左外边距为3px color:#000; 颜色为黑色 float:left; 左浮动 */

    .nav_a a:link,.nav_a a:visited{text-decoration:none; display:block; padding-right:10px; background:url(http://www.***.cn/attachments/month_0702/v200721005948.gif) no-repeat right top;margin-top:3px; color:#000; float:left;}

    /* nav_a类下的标签样式

    cursor:hand;鼠标为手型 不规范不建议这样写 建议用pointer

    background-color:#DBF0C4;背景颜色 #DBF0C4 font-size:14px; 字体为14px

    background:url(xx.gif) no-repeat; 背景为XX.GIF 平且不平铺

    line-height:29px; 行高29px padding-left:10px;左内边距10px; float:left;左浮动 */

    .nav_a span{cursor:hand;background-color:#DBF0C4; font-size:14px;background:url(http://www.***.cn/attachments/month_0702/x200721005941.gif) no-repeat; display:block; line-height:29px; padding-left:10px; cursor:hand; float:left;}

    /* nav_a类下的 链接鼠标悬停和操作的样式

    text-decoration:none; 没有下划线

    background:url(xx.gif) no-repeat right bottom; 背景为XX.GIF 平且右和下不平铺

    其他雷同 */

    .nav_a a:hover,.nav_a active{text-decoration:none; display:block; padding-right:10px; background:url(http://www.***.cn/attachments/month_0702/v200721005948.gif) no-repeat right bottom;margin-top:0px; color:#000}

    /* nav_a类下链接悬停和操作下的标签的样式

    background:url(xx.gif) no-repeat left bottom; 背景为XX.GIF 平且左和下不平铺*/

    .nav_a a:hover span,.nav_a a:active span{background-color:#DBF0C4; font-size:14px;background:url(http://www.***.cn/attachments/month_0702/x200721005941.gif) no-repeat left bottom; display:block; line-height:29px; padding-left:10px; margin-top:0px; padding-top:1px; padding-bottom:2px; cursor:hand;}

    /* ID为box的样式

    background:#009900;背景颜色为#009900 可简写 #090;

    height:4px; 高度为4px;

    overflow:hidden; 内容如果超过了自动截断 不显示

    clear:both 清楚浮动

    */

    #box{ background:#009900; height:4px; overflow:hidden; clear:both}