1 Тема від serhi11 Востаннє редагувалося serhi11 (20.09.2015 16:43:58)

  • serhi11
  • serhi11
  • Користувач
  • Поза форумом
  • Дата реєстрації: 25.06.2012
  • Повідомлень: 89
    • Репутація: 10

Тема: Верстка заголовка

Як зверстати такий заголовок

Post's attachments

heading.jpg 19.25 kb, 258 downloads since 2015-09-20 

2 Відповідь від Key

  • Key
  • Key
  • Користувач
  • Поза форумом
  • Звідки: Lviv
  • Дата реєстрації: 27.12.2013
  • Повідомлень: 125
    • Репутація: 85

Re: Верстка заголовка

Руками)

3 Відповідь від Nick9956

  • Nick9956
  • Користувач
  • Поза форумом
  • Дата реєстрації: 05.03.2015
  • Повідомлень: 297
    • Репутація: 56

Re: Верстка заголовка

serhi11 написав:

Як зверстати такий заголовок

Як зробив би так, за допомогою h1  написав би "Актуальні пропозиції", потім додав малюнок(лінію), задав заголовку обтіканню зліва (float:left), малюнку додав би обіткання зліва і додав би текст "Подивитися всі обєкти"

4 Відповідь від Nick9956

  • Nick9956
  • Користувач
  • Поза форумом
  • Дата реєстрації: 05.03.2015
  • Повідомлень: 297
    • Репутація: 56

Re: Верстка заголовка

Ну а найкраший спосіб, просто намалювати це все в пейнті, і за допомогою тега <img> додати в html розмітку

5 Відповідь від fanatp

  • fanatp
  • fanatp
  • Користувач
  • Поза форумом
  • Звідки: Рогатин
  • Дата реєстрації: 27.12.2015
  • Повідомлень: 36
    • Репутація: 6

Re: Верстка заголовка

не обов'язково малювати можна використати тег <hr> ,і відповідно вирівняти ...

6 Відповідь від fanatp

  • fanatp
  • fanatp
  • Користувач
  • Поза форумом
  • Звідки: Рогатин
  • Дата реєстрації: 27.12.2015
  • Повідомлень: 36
    • Репутація: 6

Re: Верстка заголовка

або задати прямокутник і вказати тільки нижню границю... припустимо так 

html
--------------------------------------
<div class="title"><h3>Актуальні пропозиції</h3><div class="bottom_line"></div><h5>Переглянути всі об'єкти</h5></div>
--------------------------------------
css
--------------------------------------
h3 {color:green;}
h5 {color:green;}
.bottom_line {height:15px;width:50px;background:none;border-bottom:1px solid green;}
--------------------------------------
Зауваження
--------------------------------------
можна не використовувати теги "Н" а писати в "div" з відповідним класом ,та до класу прописати в стилях font-size:--;(можна вказати величину літер в "em" -> 1.2em;)