上一篇: 是不是“文本溢出：省略号”有效... 下一篇:css – AngularJS根据另一个元素...

css – 将图像定位在布局之外

CSS 发布时间：2022-04-17 发布网站：大佬教程 code.js-code.com

大佬教程收集整理的这篇文章主要介绍了css – 将图像定位在布局之外，大佬教程大佬觉得挺不错的，现在分享给大家，也给大家做个参考。

我正在制作一个宽960像素的网站,但我希望在标题的两边都有图像,如果你有更大的屏幕,你可以看到.

因为我想保持网站960px宽我需要这些额外的侧面图像不被浏览器计算,我可以让它在左边工作

看这里：

http://www.wireframebox.com/test/sideimages/index_leftworks.html

码：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style type="text/css">
body { margin: 0; padding: 0; border: 0; BACkground-color:#096 }

img { border: 0; }

#main { 
    width:960px; 
    height:216px; 
    BACkground-image:url(main.jpg);
    position:relative;
    top:0; margin: 0 auto;
}



#left {
    width:170px;
    height:216px;
    BACkground-image:url(left.jpg);
    float:left;
    left:-170px;
    position:relative;
}

#right {
    width:170px;
    height:216px;
    BACkground-image:url(right.jpg);
    float:right;
    left:170px;
    position:relative;
}



</style>

</head>

<body>

    <div id="main">
        <div id="left"></div>
        <div id="right"></div>
    </div>
</body>
</html>