实现这种结构的最佳方式是什么？

我们有一个标题，它的左右两行。实现这种结构的最佳方式是什么？

左边的行必须将剩余区域填充到标题左侧（减去一个小边距），右边的行必须填充标题右侧的剩余区域。

查看下面的插图，了解我需要什么。

来源

2012-11-07 Maxim

http://stackoverflow.com/questions/9468923/的可能的复制 –

使用<HR>元素来画线并把DIV与文本超过它，并给它相同的背景颜色和网页。

来源

2012-11-07 13:59:54

谢谢，这是我的第一个决定，但它不'吨的工作对我来说，becouse页面背景可能是图片。 – Maxim

好吧，所以不要给它一个背景色？它应该从父级继承背景颜色，不是？ –

怎么样两个继承的元素，其中父母有一个在其中的行背景。子元素包含白色背景并具有小填充。如果将父元素中的子元素居中，则应该获得所需的效果。

例如，这应该工作：

<html> 
    <head> 
     <title></title> 
     <style type="text/css"> 
      #header { 
       width: 100%; 
       padding: 0; 
       background: url(img/line.png) repeat-x; 
      } 

      #headertext{ 
       text-align: center; 
      } 

      #headertext h1 { 
       display: inline; 
       background-color: white; 
       font-size: 150%; 
       padding: 4px; 
      } 
     </style> 
    </head> 
    <body> 
     <div id="header"> 
      <div id="headertext"> 
       <h1>Heading</h1> 
      </div> 
     </div> 
    </body> 
</html>

来源

2012-11-07 14:14:41

实现这种结构的最佳方式是什么？

回答

相关问题