时间戳

首页 > 解决方案 > HTML：为什么文本比图像低一个段落？（附图片）

html - HTML：为什么文本比图像低一个段落？（附图片）

问题描述

我有以下问题：

这是我目前得到的结果：

在此处输入图像描述

它由以下 HTML 代码生成：

.box-2 /*targeting class from HTML*/
    {
    	border:8px dotted #ccc;
    }
<!--Who we are-->
<div id="whoweare" align="center" class="box-2">
  <div align="center>	
    <font color="#534f4f" size="+1">	
      <h1 id="txt_whoweare_headline">Who we are</h1>
    </font>
  </div>
  <div style="padding-left: 15px; padding-right: 15px">	
    <table border="0">
      <tr> <!--tablerow-->
        <th width=400px>
          <div align="center">	
            <img 
              src="./img/me.png"
              width=60%>	
          </div>
        </th>	
        <td width=400px>
          <div align="justify">								
            <font color="#534f4f" size="+2" >	
              <h3>Julius Tolksdorf</h3>
              <div id="txt_whoweare_body1">CEO of innomotion media and head of software development.</div> 
              <div id="txt_whoweare_body2">
                He will be your primary contact during the planning and development processes.
                Julius has already finished about 20 apps, games & web pages and has years of experience being an Android & Unity developer.
              </div>
            </font>
          </div>
        </td>	
      </tr> <!--for padding-->
        <tr height=20px/>
      </tr>

    </table>
  </div>
</div>

正如您可能看到的那样，“JULIUS TOLKSDORF”文字的开头比左边的图像低一行。当然，我希望他们两个从同一行开始。CSS就是这样的：

.box-2 /*targeting class from HTML*/
{
    border:8px dotted #ccc;
}

如果有人指导我解决上述问题，我将不胜感激。

谢谢你：）

标签： htmlcss

解决方案

标题标签默认有边距，所以你<h3>也有这个边距。解决您的问题的方法是将margin顶部设置为 0。

代码类似于：

h3 {
    margin-top: 0;
}

注意：这将删除页面中所有 h3 元素的上边距。

推荐阅读