HTML:将标题设为中心

时间:2018-08-17 08:20:11

标签: html css

我开始学习HTML,在我的网站顶部中间应该有一个标题。在左上角有一张图片。 如果我想将align="center";的标题设置在中间,我只能将其设置在图片的右端和显示器的右端之间。

我希望这是可以理解的,并且有人可以帮助我!

代码是:

    <div style="float:left; width=600px; height=152px;">
        <img src="bilder/logo.jpg" height="54px" width="214px"    hspace="0" vspace="0"/>
    </div>
    <p>
        <h1 align="center" style="margin-top:15px; margin-bottom:20px;"><u>Peter Möhle</u></h1>         
    </p>

enter image description here

它看起来应该像是底部的图片,但是如果我使用其他浏览器或显示器,则该图像位于左边距的左边,并且不是固定位置

3 个答案:

答案 0 :(得分:0)

我现在使用相对值在左侧填充

<div style="float:left; width=600px; height=152px;">
    <img src="bilder/logo.jpg" height="54px" width="214px"  hspace="0" vspace="0"/>
    </div>
    <p>
       <h1 style="margin-top:15px; margin-bottom:20px; padding-left: 50% "><u>Peter Möhle</u></h1>         
    </p>

答案 1 :(得分:0)

您可以使用text-align: center;来使文本居中,但是如注释中所述,您正在使用一些不推荐使用的标签。

<h1 style="margin-top: 15px; margin-bottom: 20px; text-align: center; text-decoration: underline;">Peter Möhle</h1>

最好删除style属性并创建一个css文件以放置样式。

CSS

h1 {
  margin-top: 15px;
  margin-bottom: 20px;
  text-align: center;
  text-decoration: underline;
}

我还将div标记更改为

<div style="float: left; width: 600px; height: 152px;">
    <img src="bilder/logo.jpg" style="height: 54px; width: 214px;">
</div>

答案 2 :(得分:0)

当您使用不推荐使用的代码时,我已经更新了您的代码段。很高兴听到并清除您的疑问(如果有)。

参考:W3 CSSW3 HTML

>> [-0.68236386 -1.3057938 ]
>> [-0.70928735 -1.4617517 ]
.nav {
  width: 100%;
}

.logo-holder {
  float: left;
  height: 50px;
  width: 100px;
}

.logo {
  height: 100%;
  width: 100%;
}

.nav-text {
  text-align: center;
  text-decoration: underline;
}