我想添加一行文字,背景颜色应该是网站的完整颜色。
我想在网站中将文本居中。我给了文本一个特定的宽度,使其居中。虽然背景颜色和文本一样宽,但我想扩展它
#wrapper {
text-align: center;
background-color: #e6eef2;
padding: 7px;
width: 1222px;
margin: 0 auto;
}
.topbar {
display: flex;
justify-content: space-between;
color: #06507f;
}
<header>
<div id="wrapper">
<div class="topbar">
<span>Lidl-Reisen.de - ... einfach urlaubiger!</span>
<ul>
<li><a href="http://www.lidl.de/de/verantwortung">Verantwortung</a></li>
<li><a href="http://www.lidl.de/de/geschichte">Unternehmen</a></li>
<li><a href="http://www.lidl.de/de/karriere">Karriere</a></li>
<li><a href="https://www.lidl-reisen.de/faq">Service & Hilfe</a></li>
</ul>
</div>
</div>
</header>
这是我指的网站:https://www.lidl-reisen.de/asd
我想重新创建顶栏
最佳答案
如果你想重新创建那个导航栏,你应该使用绝对位置,这样你就不会得到额外的边距,尽管你可以在不使用它的情况下修复它。 代码: HTML:
<header>
<div id="wrapper">
<div class="topbar">
<span>Lidl-Reisen.de - ... einfach urlaubiger!</span>
<ul>
<li><a href="http://www.lidl.de/de/verantwortung">Verantwortung</a></li>
<li><a href="http://www.lidl.de/de/geschichte">Unternehmen</a></li>
<li><a href="http://www.lidl.de/de/karriere">Karriere</a></li>
<li><a href="https://www.lidl-reisen.de/faq">Service & Hilfe</a></li>
</ul>
</div>
</div>
</header>
CSS:
#wrapper {
text-align: center;
background-color: #e6eef2;
width: 100%;
position: absolute;
left:0;
top:0;
padding:10px;
}
.topbar {
display: flex;
justify-content: space-between;
color: #06507f;
}
查看我的 js fiddle 链接:https://codepen.io/djmayank/pen/PooZrKo
关于html - 我有一行 X 像素宽的文本。背景颜色也是 X px 宽。如何扩展背景颜色使其比文本更长?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/58371296/