Используя CSS вместо изображения для логотипа, как мне ...? - PullRequest
Новая
       3

Используя CSS вместо изображения для логотипа, как мне ...?

1 голос
/ 05 августа 2010

альтернативный текст http://i37.tinypic.com/a5et6f.png

Хорошо, поэтому выше приведено изображение почти того, что я пытаюсь сделать.Вы видите, как логотип имеет сплошной фон за ним, который достигает ОЧЕНЬ верхней части страницы (так что сверху нет белого) ... вот что я пытаюсь сделать.

Это мойhtml для этой части: 

<body>
<div id="wrapper">
  <div id="divider">
  <h1>NAME / SLOGAN</h1>
  <ul class="underlinemenu">
    <li><a href="#">HOME</a></li> 
    <li><a href="#">ABOUT</a></li>
    <li><a href="#">SUBSCRIBE</a></li>
    <li><a href="#">FAQ</a></li>
    <li><a href="#">CONTACT</a></li>
    <li><a href="#">LOGIN</a></li>
  </ul>
  </div> <!-- end divider -->

Я почти уверен, что мог бы просто добавить изображение и разместить его там для обертки, чтобы мой логотип <h1> был поверх него, но я думаю, что это будетдовольно неэффективно.

Я имею в виду, что есть только два сплошных цвета, черный и белый ... так что же нельзя сделать с помощью CSS?

Когда я попытался это сделать, я закончил"блок" ... не то, что я хотел.На самом верху еще было белое.Я хочу, чтобы это было больше похоже на, скажем, кто-то вырезал кусок бумаги (где черный), если это имеет смысл.

Ответы [ 4 ]

3 голосов
/ 05 августа 2010

Вы должны убедиться, что у вас нет никаких отступов в теле: 

body { padding: 0; }

Это гарантирует, что ваш контент переместится до самого верха окна.

1 голос
/ 05 августа 2010

Произведен глобальный сброс пробелов: 

* {
    margin: 0;
    padding: 0;
}

По умолчанию поля и отступы удалены, и у вас нет лишних пробелов.Единственное, о чем нужно знать: вы должны стилизовать каждый пробел на вашем сайте (например, для списков, заголовков, ...).

1 голос
/ 05 августа 2010

Прежде всего, проверьте, есть ли поля или отступы для h1, #divider, #wrapper или body. Если это так, установите его в 0px.

Логотип можно сделать с помощью div с заданными свойствами ширины / высоты и фонового изображения.

0 голосов
/ 06 августа 2010

Вместо использования <h1>LOGO</h1> для вашего логотипа, как насчет использования <span class="logo">LOGO</span>

и размещения его в вашем файле CSS? 

.logo {
margin:0;
padding:0;
background:black;
color:white;
font-size:2em; }

Вы можете добавить ширину, высоту идисплей: тоже встроенный блок, если вы хотите настроить размер поля логотипа

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...