Kosten | Понедельник, 05 Июня 2017, 22:51 | Сообщение 1 |
| Здесь просто разберем основы CSS, что управляют внешним видом сайта, а точнее дизайн. А точнее какой стиль отвечает за свое действие, что может сделать, как увеличить размер, как рамка или другой элемент дизайн, также наложить на его оттенок цвета. Здесь просто будет прописан стиль и его значение, которые безусловно вам встречались, но теперь вы будете знать, за что в интернет ресурсе он отвечает. И так вы можете сами что то построить или создать оригинальное в стилистике.
Свойства фона:
[info]background-position - задает стартовую позицию фонового изображения. background - объединяет в себе все свойства, которые используются для определения фона страницы. background-attachment - определяет фоновое изображение фиксированным или прокручивается вместе со страницей. background-color - задает цвет фона для элемента. background-image - определяет используемое изображение фона для элемента. background-repeat - определяет как повторять фоновое изображение.[/info]
Свойства границ:
[info]border-bottom-width -задает ширину нижней границы элемента. border-left-width - задает ширину левой границы элемента. border-left-style - задает стиль левой границы элемента. border-left-color - задает цвет левой границы элемента. border-left - объединяет в себе все свойства, которые используются для определения левой границы (рамки) элемента. outline-color - задает цвет внешней границы элемента. border-collapse - способно удалять двойные линии (границы) на месте стыка ячеек таблицы. border-width - задает ширину для четырех границ. border-top-width - задает ширину верхней границы элемента. border-top-style - задает стиль верхней границы элемента. outline-style - задает стиль внешней границы элемента. border-right - объединяет в себе все свойства, которые используются для определения правой границы (рамки) элемента. border-right-color - задает цвет правой границы элемента. border-right-style - задает стиль правой границы элемента border-bottom-color - задает цвет нижней границы элемента. border-bottom - объединяет в себе все свойства, которые используются для определения нижней границы (рамки) элемента. border - объединяет в себе все свойства, которые используются для определения границы (рамки) элемента. border-color - задает цвет для четырех границ. outline - задает внешнюю границу вокруг элементов border-top-color - задает цвет верхней границы элемента. border-top - объединяет в себе все свойства, которые используются для определения верхней границы (рамки) элемента. border-style - задает стиль для четырех границ. border-spacing - задает расстояние между границами ячеек в таблице border-right-width - задает ширину правой границы элемента. outline-width - задает ширину внешней границы элемента.[/info]
Свойства размера:
[info]min-width - определяет минимальную ширину элемента. max-width - определяет максимальную ширину элемента. min-height - определяет минимальную высоту элемента. height - определяет высоту элемента. width - определяет ширину элемента. max-height - определяет максимальную высоту элемента.[/info]
Свойства шрифта:
[info]font-size - задает размер шрифта. font-weight - определяет толщину символов в тексте. font-style - задает стиль шрифта для текста. font-family - задает шрифт для элемента. font - объединяет в себе все свойства, которые используются для определения шрифта. font-variant - определяет должен ли текст отображаться капительными буквами или нет.[/info]
Свойства генерированного контента:
[info]quotes - задает тип кавычек, которые используются для вставленных цитат. counter-reset - создает или сбрасывает один или несколько счетчиков. counter-increment - используется для увеличения значения счетчика приращений. content - предназначено для вставки сгенерированного контента.[/info]
Свойства таблицы:
[info]caption-side - задает расположение заголовка (подписи) таблицы. empty-cells - позволяет определить показывать границы и фон пустых ячеек или нет. table-layout - позволяет определить алгоритм разметки таблицы.[/info]
Свойства текста:
[info]vertical-align - задает вертикальное выравнивание элемента. word-spacing - уменьшает или увеличивает пробелы между словами. white-space - определяет отображение пробелов между словами. text-align - определяет горизонтальное выравнивание текста в элементе. text-indent - определяет отступ первой строки в текстовом блоке. text-decoration - определяет оформление текста. direction - позволяет задать направление отображения текста. line-height - определяет высоту строки. letter-spacing - увеличивает или уменьшает расстояние между буквами в тексте. color - позволяет задать цвет текста. text-transform - контролирует в тексте выделение заглавными буквами.[/info]
CSS Псевдоклассы/элементы
[info]:lang - добавляет стиль к элементу со специальным атрибутом lang. :hover - добавляет стиль к элементу при наведенной мышкой. :active - добавляет стиль к активному элементу. :first-child - добавляет стилевое оформление к первому дочернему элементу селектора :visited - добавляет стиль к посещенной ссылке. :after - добавляет контент после элемента. :before - добавляет контент до элемента. :focus - добавляет специальный стиль к элементу, который получает фокус. :first-line - добавляет стилевое оформление к первой строке текста. :first-letter - добавляет стилевое оформление к первой букве текста. :link - добавляет стиль к непосещенной ссылке.[/info]
Свойства списка:
[info]list-style - объединяет в себе все свойства, которые используются для определения внешнего вида списка. list-style-position - определяет место расположение маркера списка. list-style-type - определяет тип маркера в списке. list-style-image - заменяет маркер списка изображением. [/info]
Свойства отступов:
[info]margin-top - определяет верхний отступ для элемента. margin-right - определяет правый отступ для элемента. margin-bottom - определяет нижний отступ для элемента. margin-left - определяет левый отступ для элемента. margin - задает все свойства отступов в одной строке.[/info]
Свойства полей:
[info]padding-top - задает верхнее поле для элемента. padding-right - задает правое поле для элемента. padding-left - задает левое поле для элемента. padding-bottom - задает нижнее поле для элемента. padding - задает все свойства полей в одной строке.[/info]
Свойства позиционирования:
[info]top - устанавливает положение верхнего края содержимого элемента без учета толщины рамок и отступов. cursor - определяет тип курсора при наведении мышки на элемент. display - определяет, как элемент должен быть показан в документе. visibility - способно сделать любой видимым или невидимым. right - устанавливает положение правого края содержимого элемента. z-index - управляет расположением элемента по z-оси float - определяет по какой стороне будет выравниваться объект. Остальные элементы будут обтекать его с других сторон. clip - позволяет определить область позиционированного элемента, в которой будет показано его содержимое. left - устанавливает положение левого края содержимого элемента clear - устанавливает с какой стороны элемента запрещено обтекание другими элементами. overflow - управляет отображением содержания блочного элемента bottom - устанавливает положение нижнего края содержимого элемента без учета толщины рамок и отступов. position - используется для позиционирования элемента.[/info]
| Страна: (RU) |
| |
Gerat | Вторник, 06 Июня 2017, 02:29 | Сообщение 2 |
| Вот свойства границ интересно было узнать.
| Страна: (RU) |
| |
Kosten | Вторник, 06 Июня 2017, 02:52 | Сообщение 3 |
| Закинул как шпаргалку.)
| Страна: (RU) |
| |
Сопрано | Воскресенье, 11 Июня 2017, 17:45 | Сообщение 4 |
| Все и не упомнишь - но главное нужно знать.
| Страна: (RU) |
| |