Меню
Наши новости
Учебник CSS

Невозможно отучить людей изучать самые ненужные предметы.

Введение в CSS
Преимущества стилей
Добавления стилей
Типы носителей
Базовый синтаксис
Значения стилевых свойств
Селекторы тегов
Классы
CSS3

Надо знать обо всем понемножку, но все о немногом.

Идентификаторы
Контекстные селекторы
Соседние селекторы
Дочерние селекторы
Селекторы атрибутов
Универсальный селектор
Псевдоклассы
Псевдоэлементы

Кто умеет, тот делает. Кто не умеет, тот учит. Кто не умеет учить - становится деканом. (Т. Мартин)

Группирование
Наследование
Каскадирование
Валидация
Идентификаторы и классы
Написание эффективного кода

Самоучитель CSS

Вёрстка
Изображения
Текст
Цвет
Линии и рамки
Углы
Списки
Ссылки
Дизайны сайтов
Формы
Таблицы
CSS3
HTML5

Новости

Блог для вебмастеров
Новости мира Интернет
Сайтостроение
Ремонт и советы
Все новости

Справочник CSS

Справочник от А до Я
HTML, CSS, JavaScript

Афоризмы

Афоризмы о учёбе
Статьи об афоризмах
Все Афоризмы

Видео Уроки


  B
background
background-attachment
background-clip
background-color
background-image
background-origin
background-position
background-repeat
background-size
border
border-bottom
-----------------
border-bottom-color
border-bottom-left-radius
border-bottom-right-radius
border-bottom-style
border-bottom-width
border-collapse
border-color
border-image
border-left
-----------------
border-left-color
border-left-style
border-left-width
border-radius
border-right
border-right-color
border-right-style
border-right-width
border-spacing
border-style
---------------
border-top
border-top-color
border-top-left-radius
border-top-right-radius
border-top-style
border-top-width
border-width
bottom
box-shadow
box-sizing
---------------
 C
caption-side
clear
clip
color
---------------
column-count
column-gap
column-rule
column-width
---------------
columns
content
counter-increment

---------------
counter-reset
cursor

---------------
 D
direction
display
---------------
 E
empty-cells

---------------
 H
height

---------------
 Q
quotes

---------------
 F
float
font
font-family
font-size
font-stretch
font-style
font-variant
font-weight

---------------
 L
left
letter-spacing
line-height
list-style
list-style-image
list-style-position
list-style-type

---------------
 M
margin
margin-bottom
margin-left
margin-right
margin-top
max-height
max-width
min-height
min-width

---------------
 O
opacity
orphans
outline
outline-color
outline-offset
outline-style
outline-width
overflow
overflow-x
overflow-y
---------------
 P
padding
padding-bottom
padding-left
padding-right
padding-top
page-break-after
page-break-before
page-break-inside
position

---------------
 W
white-space
widows
width
word-break
word-spacing
word-wrap
writing-mode

---------------
 T
tab-size
table-layout
text-align
text-align-last
text-decoration
text-decoration-color
text-decoration-line
text-decoration-style
text-indent
text-overflow

---------------
text-shadow
text-transform
top
transform
transform-origin
transition
transition-delay
transition-duration
transition-property
transition-timing-function
---------------
 R
resize
right
---------------
 U
unicode-bidi

---------------
 V
vertical-align
visibility
---------------
 Z
z-index

---------------

Interner Explorer

-ms-interpolation-mode

-ms-radial-gradient
background-position-x
background-position-y

---------------
filter

hasLayout
scrollbar-3dlight-color
scrollbar-arrow-color
scrollbar-base-color

scrollbar-darkshadow-color
scrollbar-face-color
scrollbar-highlight-color
scrollbar-shadow-color
scrollbar-track-color
zoom
---------------
Firefox

-moz-border-bottom-colors
-moz-border-left-colors
-moz-border-right-colors
-moz-border-top-colors
-moz-linear-gradient
-moz-orient
-moz-radial-gradient
-moz-user-select
:-moz-placeholder
::-moz-selection
image-rendering
---------------
Opera

-o-linear-gradient
-o-object-fit
-o-radial-gradient
---------------
Safari и Chrome

-webkit-linear-gradient
-webkit-radial-gradient
-webkit-user-select
---------------
@-правила

@charset
@font-face
@import
@media
@page
---------------
Селекторы и их комбинации

A
#id
.class
.class1.class2
*
A   B
A > B
A + B
A ~ B
[attr]
[attr='value']
[attr^='value']
[attr$='value']
[attr*='value']
[attr~='value']
[attr|='value']
---------------
Псевдоклассы

:active
:checked
:default
:disabled
:empty
:enabled
:first-child
:first-letter
:first-line
:first-of-type
:focus
:hover
:indeterminate
:invalid
:lang
:last-child
:last-of-type
:link
:not
:nth-child
:nth-last-child
:nth-last-of-type
:nth-of-type
:only-child
:only-of-type
:optional
:read-only
:read-write
:required
:root
:target
:valid
:visited
---------------
Псевдоэлементы

::after (:after)
::before (:before)
::first-letter
::first-line
::selection

---------------
Функции

attr()
calc()
---------------
Значения свойств

Строки
Числа
Проценты
Размер
Адрес

Цвет
Угол
Медиа-запросы
inherit
initial

Календарь
«    Декабрь 2020    »
ПнВтСрЧтПтСбВс
 123456
78910111213
14151617181920
21222324252627
28293031 
Популярные статьи
Архив новостей
Декабрь 2020 (1)
Ноябрь 2020 (42)
Октябрь 2020 (61)
Сентябрь 2020 (94)
Август 2020 (375)
Июль 2020 (829)
Наш опрос



РЕКЛАМА


ВАША РЕКЛАМА
23-03-2016, 18:02
Псевдокласс - :nth-last-of-type
Рейтинг:
Категория: Справочник CSS
Псевдокласс :nth-last-of-type используется для добавления стиля к элементам указанного типа на основе нумерации в дереве элементов. В отличие от псевдокласса :nth-of-type отсчет ведется не от первого элемента, а от последнего....
Просмотров: 4 573
Комментариев: 2
23-03-2016, 17:43
Псевдокласс - :nth-last-child
Рейтинг:
Категория: Справочник CSS
Псевдокласс :nth-last-child используется для добавления стиля к элементам на основе нумерации в дереве элементов. В отличие от псевдокласса :nth-child отсчет ведется не от первого элемента, а от последнего....
Просмотров: 4 399
Комментариев: 3
23-03-2016, 17:42
Псевдокласс - :nth-child
Рейтинг:
Категория: Справочник CSS
Псевдокласс :nth-child используется для добавления стиля к элементам на основе нумерации в дереве элементов....
Просмотров: 5 310
Комментариев: 3
23-03-2016, 17:40
Псевдокласс - :not
Рейтинг:
Категория: Справочник CSS
Псевдокласс :not задаёт правила стилей для элементов, которые не содержат указанный селектор....
Просмотров: 4 656
Комментариев: 2
23-03-2016, 17:23
Псевдокласс - :link
Рейтинг:
Категория: Справочник CSS
Псевдокласс :link применяется к ссылкам, которые еще не посещались пользователем, и задает для них стилевое оформление....
Просмотров: 4 372
Комментариев: 1
23-03-2016, 17:21
Псевдокласс - :last-of-type
Рейтинг:
Категория: Справочник CSS
Псевдокласс :last-of-type задает правила стилей для последнего элемента в списке дочерних элементов своего родителя. К примеру, добавление :last-of-type к селектору li устанавливает стиль только для последнего пункта списка, при этом не распространяется на остальные...
Просмотров: 4 514
Комментариев: 3
23-03-2016, 17:18
Псевдокласс - :last-child
Рейтинг:
Категория: Справочник CSS
Псевдокласс :last-child задает стилевое оформление последнего элемента своего родителя....
Просмотров: 5 670
Комментариев: 7
23-03-2016, 17:16
Псевдокласс - :lang
Рейтинг:
Категория: Справочник CSS
Определяет язык, который используется в документе или его фрагменте. С помощью псевдокласса :lang можно задавать определённые настройки, характерные для разных языков, например, вид кавычек в цитатах....
Просмотров: 5 832
Комментариев: 2
23-03-2016, 17:10
Псевдокласс - :invalid
Рейтинг:
Категория: Справочник CSS
Применяется к полям формы, содержимое которых не соответствует указанному типу. Например, для type="number" должно вводиться число, а не буквы, для type="email" корректный адрес электронной почты....
Просмотров: 4 636
Комментариев: 1
23-03-2016, 17:07
Псевдокласс - :indeterminate
Рейтинг:
Категория: Справочник CSS
Псевдокласс :indeterminate задает стиль для элементов форм, таким как флажки и переключатели, когда они находятся в неопределенном состоянии. К примеру, если из группы флажков ни один не помечен, то флажки находятся в указанном состоянии. В реальности, стиль применяется только к...
Просмотров: 4 468
Комментариев: 2
23-03-2016, 17:05
Псевдокласс - :hover
Рейтинг:
Категория: Справочник CSS
Определяет стиль элемента при наведении на него курсора мыши, но при этом элемент еще не активирован, иными словами кнопка мыши не нажата....
Просмотров: 4 390
Комментариев: 3
23-03-2016, 17:04
Псевдокласс - :focus
Рейтинг:
Категория: Справочник CSS
Псевдокласс :focus определяет стиль для элемента получающего фокус. Например, им может быть текстовое поле формы, в которое устанавливается курсор....
Просмотров: 4 367
Комментариев: 1
23-03-2016, 17:01
Псевдокласс - :first-of-type
Рейтинг:
Категория: Справочник CSS
Псевдокласс :first-of-type задает правила стилей для первого элемента в списке дочерних элементов своего родителя. К примеру, добавление :first-of-type к селектору TD устанавливает стиль для всех первых ячеек, поскольку родителем для тега <td> выступает...
Просмотров: 4 428
Комментариев: 6
23-03-2016, 16:10
Псевдоэлемент - :first-line
Рейтинг:
Категория: Справочник CSS
Псевдоэлемент :first-line задает стиль первой строки форматированного текста. Длина этой строки зависит от многих факторов, таких как используемый шрифт, размер окна браузера, ширина блока, языка и т.д. В правилах стиля допустимо использовать только свойства, относящиеся к шрифту,...
Просмотров: 4 080
Комментариев: 2
23-03-2016, 15:53
Псевдоэлемент - :first-letter
Рейтинг:
Категория: Справочник CSS
Псевдоэлемент :first-letter определяет стиль первого символа в тексте элемента, к которому добавляется. К этому псевдоэлементу могут применяться только стилевые свойства, связанные со свойствами шрифта, полями, отступами, границами, цветом и фоном....
Просмотров: 3 981
Комментариев: 3
23-03-2016, 15:45
Псевдокласс - :first-child
Рейтинг:
Категория: Справочник CSS
Псевдокласс :first-child применяет стилевое оформление к первому дочернему элементу своего родителя....
Просмотров: 4 207
Комментариев: 5
23-03-2016, 15:38
Псевдокласс - :enabled
Рейтинг:
Категория: Справочник CSS
Псевдокласс :enabled используется для применения стиля к доступным (не заблокированным) элементам форм. По умолчанию, все элементы форм являются доступными, если в коде HTML к ним  не добавляется атрибут disabled....
Просмотров: 3 989
Комментариев: 3
23-03-2016, 15:33
Псевдокласс - :empty
Рейтинг:
Категория: Справочник CSS
Псевдокласс :empty представляет пустые элементы, иными словами такие, которые не содержат дочерних элементов, текста или пробелов. К примеру, <p></p> является пустым элементов, а <p> </p>, <p>&nbsp;</p> или <p>эге</p> уже...
Просмотров: 4 694
Комментариев: 2
23-03-2016, 15:30
Псевдокласс - :disabled
Рейтинг:
Категория: Справочник CSS
Псевдокласс :disabled используется для применения стиля к заблокированным элементам форм. Такие элементы не могут получить фокус, быть нажатыми или активированы, в текстовых полях нельзя набирать текст....
Просмотров: 4 205
Комментариев: 1
23-03-2016, 15:28
Псевдокласс - :default
Рейтинг:
Категория: Справочник CSS
Псевдокласс :default применяет стиль к элементам форм, которые установлены по умолчанию в группе похожих элементов....
Просмотров: 5 050
Комментариев: 2
23-03-2016, 15:27
Псевдокласс - :checked
Рейтинг:
Категория: Справочник CSS
Псевдокласс :checked применяется к элементам интерфейса, таким как переключатели (checkbox) и флажки (radio), когда они находятся в положение «включено». Переключение элементов в такое состояние происходит с помощью атрибута checked тега <input> или пользователем....
Просмотров: 4 354
Комментариев: 4
23-03-2016, 15:24
Псевдокласс :active
Рейтинг:
Категория: Справочник CSS
Псевдокласс :active определяет стиль для активной ссылки. Активной ссылка становится при нажатии на нее....
Просмотров: 3 937
Комментариев: 2
23-03-2016, 14:12
[атрибут|="значение"] - [attr|='value']
Рейтинг:
Категория: Справочник CSS
В именах идентификаторов и классов разрешено использовать символ дефиса (-), что позволяет создавать значащие значения атрибутов id и class....
Просмотров: 4 098
Комментариев: 0
23-03-2016, 14:10
[атрибут~="значение"] - [attr~='value']
Рейтинг:
Категория: Справочник CSS
Некоторые значения атрибутов могут перечисляться через пробел, например имена классов. Чтобы задать стиль при наличии в списке требуемого значения требуется использовать конструкцию ~=....
Просмотров: 3 954
Комментариев: 1
23-03-2016, 14:07
[атрибут*="значение"] - [attr*='value']
Рейтинг:
Категория: Справочник CSS
Возможны варианты, когда стиль следует применить к тегу с определённым атрибутом, когда частью его значения является некоторый текст. При этом точно не известно, в каком месте значения включен данный текст — в начале, середине или конце. В подобном случае следует использовать...
Просмотров: 4 650
Комментариев: 0
23-03-2016, 14:02
[атрибут$="значение"] - [attr$='value']
Рейтинг:
Категория: Справочник CSS
Устанавливает стиль для элемента в том случае, если значение атрибута оканчивается указанным текстом....
Просмотров: 5 052
Комментариев: 0
23-03-2016, 13:47
[атрибут^="значение"] - [attr^='value']
Рейтинг:
Категория: Справочник CSS
Устанавливает стиль для элемента в том случае, если значение атрибута тега начинается с указанного текста....
Просмотров: 4 517
Комментариев: 1
23-03-2016, 13:33
[атрибут="значение"] - [attr='value']
Рейтинг:
Категория: Справочник CSS
Устанавливает стиль для элемента в том случае, если задано определённое значение специфичного атрибута....
Просмотров: 3 933
Комментариев: 1
23-03-2016, 13:30
Селекторы атрибутов - [attr]
Рейтинг:
Категория: Справочник CSS
Устанавливает стиль для элемента, если задан специфичный атрибут тега. Его значение в данном случае не важно....
Просмотров: 4 000
Комментариев: 0
23-03-2016, 13:27
Родственные селекторы - A ~ B
Рейтинг:
Категория: Справочник CSS
Родственные селекторы по своему поведению похожи на соседние селекторы (запись вида E + F), но в отличие от них стилевые правила применяются ко всем близлежащим элементам. К примеру, для селектора h1~p стиль будет применяться ко всем элементам <p>, располагающихся после...
Просмотров: 4 286
Комментариев: 6
«Показать больше статей»
1 2 3 4 5 6 7 8 9