0

我在网站中有一个标题,无论浏览器大小如何,我都想填充网站的顶部。

h1 {
    font-family: 'Holtwood One SC';
    color: #1C003A;
    font-size: 4em;
}
#header {   
    float:left;
    text-align:center;
    width: 95%;
    margin: 0px 20px 0px 20px;
}

<div id="header"><a href="index.html"><h1>Spilling the Beans</h1></a></div>

这是 CSS 和 HTML。标题的 div 就在正文中。我不知道要输入什么来使浏览器扩展和收缩。

4

2 回答 2

0

好吧,如果您只是删除float:leftand width:95%,那么它将自动占据浏览器的整个宽度,因为这是默认设置。

但是,如果您实际上是在谈论使文本大小本身根据浏览器大小变得越来越大,您可以尝试使用 Viewport Units:

h1 {
    font-size:4em;
    font-size:5vw;
}

将第一个单元放在 、 或其他常用单元中非常重要ptpx这样em不支持视口单元的浏览器就可以依靠。至于视口单元,根据需要进行调整。您还可以使用vh而不是vw根据视口的高度而不是宽度来调整文本大小。

如果这也不是您的意思,请更具体。

于 2013-03-03T01:02:53.170 回答
0

您应该在页眉中设置页边距并body删除页眉floatmargin

body{
    margin:0; padding:20px;
}
#header {   
    text-align:center;
    width: 100%;
    background:#ccc;
    margin:auto;
}

http://jsfiddle.net/8dtqs/

于 2013-03-03T01:03:36.553 回答