правила CSS3 - Visavi.net
https://visavi.net/
RSS - Visavi.net
https://visavi.net/assets/img/images/logo_small.png
RSS - Visavi.net
https://visavi.net/
[email protected] (admin)
[email protected] (admin)
Mon, 18 Nov 2024 13:39:53 +0300
-
пусть будит подсказкой, тема #
https://visavi.net/topics/17257/298773
правила CSS3
delete
Tue, 04 Jan 2011 00:14:59 +0300
Сообщения
https://visavi.net/topics/17257/298773
-
<strong>Обводка</strong><br>
<pre class="prettyprint"> border:1px solid #000;
outline:1px solid #699;
outline-offset: -9px;
</pre>
<br>
<em><span style="font-size:x-small">Добавлено через 01:53 сек.</span></em><br>
<strong>Фоновые градиенты</strong><br>
<pre class="prettyprint"> /* для Firefox */
background: -moz-linear-gradient(bottom, #b6ebf7, #fff 20%);
/* для Safari */
background: -webkit-gradient(linear, left bottom, left top, color-stop(0, #b6ebf7), color-stop(0.20, #fff));
</pre>
<br>
<em><span style="font-size:x-small">Добавлено через 02:49 сек.</span></em><br>
<strong>Вращения</strong><br>
<pre class="prettyprint"> -moz-transform: rotate(2deg);
-webkit-transform: rotate(2deg);
</pre>
<br>
<em><span style="font-size:x-small">Добавлено через 07:54 сек.</span></em><br>
<strong>Анимации</strong><br>
<em>Сначала определяем цвет ссылки:</em><br>
<pre class="prettyprint">.box a {
color: #0f0;
}</pre>
<em>Устанавливаем цвет и свойства для анимации с помощью transition-property:</em><br>
<pre class="prettyprint">box10 a:hover {
color: #0f0;
-moz-transition-property: color;
-webkit-transition-property: color;
}</pre>
<em>Устанавливает продолжительность анимации:</em><br>
<pre class="prettyprint">#box10 a:hover {
color: #0f0;
-moz-transition-property: color;
-webkit-transition-property: color;
-moz-transition-duration: 0.5s;
-webkit-transition-duration: 0.5s;
}
</pre>
<em>Устанавливаем тип анимации:</em><br>
<pre class="prettyprint">#box10 a:hover {
color:#31801f;
-moz-transition-property: color;
-webkit-transition-property: color;
-moz-transition-duration: 0.5s;
-webkit-transition-duration: 0.5s;
-moz-transition-timing-function: ease;
-webkit-transition-timing-function: ease;
}
</pre>
https://visavi.net/topics/17257/298763
правила CSS3
delete
Mon, 03 Jan 2011 23:59:20 +0300
Сообщения
https://visavi.net/topics/17257/298763
-
Возможно для новичков будит полезным.<br>
<strong>Скругленные углы</strong><br>
<pre class="prettyprint">
border: 1px solid #699;
/* для Firefox */
-moz-border-radius: 20px;
/* для Safari и Google Chrome */
-webkit-border-radius: 20px;
</pre>
<br>
<em><span style="font-size:x-small">Добавлено через 01:18 сек.</span></em><br>
<strong>Тень элемента</strong><br>
<pre class="prettyprint">
/* Необязательная команда для эффекта тени */
border:1px solid #699;
/* для Firefox */
-moz-box-shadow: 5px 5px 5px #b6ebf7;
/* для Safari и Google Chrome */
-webkit-box-shadow: 5px 5px 5px #b6ebf7;
</pre>
<br>
<em><span style="font-size:x-small">Добавлено через 04:24 сек.</span></em><br>
<strong>Колонки</strong><br>
<pre class="prettyprint">/* Не обязательная команда для колонок */
border:1px solid #699;
/* для Firefox */
-moz-column-count: 2;
-moz-column-gap: 20px;
-moz-column-rule: 1px solid #6e8eb9;
/* для Safari */
-webkit-column-count: 2;
-webkit-column-gap: 20px;
-webkit-column-rule: 1px solid #6e8eb9;
</pre>
<br>
<em><span style="font-size:x-small">Добавлено через 08:00 сек.</span></em><br>
<strong>Несколько изображений для фона</strong><br>
<pre class="prettyprint">#box5 blockquote{
/* Для всех браузеров */
background:no ne;
padding:0 20px;
}
body:last-child #box5 blockquote p{
/* IE игнорирует данное правило */
background:no ne
}
body:last-child #box5 blockquote{
/* IE игнорирует данное правило */ background:url(/i/quotel.gif) no-repeat 0 0, url(/i/quoter.gif) no-repeat 100% 0;
}
</pre>
<br>
<em><span style="font-size:x-small">Добавлено через 09:57 сек.</span></em><br>
<strong>Модель прямоугольника</strong><br>
<pre class="prettyprint">width: 200px;
padding: 10px;
/* для Firefox */
-moz-box-sizing: content-box;
/*для IE8 */
box-sizing: content-box;
/* для Safari */
-webkit-box-sizing: content-box;
</pre>
https://visavi.net/topics/17257/298760
правила CSS3
delete
Mon, 03 Jan 2011 23:48:18 +0300
Сообщения
https://visavi.net/topics/17257/298760