Самоучитель по HTML, CSS, XML, Javascript
Создание сайта требует определенных знаний. Источником знаний всегда были книги. Однако в определенный момент сюда добавилась еще одна чрезвычайно обширная база данных – сеть Интернет. Данный сайт собирает в одном месте информацию, которая необходима или может оказаться интересной начинающему вебмастеру. Это своего рода самоучитель и справочник по тем или иным интернет-технологиям - HTML, CSS, XML, JavaScript, jQuery и др.
Пример HTML:
<!DOCTYPE html>
<html>
<title>Учебник HTML</title>
<body>
<h1>Это заголовок</h1>
<p>Это параграф или абзац.</p>
</body>
</html>
Пример CSS:
body {
background-color: lightblue;
}
h1 {
color: white;
text-align: center;
}
p {
font-family: verdana;
font-size: 20px;
}
Пример XML:
<?xml version="1.0" encoding="UTF-8"?>
<note>
<to>Tove</to>
<from>Jani</from>
<heading>Напоминание</heading>
<body>Не забудь обо мне в эти выходные!</body>
</note>
Разрешите представиться, Каскадные слои CSS
Чтобы преодолеть проблемы с каскадом и специфичностью, нам нужно быть осторожными с тем, где писать конкретный блок кода CSS. В этой статье мы рассмотрим, как работают каскадные слои, и как они помогут нам писать код CSS с большей уверенностью, что он будет работать так, как нам нужно
Что такое медиаобъект? Еще один кирпичик вашего сайта
Из чего состоит интернет? По крайней мере, уровень пользовательского интерфейса в основном состоит из медиаблоков. Обычно, это изображение, расположенное слева, и какой-нибудь описательный текст справа от него
Секрет эффективного CSS? Соблюдайте модульность!
Включение CSS и HTML в абстракции, обрабатываемые на сервере, в конечном итоге ведет к значительному раздуванию кода, потому что CSS и HTML требуют гораздо более модульной структуры объектов, чем, например, PHP
Как структурировать CSS? Разбираемся в синтаксисе БЭМ
БЭМ (Блок, Элемент, Модификатор) - это методология именования селекторов CSS, придуманная ребятами из Яндекса. Это разумный способ присвоения имен вашим CSS классам, чтобы придать им больше прозрачности и смысла для других разработчиков
Как структурировать CSS? Знакомьтесь - BEM
На небольших сайтах обычно не имеет особого значения то, как вы организуете свои стили. Однако, когда дело доходит до более крупных и сложных проектов, тогда то, как вы организуете свой код, является ключом к эффективности по крайней мере в трех аспектах...
Тестирование кода HTML при помощи CSS
Мы поговорим о том, можно ли тестировать HTML при помощи возможностей CSS (тестирование целостности HTML с использованием CSS-селекторов) без использования JavaScript, и что могут предложить последние новшества самого CSS
Каскад и специфичность в CSS - это просто
Каскад и специфичность часто воспринимаются как что-то сложное и запутанное. И в самом деле, если вы не учитываете их в своем коде CSS, это очень быстро приведет к проблемам. Но если у вас есть хотя бы базовые знания в этом вопросе, все становится довольно просто
Эффект размытия вместо тени на CSS
Черпая вдохновение в тенях, автор статьи Яир Эвен Ор (Yair Even Or) создает нечто подобное, только с эффектом размытия вместо тени. В этой статье вы получите пошаговое объяснение того, как это делается с помощью комбинации масок, градиентов и старого доброго свойства backdrop-filter
Как анимировать контур при помощи CSS
Загрузчики и индикаторы прогресса являются одними из широко используемых примеров в учебниках по CSS. Существует множество способов их реализации. В этой статье будет показан подход, использующий анимированные пользовательские свойства, конический градиент, CSS свойство offset и эмодзи
Раздел "Как сделать"
Оригинальное изображение
Черно-белое изображение
