Рецепты CSS
Вёрстка
- Как выровнять слой по центру веб-страницы?
- Как зафиксировать слой, чтобы он оставался на одном месте при прокрутке страницы?
- Как разместить два слоя с заданной шириной рядом по горизонтали?
- Как сделать слой полупрозрачным?
- Как убрать полосы прокрутки?
- Почему max-width не работает для таблицы?
Изображения
Добавление картинок
- Как добавить картинку на веб-страницу?
- Почему изображение не показывается на сайте?
- Почему изображения на странице видны только на моем компьютере и не отображаются на другом?
- Установил путь к рисунку как /images/pic.gif, но рисунок не отображается на веб-странице. Почему?
Рамка вокруг изображений
- Как добавить рамку к изображению?
- Как изменить цвет рамки вокруг изображения-ссылки?
- Как сделать паспарту?
- Как сделать, чтобы цвет рамки вокруг изображения-ссылки менялся при наведении на него курсора мыши?
- Как убрать рамку вокруг изображений-ссылок?
Альтернативный текст и всплывающая подсказка
- Для чего нужен альтернативный текст?
- Добавил к рисунку альтернативный текст, но его не видно в браузере. Почему?
- Как добавить всплывающую подсказку к изображению?
- Можно ли изменить вид всплывающей подсказки?
Форматирование изображений
- Как выровнять фотографию по центру веб-страницы?
- Как добавить подпись под фотографией?
- Как разместить несколько картинок рядом по горизонтали?
- Как разместить слитно два изображения друг под другом?
- Как сделать изображение на всю ширину окна браузера?
- Как сделать обтекание картинки текстом?
- Как сделать, чтобы фотография располагалась по правому краю окна браузера?
Эффекты с изображениями
- Как заменить текст изображением?
- Как отразить изображение?
- Как сделать, чтобы картинка менялась при наведении на нее курсора мыши?
- Как установить изображение полупрозрачным?
Линии и рамки
- Как добавить линию возле текста?
- Как добавить рамку вокруг кнопки?
- Как сделать горизонтальную пунктирную линию с рисунком?
- Как сделать цветную горизонтальную линию?
Отступы и поля
- Как изменить отступы на веб-странице?
- Как изменить расстояние между абзацами текста?
- Как мне для каждого абзаца добавить отступ первой строки?
- Как убрать отступы вокруг формы?
- Как убрать отступы и поля у всех элементов на странице?
- Между заголовком и основным текстом слишком большой отступ, как его уменьшить?
Сайт
Скруглённые уголки
- Как выделить строку с помощью блока с закруглениями?
- Как добавить скругленные уголки у фотографии фиксированного размера?
- Как сделать блок со скругленными уголками без рисунков?
- Как сделать блок со скруглёнными уголками через CSS3?
- Как сделать круглые изображения?
- Как сделать рамку со скругленными уголками?
- Как создать рамку со скругленными уголками без изображений?
Списки
- Как изменить цвет текста в списке?
- Как разместить элементы списка горизонтально?
- Как сделать вложенный список?
- Как сделать горизонтальное меню с наклоном?
- Как убрать отступ сверху и снизу от списка?
Маркированный список
- Как вместо символа маркера использовать картинку?
- Как изменить отступ слева от маркеров списка?
- Как сделать, чтобы цвет маркеров в списке отличался от цвета текста?
- Как убрать маркеры в маркированном списке?
- Как увеличить расстояние от маркера до текста?
- Хочу изменить вид маркера на другой символ. Как это сделать?
Нумерованный список
- Как в списке вывести римские числа?
- Как изменить вид написания чисел в списке и сделать, чтобы после каждого номера шла круглая скобка?
- Как изменить стиль чисел в списке?
- Как сделать нумерацию с определенного числа через стили?
- Как сделать, чтобы нумерованный список начинался с определенного числа?
Список определений
Ссылки
- Как добавить пунктирное подчеркивание к ссылкам?
- Как добавить рисунок к внешним ссылкам?
- Как заголовок сделать ссылкой?
- Как изменить вид ссылки при наведении на нее курсора мыши?
- Как изменить цвет ссылки и фона под ней?
- Как на странице сделать ссылки разных цветов?
- Как открыть ссылку в новом окне?
- Как плавно изменить цвет ссылки?
- Как с помощью стилей выделить ссылки, которые ссылаются на другой сайт?
- Как сделать, чтобы слой целиком был ссылкой?
- Как убрать подчеркивание у ссылок?
- Как убрать пунктирную рамку вокруг ссылок?
- Как установить цвет посещённой ссылки?
Таблицы
- Как выделить другим цветом первую строку таблицы?
- Как выровнять содержимое ячеек таблицы по верхнему краю?
- Как выровнять таблицу по центру окна браузера?
- Как сделать, чтобы строка таблицы меняла цвет при наведении на нее курсора мыши?
- Как создать таблицу в HTML5 и указать её параметры через стили?
- Как установить таблицу полупрозрачной, а часть ячеек нет?
- Как установить ширину таблицы через стили?
- Каким стилевым свойством заменить атрибут cellpadding тега <table>?
- Каким стилевым свойством заменить атрибут cellspacing тега <table>?
Текст
- Как выровнять текст одновременно по правому и левому краю?
- Как выровнять текст по центру?
- Как добавить вокруг текста рамку определенного цвета?
- Как добавить подчеркивание к заголовку?
- Как изменить расстояние между строками текста?
- Как мне обойтись без тега <font>
- Как отобразить теги на веб-странице?
- Как разместить два слова на одной строке, чтобы одно выравнивалось по левому краю, а второе по правому?
- Как сделать пунктирное подчеркивание текста?
Фоновая картинка
- Как добавить два фона к одному элементу через CSS3?
- Как добавить два фоновых изображения к одному элементу?
- Как добавить две фоновые картинки на веб-страницу?
- Как добавить фоновый рисунок на веб-страницу?
- Как поместить фоновый рисунок в правый нижний угол страницы?
- Как растянуть фон на всю ширину окна?
- Как сделать, чтобы фон не повторялся?
- Как сделать, чтобы фон повторялся только по вертикали?
- Можно ли сделать анимированный фон?
Формы
- Как запретить изменение размеров <textarea>?
- Как изменить вид тега <optgroup> через стили?
- Как изменить цвет кнопки в форме?
- Как изменить цвет текста и фона в текстовом поле?
- Как к кнопке добавить градиентную заливку?
- Как сделать кнопку внутри поля для поиска?
- Как сделать свою кнопку для отправки формы?
- Как сделать, чтобы в текстовом поле заранее выводился определенный текст?
- Как сделать, чтобы текстовое поле при получении фокуса меняло цвет рамки?
- Как убрать свечение вокруг текстового поля в Safari?
- Как установить ширину текстового поля в пикселах?
- Как установить ширину поля со списком?
Цвет
- Как выделить другим цветом фрагмент текста?
- Как добавить цвет фона к заголовку текста?
- Как изменить цвет фона и текста веб-страницы?
- Как с помощью стилей задать цвет линии, созданной с помощью тега <hr>
- Хочу изменить цвет первой буквы в каждом абзаце. Что мне для этого надо сделать?
- Что означает запись #fc0?
Не выкладывайте свой код напрямую в комментариях, он отображается некорректно. Воспользуйтесь сервисом cssdeck.com или jsfiddle.net, сохраните код и в комментариях дайте на него ссылку. Так и результат сразу увидят.