Jump to content
  • 0

Как вернее использовать логотип?


Маленьке Звірятко
 Share

Question

6 answers to this question

Recommended Posts

  • 0

Я имею ввиду, что можно двумя способами:

1


<a href="#"><img src="logo.png"></a>

2


<a href="#">logo text</a>

и CSS:


a {
background-image: url(logo.png) no-repeat;

display: block;
width: 200px;
height: 50px;
}

а logo text прячут через

text-indent

или другими способами.

Вот и интересуюсь... )) Хотя, вроде нашел ответ на свой вопрос: http://stackoverflow.com/questions/492809/when-to-use-img-vs-css-background-image

Link to comment
Share on other sites

  • 0

С одной стороны <img> легче заменять — необязательно указывать размеры элемента и картинка сохраняется по умолчанию при печати и адаптации страницы некоторыми мобильными браузерами; с другой стороны это часть общего дизайна сайта, поэтому надо использовать background. Именно поэтому спорить можно долго))

Edited by Vin
Link to comment
Share on other sites

  • 0

В тег img можно alt заполнить, что немало важно для SEO +, как заметил Vin, легкая адаптация к мобильным браузерам.

На вкус и цвет, как говорится...

...или каждый д**чит, как он хочет...

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Answer this question...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

 Share

  • Similar Content

    • By Hinn
      Всем приветик, начинающий фрилансер. Ищу первые заказы в данной сфере. Занимаюсь:
      • На малом уровне версткой;
      • Хорошо разбираюсь в таких CMS: как Wordpress и Tilta - легко и быстро разработаю одно страничные, многостраничные сайты, интернет-магазины (могу как дорабатывать, так и создания с нуля, так же занимаюсь переносом одного сервера на другой);
      • Увлекаюсь разработкой логотипов (логотипы с нуля, доработка логотипа, рисование логотипа по эскизу).
      Готов заниматься работой за любую плату. Так же присутствует портфолио, но за частую людям интересно когда о тебе есть отзывы. Поэтому пришел сюда за практическим опытом, и поиском постоянной работы.
      Использую:
      - Верстка: (HTML5/CSS3), верстаю из Figma, Photoshop, illustrator.
      - Разработка сайта: (CMS WordPress, Tilta).
      - Разработка логотипа: (Photoshop, illustrator)
      Если не знаю чего-то необходимого для Вашего проекта\работы -- обязательно разберусь (все-таки начинающий фрилансер).

      Если вы разработчик и вам некому спихнуть рутинную работу - я с радостью возьму её на себя;

      телеграмм: HinnWork;
      почта: balistic.baty@gmail.com

      Открыт для любых предложений. 
    • By Dallas
      Добрый день всем! Вот на сайте http://www.netdreams.co.uk/ при уменьшении окна браузера логотип не куда не скатывается, остаётся на своём же месте. Проще говоря он прикреплен^^
      У меня же при изменении чего либо, он двигается в месте с этими-же изменениями а должен прилепиться в указанном месте=)) Вот мой код:


      <style>
      .logo_img {
      float: left;
      position: absolute;
      margin-left: 130px;
      margin-top: 14px;
      }
      </style><div class="logo_img">
      <img src="{THEME}/images/logo.png" alt="Логотип сайта Warcraft 3 Cheats">
      </div>

      Подскажите что исправить нужно, чтоб логотип прикрепился в указанном месте.
  • Обсуждения

    • Вот тут есть актуальный список бесплатных тестов с сертификацией https://www.classcentral.com/report/free-certificates/ Обратите внимание на HackerRank, там есть тест с сертификацией непосредственно по CSS
    • Нужно сверстать по картинке меню-бар. Не получается сделать вот это поле поиска <!DOCTYPE html> <html lang="en"> <head>     <meta charset="UTF-8">     <meta http-equiv="X-UA-Compatible" content="IE=edge">     <meta name="viewport" content="width=device-width, initial-scale=1.0">     <title>Document</title>     <style> .nav {     display: flex;     list-style-type: none;     padding-left: 0;     font-size: 17px;     text-transform: uppercase; } .nav > li > a {     color: #fff;     text-decoration: none; } .nav > li {     padding-left: 29px;     margin-left: 30px; } .header {     display: flex;     background-color: #31485b;     justify-content: space-between;     align-items: center; }   .sidebar {     width: 410px;     display: block;     padding-right: 20px;     margin: auto;     margin-left: 250px; }   ul.nav li a:hover {     background-color: #687c8d;     padding: 17.2px 35px; }   input[type="text"], input[type="search"] {   background-color: #687c8d;   width: 60%;   padding: 8px;   margin: 0 50px }   input[type="search"] {     color: #31485b;     font-style: italic; }     </style> </head> <body>     <div class="header">                 <ul class="nav">                     <li class="s1"><a href="#">Главная</a></li>                     <li><a href="#">Блог</a></li>                     <li><a href="#">Сервисы</a></li>                     <li><a href="#">Онлайн-профессии</a></li>                     <li><a href="#">О сайте</a></li>                 </ul>                                 <div class="sidebar">                     <form method="post" action="#" id="search_form" >                       <input type="search" name="search_field" placeholder="Поиск" />                     </form>                   </div>     </div> </body> </html>  
    • ЭЭ, а почему оно должно удалять? Может стоило повесить событие на эту кнопку и указать, что при это должно происходить?
    • например -R не будет качать указанные файлы если вы знаете список нужных вам файлов, проще их указать или можно написать парсер
    • выкладывайте код в песочнице, так будет проще У вас media подключается до blocks/header, по этому правила из blocks/header перекрывают media сверху вниз в css пишите tag .class ... @media и не будет у вас подобных проблем  
×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue. See more about our Guidelines and Privacy Policy