除去在h1标签内部空间 [英] Remove inner space in h1 tag

问题描述

你好我是一个初学者在HTML和CSS！我试着去得到一个标志和标题的正确对齐。两者应该在同一行上。问题是，我不能删除H1的内部空间，并始终存在于文本之上的保证金（如果我颜色的BG为H1，我看到它进一步文本上方延伸）。有没有办法来解决这个还是我做错了？我想两者是完全一样的高度，并在完全相同的水平位置（在标题中的T顶部应在IMG的顶部和同为底部）。

HTML：

 ＆LT;头＆GT;
    ＆LT; IMG SRC =图像/ logo.gifALT =标志＆GT;
    ＆LT; H1＆GT;标题＆LT; / H1＆GT;
＆LT; /头＆GT;
 

CSS：

 头
{
    溢出：汽车;
}

标题IMG
{
    浮动：左;
    宽度：55像素;
    高度：55像素;
    保证金右：20像素;
}

头H1
{
    浮动：左;
    填充：0px;
    保证金：0px;
    字体大小：55像素;
}
 

解决方案

我创建了一个的jsfiddle你..让我知道这是笏你正在努力实现 -

的jsfiddle定位 - H1和IMG

 头
 {
溢出：汽车;
      }

标题IMG
 {
浮动：左;
宽度：55像素;
高度：55像素;
保证金右：20像素;
的margin-top：10px的; / *添加此* /
}
 

Hi im a beginner in HTML and CSS! Im trying to get the proper alignment of a logo and a title . Both of them should be on the same line. The problem is that i cant remove the inner space of the h1 and there is always a margin on top of the text (if i color the bg for the h1, i see that it extends further above the text). Is there a way to solve this or am i doing it wrong? I want both of them to be exactly the same height and in the exact same horizontal position (the top of the "T" in title should be at the top of the img and the same for bottom).

HTML:

<header>
    <img src="images/logo.gif" alt="logo">
    <h1>Title</h1>
</header>

CSS:

header
{
    overflow:auto;
}

header img
{
    float:left;
    width:55px;
    height:55px;
    margin-right:20px;
}

header h1
{
    float:left;
    padding:0px;
    margin:0px;
    font-size:55px;
}

解决方案

I have created a jsfiddle for you .. let me know if this is wat you are trying to achieve -

JSFiddle ALignment - H1 and IMG

  header
 {
overflow:auto;
      }

header img
 {
float:left;
width:55px;
height:55px;
margin-right:20px;
margin-top:10px;/*add this */
}

这篇关于除去在h1标签内部空间的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！