HTML＆CSS - 顯示部分字幕框

我試圖在容器中獲得一個小的或「部分」的字幕框。基本上我想展示4個內角。類似於以下內容：我想知道我該怎麼做？任何幫助表示讚賞。HTML＆CSS - 顯示部分字幕框

+--------------------------------------------+ ---> this is main container 
    | +--         --+ | 
    | |          | | 
    |           | 
    |           | 
    |           | 
    |           | 
    |           | 
    | |          | | 
    | +--         --+ | 
    +--------------------------------------------+

來源

2011-08-04 MikeDarrow

你有它應該如何看一個形象的例子？ – OverZealous

像這樣？

<!DOCTYPE html> 
<html> 
    <head></head> 
    <body> 
     <div id='the_container' style='border: 1px solid #000; width:90%; height:90%; top: 5%; left: 5%; position: absolute;'> 
      <div id='corner_t_l' style='border-top: 1px dashed #000; border-left: 1px dashed #000; top: 10px; left: 10px; width: 30px; height: 30px; position: absolute;'></div> 
      <div id='corner_t_r' style='border-top: 1px dashed #000; border-right: 1px dashed #000; top: 10px; right: 10px; width: 30px; height: 30px; position: absolute;'></div> 
      <div id='corner_b_r' style='border-bottom: 1px dashed #000; border-right: 1px dashed #000; bottom: 10px; right: 10px; width: 30px; height: 30px; position: absolute;'></div> 
      <div id='corner_b_l' style='border-bottom: 1px dashed #000; border-left: 1px dashed #000; bottom: 10px; left: 10px; width: 30px; height: 30px; position: absolute;'></div>  </div> 
    </body> 
</html>

活生生的例子：http://jsfiddle.net/vKZzD/

來源

2011-08-04 02:24:44 micha

完美！非常感謝！ – MikeDarrow

你的意思是這樣的：

<div style='padding: 15px'> 
    <div style='background: url(...)'></div> 
    </div>

？如果高度和寬度未知，則可以使用用於在4格上生成圓角的方法，例如

來源

2011-08-04 02:19:43 mkk

是的，這將工作，但我一直在尋找純粹使用邊界和divs在每個角落。這可行嗎？ – MikeDarrow

HTML＆CSS - 顯示部分字幕框

回答

相關問題