Стилі CSS. (Лекція 5)

Содержание

Слайд 2

Межі Специфікація CSS2 описує атрибут стилю border, який дозволяє задати вид

Межі

Специфікація CSS2 описує атрибут стилю border, який дозволяє задати вид меж

навколо об'єктів. Атрибут border може бути застосований до будь-яких об'єктів.
Слайд 3

table {border-width: 3px;border-color: red;border-style: dashed;} .gro {border-style: groove;} Верхня частина заголовка зеленого кольору (dotted)



Верхня частина заголовка

зеленого кольору (dotted)

Слайд 4

Слайд 5

Курсори

Курсори

Слайд 6

Слайд 7

Слайд 8

Приклад all-scroll auto col-resize crosshair default hand

Приклад









Слайд 9

Відступи

Відступи

Слайд 10

Відступи

Відступи

Слайд 11

Слайд 12

Смуга прокрутки

Смуга прокрутки

Слайд 13

Слайд 14

Приклади: .SBColor { scrollbar-3dlight-color:blue;scrollbar-arrow-color: white; scrollbar-base-color:green;scrollbar-face-color:pink; scrollbar-track-color: aqua;}

Приклади:


Слайд 15

Псевдоелементи Псевдоелементи є особливою групою, що дозволяють об'єднувати декілька стилів для

Псевдоелементи

Псевдоелементи є особливою групою, що дозволяють об'єднувати декілька стилів для якого-небудь

об'єкту. Наприклад, можна задати властивості для першої букви параграфа. Для цього призначається для тега P псевдоелемент first-letter, в якому встановлюєте різні стили: p:first-letter { float:right;font-size:2em;color:red;}
Слайд 16

Слайд 17

Слайд 18

A.pr:visited { color:blue } A.pr:active { font-weight:bold; color:brown } A.pr:link {


Слайд 19

Позиціонування

Позиціонування

Слайд 20

Слайд 21

Слайд 22

z-index

color: #0000ff; font-size:100px">z-index
 
 

Слайд 23

#ffff00"> 
 

Слайд 24

Слайд 25

body {background-color: #c5ffa0} a {position: absolute;z-index:auto ;top: 100px;border: #000000 1px solid;}



Слайд 26

Слайд 27

Розмір елементу

Розмір елементу

Слайд 28

Слайд 29

Высота даного осередку рівна 35 пікселям. Отже вміст в осередок не

all-scrollautocol-resizecrosshairdefaulthand





Высота даного осередку рівна 35 пікселям.
Отже
вміст в осередок не влізає і обрізається
Минимальная Висота даного осередку
рівна 150 пікселям. Отже текст в неї влізає і не обрізається

Слайд 30

Посилання

Посилання

Слайд 31

Приклад використання параметра HOVER A:link {text-decoration: none} // прибирає підкреслення для

Приклад використання параметра HOVER