CSS / HTML - Div или нет? (Лучшая практика)

0

Я создаю веб-сайт и пытаюсь применить большую часть HTML5/CSS3, и у меня возник вопрос.

Итак, у меня был следующий CSS...

section.t aside div.bio{
    float: left;
    margin-top: 12px;
}

section.t aside div.bio p{
    color: #555;
    line-height: 18px;
}

И HTML...

<aside>
    <h1>Title</h1>
    <ul>
        <li><a href="#">###</a></li>
    </ul>
    <div class="bio">
        <p>Text</p>
    </div>
</aside>

Затем я изменил CSS на...

section.t aside p.bio{
    float: left;
    margin-top: 12px;
    color: #555;
    line-height: 18px;
}

Таким образом, последняя часть HTML упрощена...

<aside>
    <h1>Title</h1>
    <ul>
        <li><a href="#">###</a></li>
    </ul>
    <p class="bio">Bio</p>
</aside>

В принципе, я сбросил div, завернув p, и давал p стиль. Результат точно такой же.

Мой вопрос в том, есть ли какое-либо преимущество обертывания вещей внутри div, как в первом случае? или нет?

Я действительно понял, что весь мой сайт почти без тегов Div. Это какое-то следствие для этого? это либо плохая практика, либо вызывают какие-либо проблемы с seo?

  • 0
    Я так не думаю, div имеет специфическое семантическое значение и не должен использоваться только для стиля по умолчанию. Афаик твой тэг в стороне обрабатывает что
Теги:

2 ответа

3
Лучший ответ

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

Когда нет другого нового тега, который определяет контент, который вы используете, тогда <div> - путь.

Поделиться
  • 0
    Да, в некоторых случаях мне нужно обернуть какой-то код. Так что ... в этом конкретном случае я ничего не выиграю от того, что div оборачивает p, так как p может иметь тот же самый результат?
  • 1
    @ user2840318 Правильно. Если вы хотите добавить еще один <p> после `<p class =" bio "> и стилизовать их вместе, было бы лучше добавить контейнер div, поскольку это лучше объясняет семантически, как вы хотите, чтобы ваш контент был сгруппирован, и во многих случаях потребуется меньше CSS для достижения.
Показать ещё 1 комментарий
1

Если нет необходимости в div то абсолютно удалите его. Нет смысла загромождать вашу разметку только ради этого.

Мой рабочий процесс, когда дело доходит до написания HTML, заключается в том, чтобы сначала записать его в качестве документа. Поэтому добавьте только семантическую разметку, необходимую для правильного чтения документа.

Затем, когда дело доходит до стилизации документа, если мне нужно использовать такие элементы, как div или span для презентационных целей, тогда я буду, потому что это то, для чего они предназначены.

Поделиться
  • 1
    «сначала напишите это как документ» -> это хороший рабочий процесс, и я бы хотел, чтобы больше людей практиковали это!

Ещё вопросы

Сообщество Overcoder
Наверх
Меню