DW 主页CSS代码

@charset "utf-8";
/* CSS Document */
.allbody {
position:absolute;
margin:auto;
width: 100%;
z-index: 1;
background-color:#FFF;
text-align:center;
font-size:16px;
}
#bgnav {
position:relative;
margin:auto;
top:0px;
left:0px;
width: 960px;
height: 50px;
z-index: 2;
}
#shangbiaoti {
position:relative;
margin:auto;
top:0px;
left:0px;
width: 960px;
height: 50px;
z-index: 1;
}
#logo{
position:relative;
height:50px;
width:150px;
z-index: 1;
}
#denglu{
position: relative;
height: 50px;
width: 810px;
top:-50px;
left:150px;
z-index: 2;
line-height:100px;
font:bold 14px "微软雅黑" ;
text-align:right;
line-height:65px;
}
.daohang {
position: relative;
float:left;
width: 160px;
height: 48px;
z-index: 1;
line-height:10px;
font:bold 17px "微软雅黑" ;
line-height:65px;
border-top:solid 1px #000000;
border-bottom:solid 1px #000000;
}
.yincang {
position: relative;
float:left;
width: 160px;
height: 50px;
z-index: 1;
line-height:10px;
overflow:hidden;
}

.xianshi {
position: relative;
float:left;
width: 160px;
height: 50px;
z-index: 1;
line-height:10px;
overflow:visible;
background-image:url(../images/button1.jpg);
}
#datu {
position:relative;
margin:auto;
top:0px;
left:0px;
width: 960px;
height: 500px;
z-index: 1;
background-color:#FFF;
}
#zhuce {
position:relative;
margin:auto;
top:0px;
left:0px;
width: 960px;
height: 300px;
z-index: 1;
background-color:#FFF;
}
#zhuti {
position:relative;
margin:auto;
top:0px;
left:0px;
width: 960px;
height: 1500px;
z-index: 1;
}
#zhuti1 {
position:relative;
margin:auto;
top:0px;
left:0px;
width: 960px;
height: 500px;
z-index: 1;
background-color:#FFF;
}
#zhuti1-zuo {
position:relative;
top:0px;
left:0px;
width: 750px;
height: 500px;
z-index: 1;
background-color:#FFF;
}
#zhuti1-you {
position:relative;
top:-500px;
float:right;
width: 208px;
height: 498px;
z-index: 1;
background-color:#FFF;
border:#CACACA 1px solid;
}
#zhuti2 {
position:relative;
margin:auto;
top:0px;
left:0px;
width: 960px;
height: 500px;
z-index: 1;
background-color:#0F0;
}
#zhuti2-zuo {
position:relative;
top:0px;
float:left;
width: 208px;
height: 498px;
z-index: 2;
background-color:#FFF;
border:#CACACA 1px solid;
}
#zhuti2-you {
position:relative;
top:-500px;
width: 750px;
height: 500px;
z-index: 1;
float:right;
background-color:#069;
}
#zhuti3 {
position:relative;
margin:auto;
top:-500px;
left:0px;
width: 960px;
height: 500px;
z-index: 1;
background-color:#300;
clear:both;
}
#zhuti3-zuo {
position:relative;
top:0px;
left:0px;
width: 750px;
height: 500px;
z-index: 1;
background-color:#C60;

}
#zhuti3-you {
position:relative;
top:-500px;
left:750px;
width: 210px;
height: 500px;
z-index: 1;
background-color:#FFF;
}

.xiaotu {
position:relative;
top:0px;
left:0px;
float:left;
width: 375px;
height: 250px;
z-index: 1;
background-color:#030;
}
.xiaotu a,.xiaotu span{display:none; text-decoration:none}
.xiaotu:hover{cursor:pointer;text-decoration:none}
.xiaotu:hover a.now{cursor:pointer; position:relative; top:0; width:100%; height:100%;
z-index:100; left:0; display:block;}
.xiaotu:hover span{ display:block;position:relative; top:125px; left:5px;color:#FFF;width:365px;
z-index:10;height:120px; line-height:30px; background:#000;filter:alpha(opacity=60);-moz-opacity:0.5;opacity: 0.5;}

a:link{
color:#000;
text-decoration:none;
}
a:visited{
color:#000;
text-decoration:none;
}
a:hover{
color:#000;
text-decoration:none;
}
p.a:link{
color:#03F;
}
p.a:visited{
color:#03F;
}
p.a:hover{
color:#03F;
text-decoration:underline;
}
#di {
position:relative;
margin:auto;
width: 960px;
height: 48px;
z-index: 2;
border-top:solid 1px #000000;
border-bottom:solid 1px #000000;
text-align:center;
line-height:70px;
}
p{
text-align:left;
font-size:16px;
}
#dingbu{
position:fixed;
right:20px;
bottom:20px;
width:100px;
height:58px;
}

时间: 2024-10-05 23:27:02

DW 主页CSS代码的相关文章

Zen Coding: 一种快速编写HTML/CSS代码的方法[Emmet]

译自:[Smashing Magazine](http://www.smashingmagazine.com/2009/11/21/zen-coding-a-new-way-to-write-html-code/)中文:[Zen Coding: 一种快速编写HTML/CSS代码的方法](http://www.qianduan.net/zen-coding-a-new-way-to-write-html-code.html) 请尊重版权,转载请注明来源! - - - - - - 在本文中我们将展示

页面定制CSS代码-博客侧边栏公告-页首Html代码-页脚Html代码

设置代码前说明:首先你得选用博客皮肤darkgreentrip,否则会出错 页面定制CSS代码: 说明:标注颜色位置可自行修改,第12行设置主页底层图片,可自行修改 #home { margin: 0 auto; width: 80%;/*原始65*/ min-width: 980px;/*页面顶部的宽度*/ background-color: rgba(245, 245, 245, 0.7); padding: 30px; margin-top: 50px; margin-bottom: 50

sublime text3---Emmet:HTML/CSS代码快速编写神器

Emmet的前身是大名鼎鼎的Zen coding,如果你从事Web前端开发的话,对该插件一定不会陌生.它使用仿CSS选择器的语法来生成代码,大大提高了HTML/CSS代码编写的速度,比如下面的演示:  Zen coding下的编码演示 一.快速编写HTML代码 1.  初始化 HTML文档需要包含一些固定的标签,比如<html>.<head>.<body>等,现在你只需要1秒钟就可以输入这些标签.比如输入"!"或"html:5",

20个编写现代CSS代码的建议

明白何谓Margin Collapse 不同于其他很多属性,盒模型中垂直方向上的Margin会在相遇时发生崩塌,也就是说当某个元素的底部Margin与另一个元素的顶部Margin相邻时,只有二者中的较大值会被保留下来,可以从下面这个简单的例子来学习: .square { width: 80px; height: 80px; } .red { background-color: #F44336; margin-bottom: 40px; } .blue { background-color: #2

如何写出优雅的CSS代码 ?(转)

对于同样的项目或者是一个网页,尽管最终每个前端开发工程师都可以实现相同的效果,但是他们所写的代码一定是不同的.有的优雅,看起来清晰易懂,代码具有可拓展性,这样的代码有利于团队合作和后期的维护:而有的混乱,虽然表达出了最终的效果,然而却晦涩难懂,显然团队成员在读这样的代码时就显得无从下手,更不利于后期的维护了.那么如何写出优雅的代码呢?下面我将以一个很小的项目就以下几个方面简单的表达一下自己的看法,如有不妥,望批评指正. 如何整理一个项目. 如何写出清晰易懂的HTML代码. 如何写出优雅的css代

实用的60个CSS代码片段

1.垂直对齐 如果你用CSS,则你会有困惑:我该怎么垂直对齐容器中的元素?现在,利用CSS3的Transform,可以很优雅的解决这个困惑: .verticalcenter{ position: relative; top: 50%; -webkit-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); } 使用这个技巧,从单行文本.段落到box,都会垂直对齐.目前浏览器

【转】一个DIV+CSS代码布局的简单导航条

原文地址:http://www.divcss5.com/shili/s731.shtml 简单的DIV CSS代码布局实现导航条 一个蓝色主题的导航条布局案例,本CSS小实例,采用DIV CSS实现.同时不用图片做背景,直接使用背景色实现,鼠标经过悬停对应栏目名称是对应背景蓝色变深. 导航条部分效果截图 一般导航条采用ul li列表布局,这里也不例外DIVCSS5实例也采用列表标签ul li+ CSS布局. 一.布局思维思考   -   TOP 在实际DIV+CSS布局项目中,一般不会只使用一次

高效的CSS代码(2)

——阅读笔记,欢迎纠错^_^ 内容比较零散..... 1.让浮动元素的父容器根据元素的高度而自适应高度的方法: <div class="clearfix"><div class="fl"></div></div> /*意思就是最外面的一层<div></div>是父容器,给他加上清除浮动的功能,clearfix的代码再高效的CSS代码(1)中有*/ 2.再写代码前不是要先分析一下页面的模块吗,模块

使用Ant和YUICompressor链接合并压缩你的JS和CSS代码

JS代码和CSS代码在上线前要压缩大家应该都是知道的了.记得之前做项目的时候,最后要交差的时候是找了个网站,将JS代码的文件一个一个地复制,粘贴,复制,粘贴. 当时就在想:TMD有没有好一点的方法,劳资不想老是用Ctrl大法.啊啊啊啊啊啊啊啊阿~.最最坑爹的是,有时候将代码复制粘贴的时候手一抖可能就删了点什么东西,手一快又保存了,反正各种坑爹.坑到没朋友. 但是呢,不压缩也不是是吧? 在写JS代码渐渐多了起来的时候就发现手动压缩根本不是长远的方法.而且JS的代码也开始分块,分功能,分文件写了,尽