定位圖像與CSS

我有這樣的代碼：定位圖像與CSS

<div id="container"> 
<div id="header"> logo ... 
<div id"main"> some content....

該容器寬度是960像素。所以...我想在主要部分放大圖像（2000x300px）我該如何做到這一點？

來源

2011-02-13 dynamyc

這似乎是一個巨大的形象......反正，你介意發佈一些你當前的代碼？ – JCOC611 2011-02-13 23:39:55

這個怎麼樣？

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN">  
<html> 
<head>  
    <style type="text/css"> 
     #mainSection{ 
      with:960px; 
      background-image:url(http://mydomain.com/images/bg.png); 
      background-repeat:no-repeat; 
     } 
    </style> 

    <title></title> 
</head> 

<body> 
    <div id="mainSection"></div> 
</body> 
</html>

您還可以指定要形象要通過增加像這樣的主區樣式定義：

background-position:left top;

來源

2011-02-13 23:50:02

從您的評論：

@thirtydot我希望用戶水平滾動以查看其餘部分

我明白你想要什麼。與此CSS

<div id="largeImageContainer"> 
    <img .. /> 
</div>

：

你可以做到這一點

#largeImageContainer { 
    width: 700px; 
    margin: 0 auto; 
    overflow-x: scroll 
}

這裏是展示想法Live Demo。你應該從這個答案複製代碼，而不是我的演示。

關於overflow-x;看：https://developer.mozilla.org/En/CSS/Overflow-x

來源

2011-02-14 00:32:10 thirtydot

定位圖像與CSS

回答

相關問題