Выравнивание блока с текстом слева или справа

.right { position:absolute; right:0px; width:300px; background-color:#b0e0e6; } Когда я был помоложе, отец часто давал мне умные советы. «Перед тем, как критиковать кого-либо, — говорил он, — помни о том, что почти любой человек, которого ты критикуешь, никогда не признает свою […]

Читать далее →

CSS свойство background-image, поддержка в браузерах, примеры использования // Вебшкола онлайн

 Перейти к справке CSS body { background-image:url(‘paper.gif’); } Описание и использование Свойство CSS background-image задает фоновое изображение элемента. Фон элемента отображается в пределах границ (border) элемента, включая поля (padding), но не внешний отступ (margin). По умолчанию, начальная позиция фонового […]

Читать далее →

Outline (внешняя граница) в CSS

  p.outline { border:1px solid red; outline:green dotted thick; } Заметка: помните, что Internet Explorer 8 (и выше) поддерживает свойстов outline только если указан !DOCTYPE. Заметка: помните, что Internet Explorer 8 (и выше) поддерживает свойстов outline только если указан !DOCTYPE.

Читать далее →

Еще одна фотогалерея

.thumbnail { float:left; width:110px; height:90px; margin:5px; } .text_line { clear:both; margin-bottom:2px; } Фотогалерея Измените размер окна браузера, чтобы посмотреть, что будет, когда изображениям не будет хватать места. Второй ряд   Измените размер окна браузера, чтобы посмотреть, что будет, когда изображениям […]

Читать далее →

Оформление текста с помощью CSS: подчеркивание, надчеркивание, перечеркивание, светомузыка

  h1 {text-decoration:overline;} h2 {text-decoration:line-through;} h3 {text-decoration:underline;} h4 {text-decoration:blink;} Это заголовок первого уровня Это заголовок второго уровня Это заголовок третьего уровня Это заголовок четвертого уровня

Читать далее →

CSS псевдо-класс :visited, поддержка в браузерах, примеры использования // Вебшкола онлайн

 Перейти к справке CSS a:link {color:#FF0000}      /* непосещенная ссылка */ a:visited {color:#00FF00}  /* посещенная ссылка */ a:hover {color:#FF00FF}  /* ссылка, над которой находится мышь */ a:active {color:#0000FF}  /* ссылка при нажатии */ Описание и использование Псевдо-класс CSS :visited изменяет […]

Читать далее →

Готовое горизонтальное меню

  ul { list-style-type:none; margin:0; padding:0; overflow:hidden; } li { float:left; } a:link,a:visited { display:block; width:120px; font-weight:bold; color:#FFFFFF; background-color:#98bf21; text-align:center; padding:4px; text-decoration:none; text-transform:uppercase; } a:hover,a:active { background-color:#7A991A; } Главная Новости Контакты О нас

Читать далее →

Разный стиль для границ на разных сторонах элемента

p.one {border-style:dotted solid dashed double;} p.two {border-style:dotted solid dashed;} p.three {border-style:dotted solid;} p.four {border-style:dotted;} Это текст параграфа. Это текст параграфа. Это текст параграфа. Это текст параграфа. Это текст параграфа. Это текст параграфа. Это текст параграфа. Это текст параграфа.

Читать далее →

Изменение фона ссылок

   a:link {background-color:#B2FF99;} /* непосещенная ссылка */ a:visited {background-color:#FFFF85;} /* посещенная ссылка */ a:hover {background-color:#FF704D;} /* ссылка, над которой находится курсор мыши */ a:active {background-color:#FF704D;} /* ссылка в момент щелчка мышью */ Это ссылка Заметка: a:hover должен быть указан после […]

Читать далее →