Sagrana

В примере несколько вещей не очень:
1. Пустой тег header. Т.е. незаполненный классом.
2. Как в принципе верно подметил g33km нормой считается вкладывать в тег списка, потому что многоуровневую навигацию так проще оформлять за счет прослоек.
3. Но наличие пустых тегов тоже идет вразрез БЭМ-у, так как для вложенных элементов должны быть классы, которые позволяют ими управлять. Инкапсуляция классами предполагает отстраненность от тегов, хотя и и приходится на всякий случай (а для списком в обязательном порядке) обнулять отступы и т.д.
4. То, о чем говорит в своем ответе g33km:

Если данная навигация будет использоваться в разных местах в одном и том же виде, то ей не нужен класс .content-header__nav

глупость, так как это обыкновенный микс. Он нужен для того, чтобы определить местоположение блока навигации в блоке шапки.

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

<header class="content-header">
    <a 
        href="/"
        class="content-header__logo logo">
        <img 
            src="/img/logo.svg" 
            class="logo__image"
            alt="">
    </a>
    <nav class="content-header__nav nav">
        <ul class="nav__list nav__list--inline">
            <li class="nav__item"><a href="" class="nav__link"></a></li>
            <li class="nav__item"><a href="" class="nav__link"></a></li>
            <li class="nav__item"><a href="" class="nav__link"></a></li>
            <li class="nav__item"><a href="" class="nav__link"></a></li>
        </ul>
    </nav>
</header>

...

<footer class="footer">
    <nav class="footer__nav nav">
        <ul class="nav__list nav__list--column">
            <li class="nav__item"><a href="" class="nav__link"></a></li>
            <li class="nav__item"><a href="" class="nav__link"></a></li>
            <li class="nav__item"><a href="" class="nav__link"></a></li>
            <li class="nav__item"><a href="" class="nav__link"></a></li>
        </ul>
    </nav>
</footer>

Подвал я указал для образца, как этот блок может быть использован «ниже на странице».

По логике базовый стиль должен обнулять нативные отступы, формировать базовые потребности (можно добавить еще и nav--white, чтобы покрасить в шапке в белый цвет, а в подвале нет (базовым цветом может быть черный у ссылок).

Ну и в принципе чуть больше можно почитать в моей новоявленной документации. Только вчера закинул в интернеты, дорабатываю и буду рад любым вопросам по этой теме. Контакты есть в профиле, врядли отвечу, но самые интересные образцы скорее всего пойдут на доброе дело.

$('input[type=radio]').on('change', function() {
    $(this).closest("form").submit();
});

Если я правильно понимаю задачу, то можно так:

Все довольно просто.

Есть ICANN - Internet Corporation for Assigned Names and Numbers - Корпорация по управлению доменными именами и IP-адресами. Она управляет доменной зоной "." ("точка"), то есть всем пространством имен Интернет.
В ICANN можно купить право создания и управления TLD (Top Level Domain - домен верхнего уровня). Почему я так подчеркнул слово "купить"? Потому что полученное будет иметь все свойства товара - с ним можно делать все, что угодно, в частности устанавливать любые, какие только вздумается правила регистрации имен в данной зоне.
Несмотря на то, что купить можно не все TLD - часть зарезервирована под географические зоны, некоторые "хорошие" геозоны все равно можно использовать - кого, например, заинтересует мнение каких-то там Кокосовых Островов (.cc) или Тувалу (.tv)?
Владелец зоны создает контору по технической регистрации имен. Технический регистратор - один. И именно он вносит изменения в базу. Заявки от конечных клиентов он обычно не принимает, продавая право на это другим конторам, их обычно тоже называют регистраторами, что создает преизрядную путаницу. На самом деле ничего они не регистрируют, они только подают заявки настоящему регистратору.
Конечные регистраторы продают аренду доменного имени. Это важно. Вы не ПОКУПАЕТЕ имя (то есть оно не имеет свойств товара - Вы не можете его продать, обменять, подарить), Вы его АРЕНДУЕТЕ. Именно поэтому регистратор всегда может этот договор расторгнуть, если посчитает нужным.
А условия договора аренды - целиком и полностью определяет регистратор, он тут ничем не ограничен. Он обязан платить некую сумму "настоящему" регистратору, а все что намутил - оставляет себе. Примерно, как таксист-частник, работающий под маркой таксопарка :)
Обычно, когда говорят про домены, подразумевают, что все помнят, что домен купить нельзя, речь идет про аренду и специально этот факт не упоминают.
Цена регистрации, цена продления и то, почему домен gabbagabbahey.cc будет стоить существенно меньше чем sex.com - определяется исключительно коньюнктурой рынка. На самом деле и то имя и другое не стоит ничего,, и если бы вдруг все люди перестали трахаться и стали фанатами игры Descent - соотношение бы изменилось :)
Вы и сами можете стать регистратором и гнуть какие хотите цены. Заключаете договор с "настоящим" регистратором - и вперед.
Иногда спрашивают - как завести свою зону. Обычному человеку как правило - никак. На хабре есть статья, как Яндекс заводил TLD .yandex - это им обошлось примерно в $200000 и год переписки с ICANN.

Вот так на SVG

Второй вариант на SVG pattern

https://developer.mozilla.org/ru/docs/Web/CSS/attr

Вот буквально вчера делал с помощью js.
Алгоритм простой:
1. Взять цвет фона
2. Перевести hex в hsl
3. Если l в hsl выше 0.8 (то есть, фон яркий), берем из hsl параметр hue (оттенок), берем насыщенность 100% и яркость 10%, и конвертируем новый темный оттенок обратно в hex
4. Применяем этот hex к тексту

Таким образом мы имеем либо белый текст на темном фоне (по-умолчанию), либо темный текст, слегка подкрашенный в оттенок фона, на светлом фоне. Почему подкрашенный? Потому что чистый черный на условно светло-розовом будет смотреться плохо. А вот слегка розоватый — отлично.

Три лучших сервиса:
Codepen
Html book
Css tricks
А так, есть Google, Yandex, Jquery docs, Getbootstrap, PCvector, E-proger и прочие, прочие, прочие...

Lets d̶a̶n̶c̶e dense.

$(document).on('click', 'a[class^="id"]', function(e) {
    e.preventDefault();
    console.log(e.target);
    console.log(this);
    alert('Вы кликнули по ссылке с классом ' + this.className);
});

В e.target и this - элемент, по которому кликнули.
Делегирование поможет поймать клик на динамически создаваемых элементах