HTML5 - 在其图像旁边放置h1文本

Question

我试图在徽标图片旁边放一个HEADER标签H1标签，如下所示：

＆＃13;

＆＃13;

/* line 1, ../scss/layout/_header.scss */
header {
  background: white;
  color: red;
  height: 100px;
}

header img.logoImage{
    width:30px;
    height:30px;
}
/* line 6, ../scss/layout/_header.scss */
header h1#companyName {
  padding: 20px;
  font-size: 20px;
    
}
/* line 10, ../scss/layout/_header.scss */
header h1#companyName a .logoImage {

}

＆＃13;

   <header>     
     <h1 id="companyName">
      <a href="#" title="Company Website">
        <img class="logoImage" title="" src="https://encrypted-tbn1.gstatic.com/images?q=tbn:ANd9GcSd51Q5z8j6c_EBEYzZgU1pfyiGHxOUgchpUs9wC3eaFn6PrXfqe8kjWA" alt="Company Name"/>
          Company name
      </a>    
    </h1>           
   </header>

＆＃13;

＆＃13;

＆＃13;

事情是＆＃34;一些标题＆＃34;没有显示，因为它停留在图像下方。 另外，这是实现它的好方法吗？ （SEO等等）

请你详细介绍一下吗？

谢谢！

Answer 1

您可以在选择器后尝试使用css：

.logoImage:after { content:attr(alt);}