我正在创建一个名为 WebSpace 的网站,我希望标题背景颜色从头到尾延伸。目前,它看起来像这样:
如果可能的话,我想用一个干净的解决方案摆脱顶部、左侧和右侧的额外空白。
这是HTML:
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="/assets/style.css"/>
<link rel="stylesheet" href="/assets/layout.css"/>
<title>WebSpace</title>
</head>
<body>
<div class="row title">
<span class="title">WebSpace</span>
</div>
</body>
</html>
style.css 文件:
@import url(http://fonts.googleapis.com/css?family=Roboto:400,700,100&subset=cyrillic,cyrillic-ext,latin-ext,latin);
body {
font-family: 'Roboto', sans-serif;
}
span.title {
font-weight: 100;
font-size: 66px;
width: 100%;
float: left;
}
还有我的 layout.css 文件:
body { overflow-x:hidden; !important}
html { width: 100%; }
div.row { width: 100%; }
div.span10 { width: 100%; }
div.span9 { width: 90%; }
div.span8 { width: 80%; }
div.span7 { width: 70%; }
div.span6 { width: 60%; }
div.span5 { width: 50%; }
div.span4 { width: 40%; }
div.span3 { width: 30%; }
div.span2 { width: 20%; }
div.span1 { width: 10%; }
/*Row Styles*/
div.title {
background-color: #F7D023;
height: 100px;
color: white;
position: absolute:
left: 0;
right: 0;
overflow-x:hidden; !important
}