Discuz!官方免费开源建站系统

 找回密码
 立即注册

QQ登录

只需一步,快速开始

搜索

[分享] 【ingbx】css\common.css学习第三四五步header style,nav style,footer style

[复制链接]
bestabba 发表于 2009-5-1 14:26:06 | 显示全部楼层 |阅读模式
本帖最后由 bestabba 于 2009-5-1 21:25 编辑

【ingbx】css\common.css学习第二步common style
https://discuz.dismall.com/thread-1286200-1-1.html
3-----------------------------------------------------------------------------------------------
/* header style */头部样式
#header { width:960px; height:65px; overflow:hidden; margin:10px auto; }
头部 宽度960px 高度65px 悬浮隐藏 外边距
        #header h2 { float:left; }
                #header h2 img { width:135px; height:65px; }
                #header .ad_header { float:right; text-align:right; }
图片头部  广告头部
4-------------------------------------------------------------------------------------------------
/* nav style */ 导航样式
#nav { width:960px; overflow:hidden; margin:0 auto 10px; background:#D3EAF0; }
        .main_nav { height:34px; overflow:hidden; padding-top:1px; background:#1A4963; color:#FFF; font-size:14px; }
                .main_nav ul { width:94%; overflow:hidden; padding:0 0 0 1.3%; }
                .main_nav ul li { float:left; margin-right:1px; }
                .main_nav ul li a { float:left; display:block; padding:9px 15px; color:#FFF; }
                .main_nav .current a { background:url(../images/nav_current_bg.gif) repeat-x; color:#295B72; font-weight:700; text-decoration:none!important; }
        ul.ext_nav { padding:7px 12px; color:#369; line-height:1.9em; }
                ul.ext_nav li { float:left; margin-right:8px; white-space:nowrap; }
设置或检索对象内空格的处理方式。
white-space : normal | pre | nowrap
normal :  默认处理方式
pre :  用等宽字体显示预先格式化的文本。不合并字间的空白距离和进行两端对齐。参阅pre对象
nowrap :  强制在同一行内显示所有文本,直到文本结束或者遭遇br对象。参阅td,div等对象的nowrap属性(特性)

                ul.ext_nav a { margin-right:2px; color:#295B72; }
        .order_nav { padding:7px 12px; color:#369; line-height:1.9em; }
                .order_nav li  { height:1.9em; overflow:hidden; }
                .order_nav li a { margin-left:2px; color:#295B72; }
                .order_nav em { margin-right:3px; color:#295B72; }
        #contribute_op { position:absolute; top:140px; left:15px; padding:5px 15px; border:1px solid #D8D8D8; background:#F7FDFD; }
                #contribute_op li { margin:2px 0; }
                #contribute_op li a { color:#369;}
5-----------------------------------------------------------------------------------------------
/* footer style */  脚部样式
#footer { width:960px; overflow:hidden; margin:0 auto; padding:6px 0; text-align:center; line-height:20px; }
        .copyright, .copyright a { color:#666;}
        #footer_top { height:50px; margin-bottom:10px; background:#D3EAF0; }
                .good_link { float:left; width:500px; overflow:hidden; margin:15px 0 0 10px; color:#369; text-align:left; }
                .good_link a { margin:0 3px; color:#295B72; }
                .footer_search { float:right; width:340px; padding:13px 0 0 0; }
                .footer_search .input_tx { padding:3px; }
                .footer_search select { padding:1px 2px 2px 2px; }

【ingbx】css\common.css学习第六步focus turn
https://discuz.dismall.com/thread-1282882-1-1.html
xianglei0 发表于 2009-5-1 15:21:21 | 显示全部楼层
顶下。。。沙发哦!1!
回复

使用道具 举报

社区泡泡 发表于 2009-5-1 18:17:29 | 显示全部楼层
最好更深入一些,只是贴出来,没太多意义
回复

使用道具 举报

 楼主| bestabba 发表于 2009-5-1 20:22:53 | 显示全部楼层
这还怎么写深入啊,从头看起,重复的内容没有浪费时间写了,看不明白的地方从第一帖看起啦
回复

使用道具 举报

 楼主| bestabba 发表于 2009-5-1 20:23:40 | 显示全部楼层
至于说CSS 定义的名称都是那些内容,这个等把CSS基础属性写完后再一个一个写吧,稍安勿躁
回复

使用道具 举报

cwell 发表于 2009-5-1 20:26:00 | 显示全部楼层
继续深入啊...不错..支持您..
回复

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

手机版|小黑屋|Discuz! 官方站 ( 皖ICP备16010102号 )star

GMT+8, 2025-2-24 10:09 , Processed in 0.027494 second(s), 4 queries , Gzip On, Redis On.

Powered by Discuz! X3.4

Copyright © 2001-2023, Tencent Cloud.

快速回复 返回顶部 返回列表