Отправляет email-рассылки с помощью сервиса Sendsay

Web-программирование - это просто!

Подписаться Бесплатная «Серебряная» новостная рассылка . Подписчиков 680 RSS
←   Октябрь 2009   →
 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31


За последние 60 дней ни разу не выходила


Сайт рассылки: http://www.easyprog.ru
Открыта: 27-06-2009
Адрес автора: comp.soft.prog.easyweb-owner@subscribe.ru

Автор
Александр

Статистика

680 подписчиков
0 за неделю
←   Все выпуски   →

Web-программирование - это просто!


Новое на сайте Программирование - это просто! (www.easyprog.ru):

Добрый день, уважаемые подписчики!

Тема сегодняшнего выпуска: «CSS: Текст и его свойства».

 

Рассмотрим пример:

 

<HTML> <HEAD> <TITLE>Урок 14. CSS: Текст и его свойства</TITLE> </HEAD> <STYLE TYPE="text/css"> <!-- .myClass1 { text-decoration:underline; } .myClass2 { text-decoration:none; } --> </STYLE> <BODY> <P class="myClass1">Этот текст подчеркнутый</P> <P class="myClass2">А этот нет</P> </BODY> </HTML>

 

Результат этого примера будет выглядеть вот так:

Этот текст подчеркнутый

А этот нет

 

Таким образом, мы познакомились со свойством text-decoration. Оно может иметь следующие значения:

  • none - обычный текст

  • underline- подчеркнутый текст.

  • overline - текст подчеркнутый сверху.

  • line-through - зачеркнутый текст.

  • blink - мигающий текст. Что характерно,  в Opera и FireFox частота магания разная, а в IE - данное свойство не работает.

Если нам необходимо задать отступ при начале абзаца ("красная" строка), то воспользуемся свойством  text-indent. Опять же, рассмотрием пример:

<HTML>
<HEAD>
<TITLE>Урок 14. CSS: Текст и его свойства</TITLE>
</HEAD>
<STYLE TYPE="text/css">
<!--
.myClass1 {
text-indent:2 em;
text-align:justify;
}
.myClass2 {
text-indent:1 em;
text-align:justify;
}
-->
</STYLE>
<BODY>

<P class="myClass1">В этом цикле статей будет пошагово описано создание на Delphi приложение
«Мониторинг поисковых запросов». Это приложение предназначено для определения позиции сайта по заданным поисковым запросам. </P>
<P class="myClass1">
И так, пожалуй начнем. Очевидно, для разработки этого приложения нам понадобится знать, как средствами Delphi
соединиться с Web-сайтом и получить с него текст, который отображается в браузере, когда вы набираете URL.
Для этого в Delphi 7 предусмотрен компонент TIdHTTP, он находиться на закладке Indy Clients.
</P>
<P class="myClass2">И так, кладем на форму компоненты TIdHTTP, TEdit, TMemo и TButton. Сразу присвоим им, а так же самой форме нормальные
идентификаторы, отредактировав в Object Inspector-е свойство Name. </P>
<P class="myClass2">
В частности, форму назовем frmMain, поле редактирования edURL (потому что в нем мы будем набирать URL адреса, с которого хотим загрузить
страницу). Поле текста назовем moResult, кнопочку btmExec, сам объект для соединения с сайтом IdHTTP.
</P>
</BODY>
</HTML>

 

И результат примера:

 

 

Впервые в интернете!
Интерактивный курс по созданию и раскрутки коммерческого сайта, интернет магазина.

Автор курса:
Сергей Васильев
 

 Интерактивный курс :
«Создание, поддержка и раскрутка сайта, Интернет магазина. »
Если Вы хотите войти в интернет бизнес и зарабатывать своим интеллектом, научиться создавать сайты и интернет магазины делать графику в Photoshop, в совершенстве овладеть языком HTML и стилями CSS, то Вам необходимо посетить этот сайт.
*Как самому создать сайт, интернет магазин?
*Как делать графику в Photoshop?
*Как изучить HTML, CSS, Dreamweaver?
*Как устанавливать скрипты?
*Как овладеть интернет-программированием?
*Как и на чем сделать свой бизнес в интернете?
*И ещё много другое....
Кликните Сюда, Чтобы Узнать Все Подробности!>>

 

 

 

Вот мы познакомились еще с одним свойством: text-align - выравнивание. возможные значения:

  • left - по левому краю.

  • right - по правому краю.

  • justify - по ширине.

  • center - по центру.

И, напоследок, еще один пример:

 

<HTML>
<HEAD>
<TITLE>Урок 14. CSS: Текст и его свойства</TITLE>
</HEAD>
<STYLE TYPE="text/css">
<!--
.myClass1 {
text-transform:capitalize;
}
.myClass2 {
text-transform:uppercase;
}
.myClass3 {
text-transform:lowercase;
}
-->
</STYLE>
<BODY>

<P class="myClass1">Все слова с заглавной буквы</P>
<P class="myClass2">Все буквы заглавные</P>
<P class="myClass3">ВCE БУКВЫ СТРОЧНЫЕ</P>
</BODY>
</HTML>

 

А вот и результат работы примера:

 

 

В котором мы познакомились со свойством text-transform:, которое может иметь следующие значения:

  • capitalize - каждое слово с заглавной буквы.

  • uppercase - все буквы заглавные

  • lowercase -  все буквы строчные

  • none - обычный текст.

С уважением, Шуравин Александр, e-mail: megabax@rambler.ru, автор оставляет за собой право публиковать в рассылках ваши письма, если в письме прямо неоговорено нежелание его публиковать.

 
В избранное