淘宝怎么修改CSS代码

html-css026

淘宝怎么修改CSS代码,第1张

首先,在HTML里给导航条加一个class类似:

<div class="daohang" ></div>

然后,在这个CSS区域这样写:

.daohang{ background:#A10000}

这句话的意思就是,这个class名为"daohang"的节点,背景色的颜色是#A10000

1、尝试以下css代码,对每个分辨率设置不同的背景图片:

/* 大屏幕 */

@media (min-width: 1200px) { ... }

 

/* 平板电脑和小屏电脑之间的分辨率 */

@media (min-width: 768px) and (max-width: 979px) { ... }

 

/* 横向放置的手机和竖向放置的平板之间的分辨率 */

@media (max-width: 767px) { ... }

 

/* 横向放置的手机及分辨率更小的设备 */

@media (max-width: 480px) { ... }

2、利用css3新属性:background-size

具体使用方法可以百度:css3 background-size

3、利用绝对定位方法,例如背景图是body层的,可以在body里建立一个div,div中插入img标签,也就是你的背景,长宽是100%,div的长宽也是100%(body、html标签要在css中设置长宽100%,常被忽略,虽然看似没有,但是有效的),代码例如:

<style type="text/css">

html, body { width:100% height:100% margin:0 padding:0}

.divBg { position:absolute left:0 top:0 height:100% width:100%}

.divBody{ position:absolute left:0 top:0 height:100% width:100% text-align:center}

</style>

<div class="divBg"><img src="/img/bdlogo.gif" height="100%" width="100%" /></div>

<div class="divBody">

<div class="yourcss">

        <h1>文字内容在这里,不受影响</h1>

        <h1>文字内容在这里,不受影响</h1>

        <h1>文字内容在这里,不受影响</h1>

        <h1>文字内容在这里,不受影响</h1>

        <h1>文字内容在这里,不受影响</h1>

    </div>

</div>

类似的,如果想要做固定区域的背景图,一样可以相对于父级元素长宽设定。

如图:

代码可见附件: