Как сократить использование CSS-идентификаторов и классов при разметке с использованием HTML5 и CSS3?

Question

Как сократить использование CSS-идентификаторов и классов при разметке с использованием HTML5 и CSS3?

Какие теги HTML5 и свойства CSS3 могут снизить потребность в классах и идентификаторах

В настоящее время язнать

       <header>
        <nav>
        <section>
        <article>
        <aside>
        <footer>
    <time>
    <figure>
    <dialog>
    <mark>
<figcaption>
<hgroup>

Answer 1

То, как эти ссылочные соседи могут рассматриваться с использованием меньшего количества идентификаторов и тегов html 5 с двоеточиями.Это из видео Mix 11.

Всплывающее меню CSS:

.menu > li > ul {display: none;}
.menu > li:hover > ul { display:block;}

Зависимый контент:

.faq > div {display:none;}
.faq > div:target {display:block;}

Проверка:

:valid, :invalid, :required, :optional, :in-range, :out-of-range, 
:read-only, :read-write

#signup input:focus:required:valid + .val .invalid {display:none;}
#signup input:focus:required:invalid + .val .valid {display:none;}

Анимации:

.faq > div {display:none;}
.faq > div:target {display:block;position:relative;
       -webkit-animation:throb 1.5s infinite;}

Answer 2

Псевдоклассы могут делать это, например, :first-child и :last-child, последний из которых является новым в CSS3.

Вам лучше иметь посмотрите здесь .