Самоучитель по программированию на HTML и CSS – написание красивых сайтов
Сайты для генерации верстки HTML/CSS, которые ускоряют разработку адаптивных интерфейсов
Источник: Nuances of Programming В подборке рассмотрим несколько очень полезных для разработки сайтов. Скорее всего, некоторые из них вы будете применять почти ежедневно. Содержание: Вёрстка CSS Один из абсолютных фаворитов подборки — сайт Caniuse.com. Он бесценен при поиске информации о том, поддерживает ли какой-либо браузер CSS-код. Генераторы для создания box shadow, flex code и треугольников при помощи исключительно свойств CSS: Данные онлайн-инструменты регулярно экономят много времени: вы сможете сначала поиграть с кодом, а затем просто скопировать и вставить его в свой проект...
Пример кода сайта одностранички на HTML
<!DOCTYPE html>
<html>
<head>
<title>Мой сайт</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="style.css">
</head>
<body>
<header>
<h1>Добро пожаловать на мой сайт!</h1>
<nav>
<ul>
<li><a href="#about">О сайте</a></li>
<li><a href="#services">Услуги</a></li>
<li><a href="#portfolio">Портфолио</a></li>
<li><a href="#contact">Контакты</a></li>
</ul>
</nav>
</header>
<main>
...