Интересные возможности CSS

Есть различные варианты присвоения стилей, например:

<style type="text/css">
div#m {font-weight:bold}
#id_style {text-align: center;}
.myredclass {color:red}
</style>

<div id="m">Это мой уникальный полужирный Див!</div>
<p id="id_style">А это мой текст по середине!</p>
<p class="myredclass">А это мой красный параграф!</p>

Строка вида : div#m {font-weight:bold} - действует только если в теге <div> будет прописан id="m"

Строка вида : #id_style {text-align: center;} будет работать в любом теге, в котором прописан id="id_style"

Строка вида : .myredclass {color:red} создает класс и будет работать в любом теге, где прописан класс class="myredclass"

 C самым легким разобрались, а теперь примерчик посложнее:

<style type="text/css">
span.my_class {font-size: 300%;}
.red_border td {border-bottom: #FF3838 5px solid;}
</style>
<table border="1" width="90%" class="red_border">
    <tr>
        <td>1</td>
    </tr>
    <tr>
       <td>
        <span class="my_class">жирный текст</span>
       </td>
    </tr>
</table>

В вышеприведенном примере только у таблицы с классом red_border будут нижние границы ячеек td иметь крассный цвет а все элементы span, имеющие класс my_class, будут выделяться жирно.

Оцени публикацию:
  • 4,20
Оценили человек: 4
  •  

Похожие статьи:



Предложения и пожелания:
Ваше имя: Ваш E-mail:
Введите изображенные цифры:
Captcha

HTML (19)

CSS (36)

PHP (22)

MySQL (14)

JavaScript (57)

Flash (6)

XML (3)

Apache (34)

Дизайн (35)

Продвижение (31)

Программы (26)

Unix (11)

Интересное (37)


Справочники и учебники:


Последние комменты:

Новые заметки:

Защита сервера от ошибок в phpMyAdmin

HTML5 - новые виды атак

Социальные рекомендации Twitter в Google

Ашманов про стартапы

Skype Distributed Database Architecture

Erlang - лекарство при высоких нагрузках

Amazon Web Services: инструменты обеспечения масштабируемости и отказоустойчивости

Обсуждения на форуме:

некорректно отображается страница в браузерах

не могу войти в admin

Нужна критика идеи

Поиск по дополнительным полям и формам

Вопрос по категориям

Несколько вопросов по проекту.

Плагины, меню и интеграция

Ошибка в тексте? Выделите её мышкой и нажмите: Ctrl + Enter| Здравствуйте, Гость | Войти | Регистрация| Карта сайта | RSS ленты
О проекте | Скачать CMS | Видеоуроки | Документация | Плагины | Форум | Идеи | Новости | Веб-мастеру | Контакты

YaPro CMS в Живом Журнале

YaPro CMS в Твитере

YaPro CMS в Одноклассниках

YaPro CMS в Яндекс.Блогах


youtube.com/watch?v=7hFivbgIEqk

При полном или частичном использовании материалов данного сайта, ссылка на сайт "yapro.ru" обязательна как на источник информации.
Автоматический импорт материалов и информации с сайта запрещен.
Copyrights © 2007 - 2012 YaPro.Ru


Главная » Веб-мастеру » CSS »