Главная » Файлы » Прочие скрипты » CSS
Полезная шпаргалка по новым селекторам css3
24.06.14, 14:26:10



Очень полезная css шпаргалка. Пользуйтесь на здоровье

*
Код
* {  
margin: 0;  
padding: 0;  
  }


a:visited и a:link
Код
a:link {  
  color: red;  
  }  

  a:visited {  
  color: purple;  
  }


a + b
Код
ul + p {  
color: red;  
  }


a > b
Код
#container > ul {  
border: 1px solid black;  
  }


a ~ b
Код
ul ~ p {  
color: red;  
  }


a[title]
Код
a[title] {  
color: green;  
  }


a[href="link"]
Код
a[href="http://www.apo-ucoz.com"] {  
color: red;  
  }


a[href*="link"]
Код
a[href*="ucoz"] {  
color: red;  
  }


a[href^="http"]
Код
a[href^="http://"] {  
background: url(link) no-repeat;  
padding-left: 10px;  
  }


a[href$=".jpg"]
Код
a[href$=".jpg"] {  
color: red;  
  }


a[data-*="foo"]
Код
a[data-filetype="image"] {  
color: red;  
  }


a[foo~="bar"]
Код
a[data-info~="external"] {  
color: red;  
  }  

  a[data-info~="image"] {  
border: 1px solid black;  
  }


a:checked
Код
input[type=radio]:checked {  
border: 1px solid black;  
  }


a:after
Код
.clearfix:after {  
content: "";  
display: block;  
clear: both;  
visibility: hidden;  
font-size: 0;  
height: 0;  
}  

  .clearfix {  
*display: inline-block;  
_height: 1%;  
  }


a:hover
Код
div:hover {  
background: #e3e3e3;  
  }


a:not(selector)
Код
div:not(#container) {  
color: blue;  
  }


a::pseudoElement
Код
p::first-line {  
font-weight: bold;  
font-size: 1.2em;  
  }


a:nth-child(n)
Код
li:nth-child(3) {  
color: red;  
  }


a:nth-last-child(n)
Код
li:nth-last-child(2) {  
color: red;  
  }


a:nth-of-type(n)
Код
ul:nth-of-type(3) {  
border: 1px solid black;  
  }


a:nth-last-of-type(n)
Код
ul:nth-last-of-type(3) {  
border: 1px solid black;  
  }


a:first-child
Код
ul li:first-child {  
border-top: none;  
  }


a:last-child
Код
ul > li:last-child {  
color: green;  
  }


a:only-of-type
Код
li:only-of-type {  
font-weight: bold;  
  }


a:first-of-type
Код
ul:first-of-type > li:nth-child(2) {  
font-weight: bold;  
  }

Категория: CSS | Добавил: Apocalypse | Теги: шпаргалка, селекторам, ПО, новым, полезная, CSS3
Просмотров: 508 | Загрузок: 0 | Рейтинг: 0.0/0
Всего комментариев: 0
Имя *:
Email: