如何製作CSS - 角度圖像+背景？和高度 - 100％或自動？

我已經作出了CSS了很多次，但沒有工作，有很多毛刺......
我將顯示畫面 - 毛刺：
見圖片 - http://beta.areku-developstudio.org.ua/new.png
如何製作CSS - 角度圖像+背景？和高度 - 100％或自動？

見圖片（這是必要的，因爲較好的質量）：
見圖片2 - http://beta.areku-developstudio.org.ua/new2.png

如何讓CSS - 角度圖像+背景是什麼？和高度 - 100％或自動？
樣本HTML：

<div id="conteiner" class="main"> 
    <div class="top_left_corner"> 
     <div class="top_right_corner"> 
      <div class="bottom_left_corner"> 
       <div class="bottom_right_corner"> 
        <div id="content"> 
         <br/><br/> 
         Hello Areku<br/> 
         Hello Areku<br/> 
        </div> 
        <br/><br/> 
       </div> 
      </div> 
     </div> 
    </div>  
</div>

選擇其他的方式，使CSS + HTML。可以jQuery嗎？我正在等待答案...
真誠的，Areku！

來源

2010-09-08 areku

有關網頁佈局問題，應該問上DOCTYPE。請參閱http://stackoverflow.com/faq – 2010-09-08 13:01:49

你可以做到這一點與背景屬性對你的各種元素一些有創意的用途：

<html> 
    <body> 
    <div id="content"> 
     Your content 
    </div> 
    <div class="corner right"></div> 
    <div class="corner left"></div> 
    </body> 
</html>

然後CSS將如下所示：

/* Following 2 rules create min-height 100% for your content and body */ 
html, 
body { 
    height: 100%; 
} 

#content { 
    min-height: 100%; 
} 

/* html and body create the fixed position bottom right/left corners */ 
html { 
    background: url(bottom-right.png) no-repeat fixed 100% 0; 
} 

body { 
    background: url(bottom-left.png) no-repeat fixed 0 0; 
} 

/* top right/left corners are handled by 2 divs */ 
.corner { 
    position: fixed; 
    top: 0; 

    width: 50px; /* width of your background image corner */ 
    height: 50px; /* height of your background image corner */  
} 

.left { 
    left: 0; 
    background: url(top-left.png) no-repeat 100% 0; 
} 

.right { 
    right: 0; 
    background: url(top-right.png) no-repeat 100% 0; 
}

來源

2010-09-08 13:17:28 Pat

如何製作CSS - 角度圖像+背景？和高度 - 100％或自動？

回答

相關問題