Блог

Главная - Вопросы по программированию - css / html как сделать так, чтобы логотип отображался после заголовка

css / html как сделать так, чтобы логотип отображался после заголовка

#html #css

#HTML #css

Вопрос:

Я хочу добавить логотип в заголовок после заголовка. Прямо сейчас изображение логотипа находится под заголовком. У меня также есть навигация в заголовке.

Это мой CSS-код, связанный с заголовком и логотипом.

 #header {
    width: 1000px;
    height: 100px;
    background: #33CCFF;
}

#logo {
    display: inline;
    width: 71px;
    height: 46px;
    background-image: url(resources/images/logo.jpg);
    background-repeat: no-repeat;
}

html-файл

 <html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Insert title here</title>
</head>
<body>
<div id="header"> 

<div id="logo">
  <h1>iSHOP</h1>
    <img  src="resources/images/logo.jpg" width="71" height="46" />
         </div></div> 



</body>
</html>

Комментарии:

1. CSS не помогает, если у нас нет HTML или изображения для перехода: мы не можем читать ваши мысли.

2. я сопоставил его с html. вам нужен HTML-файл?

3. Поскольку вы отметили этот вопрос с помощью HTML, это, безусловно, было бы полезно.

4. Или вы могли бы JSFiddle это: D

5. @Aibrean Хотя JS Fiddle, безусловно, полезен, обратите внимание, что код все равно следует размещать вместе с вопросом, чтобы избежать таких проблем, как гниение ссылок, блокирующих просмотр кода людьми.

Ответ №1:

Просто измените свой CSS, чтобы он указывал на тег h1. Вот СКРИПКА

 #logo h1 {
   //styles here
}

Вы указывали на контейнер h1, поэтому он все еще отображался как элемент уровня блока