| author | Oleksandr Gavenko <gavenkoa@gmail.com> |
| Fri, 26 Aug 2011 23:43:41 +0300 | |
| changeset 963 | 3cb7e786ed70 |
| parent 899 | 7b4265c8d324 |
| permissions | -rw-r--r-- |
|
899
7b4265c8d324
Set fill-column as directory local var.
Oleksandr Gavenko <gavenkoa@gmail.com>
parents:
888
diff
changeset
|
1 |
-*- mode: outline; coding: utf-8; -*- |
| 87 | 2 |
|
3 |
* Emacs. |
|
4 |
||
5 |
$ sudo apt-get install css-mode |
|
6 |
||
7 |
* Graphical editor. |
|
8 |
||
9 |
$ sudo apt-get install cssed |
|
10 |
||
| 385 | 11 |
* Adding CSS to HTML. |
12 |
||
13 |
Include in head tag: |
|
14 |
||
15 |
<html> |
|
16 |
<head> |
|
| 387 | 17 |
<link href="path-to.css" rel="stylesheet" type="text/css"> |
| 385 | 18 |
</head> |
19 |
... |
|
20 |
<html> |
|
21 |
||
22 |
or |
|
23 |
||
24 |
<head> |
|
25 |
<style type="text/css"> |
|
26 |
h1 {border-width: 1; border: solid; text-align: center}
|
|
27 |
</style> |
|
28 |
</head> |
|
29 |
||
30 |
To change style in specific tag use: |
|
31 |
||
32 |
<b style="color: blue; font-family: ariel">Welcome!</b> |
|
33 |
||
| 888 | 34 |
* Selectors. |
35 |
||
36 |
tag {}
|
|
37 |
.class {}
|
|
38 |
#id {} для id разрешены символы
|
|
39 |
* {} - любой элемент
|
|
40 |
||
41 |
tag tag1 {} - выбор tag1, у которых есть предок tag
|
|
42 |
tag > tag {} - выбор дочернего элемента
|
|
43 |
tag + tag {} - выбор соседних элементов
|
|
44 |
tag ~ tag {} - выбор любого соседа
|
|
45 |
||
46 |
[attr] {}
|
|
47 |
[attr="..."] {}
|
|
48 |
[attr~="..."] {} - присутствует слово ... в поле атрибута
|
|
49 |
[attr*="..."] {} - присутствует набор символов ... в поле атрибута
|
|
50 |
[attr^="..."] {} - начинается с ... в поле атрибута
|
|
51 |
[attr$="..."] {} - заканчивается на ... в поле атрибута
|
|
52 |
tag [attr|="..."] {}
|
|
53 |
||
54 |
:link - не посещенные ссылки |
|
55 |
:visited - посещенные ссылки |
|
56 |
:active - нажатие на левую клавишу мыши на элементе |
|
57 |
:hover - назначать при наведении |
|
58 |
:focus - при фокусировке элемента |
|
59 |
:first-child - первый подэлемент |
|
60 |
:last-child - последний подэлемент |
|
61 |
||
62 |
:first-line |
|
63 |
:first-letter - выбрать первую букву (не приминимо к inline элементам) |
|
64 |
:before{content:"..."}, ставит перед контентом элементов строку xxx (можно
|
|
65 |
использовать счетчики) |
|
66 |
:after{} - тоже, что и before, только ставит текст после контента тега
|