Html font color attribute

HTML Colors — RGB Values

This color value is specified using the rgb( ) property. This property takes three values, one each for red, green, and blue. The value can be an integer between 0 and 255 or a percentage.

Following is a list to show few colors using RGB values.

Color	Color RGB
	rgb(0,0,0)
	rgb(255,0,0)
	rgb(0,255,0)
	rgb(0,0,255)
	rgb(255,255,0)
	rgb(0,255,255)
	rgb(255,0,255)
	rgb(192,192,192)
	rgb(255,255,255)

Example

Here are the examples to set background of an HTML tag by color code using rgb() values −

<!DOCTYPE html>
<html>

   <head>
      <title>HTML Colors by RGB code</title>
   </head>
	
   <body text = "rgb(0,0,255)" bgcolor = "rgb(0,255,0)">
      <p>Use different color code for for body and table and see the result.</p>
      
      <table bgcolor = "rgb(0,0,0)">
         <tr>
            <td>
               <font color = "rgb(255,255,255)">This text will appear white on black background.</font>
            </td>
         </tr>
      </table>
   </body>
   
</html>

Ссылки. Все о работе с ссылками.

Вы научитесь делать ссылки(гиперссылки). Они нужны нам для того, чтобы пользователь смог загружать другие страницы вашего сайта, картинки, другие сайты. Короче с помощью ссылки пользователь сможет гулять по вашим страничкам. А теперь рассмотрим тэг определяющий ссылку.

<a></a> — тэг ссылки<a href=»ссылка»>Текст</a>в атрибуте href пишите ссылку на страницу или сайт. Между тэгом <a> вот тут </a> пишется текст. При клике на этот текст пользователь попадет на страничку или сайт написанный вами в атрибуте href.

Ссылки бывают разные. Пример ссылок.

<a href=»страничка»>Ваш текст</a>Пример: <a href=»index.htm»>Главная страничка</a>

Этот пример ссылки показывает, что ссылка стоит на страничку index.htm, которая находится в одной папке с этой страничкой.

<a href=»имя папки/страничка»>Ваш текст</a>Пример: <a href=»about/index.htm»>Обо мне</a>

Этот пример ссылки показывает, что ссылка стоит на страничку index.htm в папке about, которая находится в одной папке с этой страничкой.

<a href=»../страничка»>Назад</a>Пример: <a href=»../08.htm»>Назад</a>

Тут ссылка стоит на страничку, которая находится в папке, в которой находится попка с этой страничкой. Разбираемся…

<a href=»сайт»>Ваш текст</a>Пример: <a href=»http://www.maxtorg.ru»>Мой сайт</a>

Этот пример ссылки показывает, что ссылка стоит на сайт www.maxtorg.ru.

Ссылки можно открыть в новом окне. Для этого нужен атрибут target.

<a href=»ссылка» target=»_blank»>Текст ссылки</a>Пример: <a href=»friends.html» target=»_blank»>Мои друзья</a>

Чтобы открыть ссылку в новом окне, как я уже говорил, нужен атрибут target который равен «_blanck»(target=»_blank»). Он пишется в тэге <a target=»_blank»></a>

Так же можно установить закладку. Для установления закладки нужно, в том месте, где ты хочешь поставить закладку написать:

<a name=»имя закладки»>Тут можете написать текст, но не обязательно</a>Пример: <a name=»top»></a>

Закладку мы поставили, а теперь нужно сделать на нее ссылку чтобы на нее попасть. Делается это следующим образом:

<a href=»имя вашей закладки, на которую нужно перейти»>Текст</a>Пример: <a href=»#top»>Вверх</a>

Когда пишете ссылку на закладку нужно перед именем закладки поставить знак # (переключиться на английский и нажать SHIFT+3).

<a href=»mailto:ваш ящик»>Напишите мне</a>Пример: <a href=»[email protected]»>Напишите мне</a>

Замените [email protected] на ваш ящик и все. Mailto: должно быть всегда, если делаете ссылку на ящик.

Если вы делаете ссылку, то она будет синего цвета. Ссылка, по которой уже заходили будет красного цвета. Активная ссылка будет зеленого цвета. Чтобы изменить эти цвета вам нужны атрибуты тэга <body>, новые для вас: link=»цвет ссылки», vlink=»цвет» и alink=»цвет». А пишутся они так.

В этом примере цвет ссылки будет красный, цвет ссылки которую уже посещали будет желтый, цвет активной ссылки будет зеленый.

Итак, перейдем к примерам. Для этого вам нужно создать папку(пусть будет: мой сайт), в ней еще папку с именем about. В первой папке создайте 3 HTML документы с именем texts.html, anekdots.html, other.html. В папке about создайте HTML документ с именем index.html. Содержимое документов придумайте сами. Это вы уже умеете.

А теперь напишите следующий текст в блокноте.

Transparency

You can also use alpha to specify the level of opacity the color should have. This is only available on and notations. To do this, add the letter «a» to the functional notation (i.e. and ). For example, results in a semi-transparent blue, as does .

Here’s an example of using RGBA to change the opacity.

<h3 style=»background-color:rgba(0,0,255,1)»>No transparancy</h3>
<h3 style=»background-color:rgba(0,0,255,0.5)»>Half transparancy</h3>
<h3 style=»background-color:rgba(0,0,255,0.1)»>Lots of transparancy</h3>

Here’s an example of using HSLA to change the opacity.

<h3 style=»background-color:hsla(240, 100%, 50%, 1)»>No transparancy</h3>
<h3 style=»background-color:hsla(240, 100%, 50%, 0.5)»>Half transparancy</h3>
<h3 style=»background-color:hsla(240, 100%, 50%, 0.1)»>Lots of transparancy</h3>

6.16 Frame target names

Except for the reserved names listed below, frame target names ( in the DTD) must
begin with an alphabetic character (a-zA-Z). User agents should ignore all
other target names.

The following target
names are reserved and have special meanings.

_blank: The user agent should load the designated document in a new, unnamed
window.
_self: The user agent should load the document in the same frame as the element
that refers to this target.
_parent: The user agent should load the document into the immediate parent of the current frame. This value is equivalent to
_self if the current frame has no parent.
_top: The user agent should load the document into the full, original window
(thus canceling all other frames). This value is equivalent to _self
if the current frame has no parent.

previous
next elements
attributes index

6.6 Lengths

HTML specifies three types of length values for attributes:

Pixels: The value ( in
the DTD) is an integer that represents the number of pixels of the canvas
(screen, paper). Thus, the value «50» means fifty pixels. For normative
information about the definition of a pixel, please consult .
Length: The value ( in
the DTD) may be either a %Pixel; or a percentage of the available horizontal or
vertical space. Thus, the value «50%» means half of the available space.
MultiLength: The value (
in the DTD) may be a %Length; or a
relative length. A relative length has the form «i*», where
«i» is an integer. When allotting space among elements competing for that
space, user agents allot pixel and percentage lengths first, then divide up
remaining available space among relative lengths. Each relative length receives
a portion of the available space that is proportional to the integer preceding
the «*». The value «*» is equivalent to «1*». Thus, if 60 pixels of space are
available after the user agent allots pixel and percentage space, and the
competing relative lengths are 1*, 2*, and 3*, the 1* will be alloted 10
pixels, the 2* will be alloted 20 pixels, and the 3* will be alloted 30
pixels.

Length values are

Using Internal CSS

If we want to change the color of a text using an internal cascading stylesheet which is to be displayed on a web page, we have to follow the steps which are given below. Using these steps, we can easily change the color of text.

Step 1: Firstly, we have to type the Html code in any text editor or open the existing Html file in the text editor in which we want to use the internal CSS for changing the color of a text.

<!Doctype Html>
<Html>
<Head>
<Title>
Change color using Internal CSS
</Title>
</Head>
<Body>
This page helps you to understand how to change the color of a text.
In this Section, we used the internal CSS for changing the text color.
</Body>
</Html>

Step 2: Now, we have to place the cursor in the head tag of the Html document and then define the styles inside the <style> tag as shown in the following block. And, then type the color attribute into the element selector.

<Head>
<style>
Body
{
color:orange;
}
p
{
color:green;
}
</style>
</Head>

Step 3: Now, we have to type the defined element selector before the text whose color we want to change.

<!Doctype Html>
<Html>
<Head>
<Title>
Change color using Internal CSS
</Title>
<style>
Body
{
color:orange;
}
p
{
color:green;
}
</style>
</Head>
<Body>
This page helps you to understand how to change the color of a text.
<p>
In this Section, we used the internal CSS for changing the text color.
</p>
</Body>
</Html>

Test it Now

The output of the above Html code is shown in the following screenshot:

Next TopicHow to Change Background Color in Html

← prev
next →

Browser Safe Colors

Here is the list of 216 colors which are supposed to be safest and computer independent colors. These colors very from hexa code 000000 to FFFFFF and they will be supported by all the computers having 256 color palette.

000000	000033	000066	000099	0000CC	0000FF
003300	003333	003366	003399	0033CC	0033FF
006600	006633	006666	006699	0066CC	0066FF
009900	009933	009966	009999	0099CC	0099FF
00CC00	00CC33	00CC66	00CC99	00CCCC	00CCFF
00FF00	00FF33	00FF66	00FF99	00FFCC	00FFFF
330000	330033	330066	330099	3300CC	3300FF
333300	333333	333366	333399	3333CC	3333FF
336600	336633	336666	336699	3366CC	3366FF
339900	339933	339966	339999	3399CC	3399FF
33CC00	33CC33	33CC66	33CC99	33CCCC	33CCFF
33FF00	33FF33	33FF66	33FF99	33FFCC	33FFFF
660000	660033	660066	660099	6600CC	6600FF
663300	663333	663366	663399	6633CC	6633FF
666600	666633	666666	666699	6666CC	6666FF
669900	669933	669966	669999	6699CC	6699FF
66CC00	66CC33	66CC66	66CC99	66CCCC	66CCFF
66FF00	66FF33	66FF66	66FF99	66FFCC	66FFFF
990000	990033	990066	990099	9900CC	9900FF
993300	993333	993366	993399	9933CC	9933FF
996600	996633	996666	996699	9966CC	9966FF
999900	999933	999966	999999	9999CC	9999FF
99CC00	99CC33	99CC66	99CC99	99CCCC	99CCFF
99FF00	99FF33	99FF66	99FF99	99FFCC	99FFFF
CC0000	CC0033	CC0066	CC0099	CC00CC	CC00FF
CC3300	CC3333	CC3366	CC3399	CC33CC	CC33FF
CC6600	CC6633	CC6666	CC6699	CC66CC	CC66FF
CC9900	CC9933	CC9966	CC9999	CC99CC	CC99FF
CCCC00	CCCC33	CCCC66	CCCC99	CCCCCC	CCCCFF
CCFF00	CCFF33	CCFF66	CCFF99	CCFFCC	CCFFFF
FF0000	FF0033	FF0066	FF0099	FF00CC	FF00FF
FF3300	FF3333	FF3366	FF3399	FF33CC	FF33FF
FF6600	FF6633	FF6666	FF6699	FF66CC	FF66FF
FF9900	FF9933	FF9966	FF9999	FF99CC	FF99FF
FFCC00	FFCC33	FFCC66	FFCC99	FFCCCC	FFCCFF
FFFF00	FFFF33	FFFF66	FFFF99	FFFFCC	FFFFFF

Color Names

In the above examples, I used color names to specify the colors.

You can specify a color by its name (eg, ), its hexadecimal value (eg, ), RGB value (eg ), or its HSL value (eg ).

Beginners may find it easier to specify colors by their color name, as color names are probably a lot easier to remember than the other options. Although color names are easier to remember, the hexadecimal, RGB, and HSL notations provide you with more color options.

Hexadecimal color codes are a combination of letters and numbers. The numbers go from 0 to 9 and the letters go from A to F. When using hexadecimal color values in your HTML/CSS, you precede the value with a hash (#). Although hexadecimal values may look a little weird at first, you’ll soon get used to them.

If you use graphics software, such as Adobe Photoshop or GIMP, you might be used to the RGB or HSL methods.

The chart below shows some examples of color names, along with their corresponding hexadecimal and RGB values.

Color Name	Hex Code RGB	Decimal Code RGB
Black		0,0,0
Silver	C0C0C0	192,192,192
Gray		128,128,128
White	FFFFFF	255,255,255
Maroon		128,0,0
Red	FF0000	255,0,0

Color Name	Hex Code RGB	Decimal Code RGB
Purple		128,0,128
Fuchsia	FF00FF	255,0,255
Green		0,128,0
Lime	00FF00	0,255,0
Olive		128,128,0
Yellow	FFFF00	255,255,0

Color Name	Hex Code RGB	Decimal Code RGB
Navy		0,0,128
Blue	0000FF	0,0,255
Teal		0,128,128
Aqua	00FFFF	0,255,255

This table is a small sample of the enormous range of colors available in HTML. To see more, check out HTML Color Codes.

You can make up your own colors by simply entering any six digit hexadecimal value (preceded by a hash).

In the following example, we specify the same color using three different methods. The resulting color is the same.

<h3 style=»color:blue»>Color Name</h3>
<h3 style=»color:#0000ff»>Hexadecimal</h3>
<h3 style=»color:rgb(0,0,255)»>RGB Value</h3>

If we wanted to change to a different shade of blue, we could change our value slightly like this:

<h3 style=»color:steelblue;»>Color Name</h3>
<h3 style=»color:#4682B4;»>Hexadecimal</h3>
<h3 style=»color:rgb(70,130,180)»>RGB Value</h3>

6.5 Colors

The attribute value type «color» () refers to color definitions as
specified in . A color value may either be a hexadecimal number
(prefixed by a hash mark) or one of the following sixteen color names. The
color names are

**Color names and sRGB values**
	Black = «#000000»		Green = «#008000»
	Silver = «#C0C0C0»		Lime = «#00FF00»
	Gray = «#808080»		Olive = «#808000»
	White = «#FFFFFF»		Yellow = «#FFFF00»
	Maroon = «#800000»		Navy = «#000080»
	Red = «#FF0000»		Blue = «#0000FF»
	Purple = «#800080»		Teal = «#008080»
	Fuchsia = «#FF00FF»		Aqua = «#00FFFF»

Thus, the color values «#800080» and «Purple» both refer to the color
purple.

6.5.1 Notes on using colors

Although colors can add significant amounts of information to documents and
make them more readable, please consider the following guidelines when
including color in your documents:

The use of HTML elements and attributes for specifying color is . You are encouraged to use style sheets instead.
Don’t use color combinations that cause problems for people with color
blindness in its various forms.
If you use a background image or set the background color, then be sure to
set the various text colors as well.
Colors specified with the and elements and on tables look different
on different platforms (e.g., workstations, Macs, Windows, and LCD panels vs.
CRTs), so you shouldn’t rely entirely on a specific effect. In the future,
support for the color model together with ICC color profiles should
mitigate this problem.
When practical, adopt common conventions to minimize user confusion.

Списки, нумерация.

Есть несколько видов списков.

Для списков используется тэг <ul></ul>, а для нумерации <ol></ol>.текст 1 текст 2 <ul><li type=»disk»>текст 1</li><li type=»disk»>текст 2</li></ul>

У списков так же есть атрибут type (тип) и его свойства disk, circle, square, для данного вида используется свойство disk (type=»disk»).

Просто меняйте значение type на disk, circle или square и вид изменится. Так же можно менять шрифт текста, размер, цвет. Это уже за вами. Вы это все умеете.

Теперь нумерация.

текст 1 текст 2 <ol><li type=»1″>текст 1</li><li type=»1″>текст 2</li></ol>

У тэга li в тэге ol тоже есть атрибут type, но с другими значениями — I, i, A, a, 1. В данном примере используется значение по умолчанию (type=»1″).

Просто заменяйте значение type на I, i, 1, A, a и вид изменится.

Создаем простую таблицу.

Иногда без таблиц даже не обойтись. Сейчас, почти все профессиональные сайты сделаны из таблиц. И мы будем учиться создавать их. Таблица задается тэгом <table></table>.Так же таблицы состоят из строк и столбцов. Строка таблицы задается тэгом <tr></tr>, столбец(ячейка) таблицы задается тэгом <td></td>.

Давайте создадим простую таблицу.Для начала создадим новую страницу. Напечатайте обязательные тэги. Сохраните в файл. Назовем его table1.html. Теперь между тэгами <body> и </body> напечатайте следующий текст.<table><tr><td bgcolor=»#808080″>текст</td><td bgcolor=»#FF9900″>текст</td><td bgcolor=»#808080″>текст</td></tr><tr><td bgcolor=»#FF9900″>текст</td><td bgcolor=»#808080″>текст</td><td bgcolor=»#FF9900″>текст</td></tr></table>У вас должно получиться что-то вроде этого:

<html><head><head><body><table><tr><td bgcolor=»#808080″>текст</td><td bgcolor=»#FF9900″>текст</td><td bgcolor=»#808080″>текст</td></tr><tr><td bgcolor=»#FF9900″>текст</td><td bgcolor=»#808080″>текст</td><td bgcolor=»#FF9900″>текст</td></tr></table> </body></html>

Поздравляю, Вы ознакомились с основными командами языка HTML.

6.11 Dates and times

allows many options and variations in the representation of dates
and times. The current specification uses one of the formats described in the
profile for its definition of legal date/time strings (
in the DTD).

The format is:

  YYYY-MM-DDThh:mm:ssTZD

     YYYY = four-digit year
     MM   = two-digit month (01=January, etc.)
     DD   = two-digit day of month (01 through 31)
     hh   = two digits of hour (00 through 23) (am/pm NOT allowed)
     mm   = two digits of minute (00 through 59)
     ss   = two digits of second (00 through 59)
     TZD  = time zone designator

The time zone designator is one of:

Z: indicates UTC (Coordinated Universal Time). The «Z» must be uppercase.
+hh:mm: indicates that the time is a local time which is hh hours and
mm minutes ahead of UTC.
-hh:mm: indicates that the time is a local time which is hh hours and
mm minutes behind UTC.

Exactly the components shown here must be present, with exactly this
punctuation. Note that the «T» appears literally in the string (it
must be uppercase), to indicate the beginning of the time element, as specified
in

If a generating application does not know the time to the second, it may use
the value «00» for the seconds (and minutes and hours if necessary).

Note. does not
address the issue of leap seconds.

HTML Colors — Hex Codes

A hexadecimal is a 6 digit representation of a color. The first two digits(RR) represent a red value, the next two are a green value(GG), and the last are the blue value(BB).

A hexadecimal value can be taken from any graphics software like Adobe Photoshop, Paintshop Pro or MS Paint.

Each hexadecimal code will be preceded by a pound or hash sign #. Following is a list of few colors using hexadecimal notation.

Color	Color HEX
	#000000
	#FF0000
	#00FF00
	#0000FF
	#FFFF00
	#00FFFF
	#FF00FF
	#C0C0C0
	#FFFFFF

Example

Here are the examples to set background of an HTML tag by color code in hexadecimal −

<!DOCTYPE html>
<html>

   <head>
      <title>HTML Colors by Hex</title>
   </head>
	
   <body text = "#0000FF" bgcolor = "#00FF00">
      <p>Use different color hexa for for body and table and see the result.</p>
      
      <table bgcolor = "#000000">
         <tr>
            <td>
               <font color = "#FFFFFF">This text will appear white on black background.</font>
            </td>
         </tr>
      </table>
   </body>
   
</html>

6.4 URIs

This specification uses the term URI as defined in (see also ).

Note that URIs include URLs (as defined in and ).

Relative URIs are resolved to full URIs using a base URI. , section 3, defines the normative algorithm for this process. For
more information about base URIs, please consult the section on in the chapter on links.

URIs are represented in the DTD by the parameter entity .

URIs in general are
There may be URIs, or parts of URIs, where case doesn’t matter (e.g., machine
names), but identifying these may not be easy. Users should always consider
that URIs are case-sensitive (to be on the safe side).

Please consult the appendix for information about .

6.12 Link types

Authors may use the following recognized link
types, listed here with their conventional interpretations. In the
DTD, refers to a
space-separated list of link types. White space characters are not permitted
within link types.

These link types are i.e., «Alternate» has the same meaning as
«alternate».

User agents, search engines, etc. may interpret these link types in a
variety of ways. For example, user agents may provide access to linked
documents through a navigation bar.

Alternate: Designates substitute versions for the document in which the link occurs.
When used together with the attribute, it implies a translated
version of the document. When used together with the attribute, it implies a version designed for a different
medium (or media).
Stylesheet: Refers to an external style sheet. See the section on for details.
This is used together with the link type «Alternate» for user-selectable
alternate style sheets.
Start: Refers to the first document in a collection of documents. This link type
tells search engines which document is considered by the author to be the
starting point of the collection.
Next: Refers to the next document in a linear sequence of documents. User agents
may choose to preload the «next» document, to reduce the perceived load
time.
Prev: Refers to the previous document in an ordered series of documents. Some
user agents also support the synonym «Previous».
Contents: Refers to a document serving as a table of contents. Some user agents also
support the synonym ToC (from «Table of Contents»).
Index: Refers to a document providing an index for the current document.
Glossary: Refers to a document providing a glossary of terms that pertain to the
current document.
Copyright: Refers to a copyright statement for the current document.
Chapter: Refers to a document serving as a chapter in a collection of
documents.
Section: Refers to a document serving as a section in a collection of
documents.
Subsection: Refers to a document serving as a subsection in a collection of
documents.
Appendix: Refers to a document serving as an appendix in a collection of
documents.
Help: Refers to a document offering help (more information, links to other
sources information, etc.)
Bookmark: Refers to a bookmark. A bookmark is a link to a key entry point within an
extended document. The attribute may be used, for example, to
label the bookmark. Note that several bookmarks may be defined in each
document.

Authors may wish to define additional link
types not described in this specification. If they do so, they
should use a to cite the
conventions used to define the link types. Please see the attribute of the element for more
details.

For further discussions about link types, please consult the section on links in HTML documents.

Специальные символы.

Они нам нужны для того, чтобы писать символы типа < > & » и пробел. А вы спросите: А почему просто не поставить < или >? А потому-то и нельзя, потому что, как мы уже знаем, символ < и > используются при написании тэгов. Если вы напишете: Я сравнил 1 < 100 > 20, то у вас < 100 > будет как тэг. И что у вас получится? Так вот для чего они и нужны. Список этих символов ниже.

< — символ <> — символ > — ставит пробел» — » (кавычка)& — & (амперсант)

Пример: <font color=»#CC0000″><b><u><i>1<100>20</i></u></b></font> = 1<100>20

Запомните. Спецсимволы не пишутся в тэгах. Они как текст.

Вот такой маленький урок получился, но нужно знать(иногда). Линии — очень просто.

Сейчас буду учить вас вставлять линии. Они задаются тэгом <hr> и его не надо закрывать. У них есть несколько атрибутов. Они нижу.

<hr align=»left»>Ну эти атрибуты мы уже знаем, на линию они действуют так же, как и на текст. У линии они такие же, как у тэга <p> (left, right, center) и других.

<hr width=»100%»> или <hr width=»30″>Атрибут width устанавливает ширину линии. Можно задать в процентах или в пикселях.

<hr color=»#CC0000″>Этот атрибут устанавливает цвет линии.

<hr size=»цифра»>Этот атрибут устанавливает толщину линии.

<hr NoShade>Если написать этот атрибут, то у линии не будет тени. Она не будет объемная.

Можно все эти атрибуты использовать вместе.

Border Color

We’ve already seen an example of specifying a color for an element’s border (above). That’s one way of specifying the various border properties.

You can also specify several border properties in one go (rather than separating them into different declarations). You can do this using the shortcut property, which allows you to specify the border’s width, style, and color in one place.

Here’s an example:

<h3 style=»border:1px dashed orange;»>I have a border color.</h3>

Embedded and External Styles

The examples on this page use inline styles. As with all styles, you can also use the embedded method or the external method.

Color Names

In the above examples, I used color names to specify the colors.

You can specify a color by its name (eg, ), its hexadecimal value (eg, ), RGB value (eg ), or its HSL value (eg ).

If you use graphics software, such as Adobe Photoshop or GIMP, you might be used to the RGB or HSL methods.

The chart below shows some examples of color names, along with their corresponding hexadecimal and RGB values.

Color Name	Hex Code RGB	Decimal Code RGB
Black		0,0,0
Silver	C0C0C0	192,192,192
Gray		128,128,128
White	FFFFFF	255,255,255
Maroon		128,0,0
Red	FF0000	255,0,0

Color Name	Hex Code RGB	Decimal Code RGB
Purple		128,0,128
Fuchsia	FF00FF	255,0,255
Green		0,128,0
Lime	00FF00	0,255,0
Olive		128,128,0
Yellow	FFFF00	255,255,0

Color Name	Hex Code RGB	Decimal Code RGB
Navy		0,0,128
Blue	0000FF	0,0,255
Teal		0,128,128
Aqua	00FFFF	0,255,255

This table is a small sample of the enormous range of colors available in HTML. To see more, check out HTML Color Codes.

You can make up your own colors by simply entering any six digit hexadecimal value (preceded by a hash).

In the following example, we specify the same color using three different methods. The resulting color is the same.

<h3 style=»color:blue»>Color Name</h3>
<h3 style=»color:#0000ff»>Hexadecimal</h3>
<h3 style=»color:rgb(0,0,255)»>RGB Value</h3>

If we wanted to change to a different shade of blue, we could change our value slightly like this:

<h3 style=»color:steelblue;»>Color Name</h3>
<h3 style=»color:#4682B4;»>Hexadecimal</h3>
<h3 style=»color:rgb(70,130,180)»>RGB Value</h3>

Transparency

Here’s an example of using RGBA to change the opacity.

Here’s an example of using HSLA to change the opacity.

Choosing Colors — The Easy Way

By using hexadecimal, RGB, or HSL notation, you have a choice of over 16 million different colors. For example, you can start with and increment by one value all the way up to . Each different value represents a slightly different color.

But don’t worry — you won’t need to remember every single hexadecimal color value! The HTML color picker and color chart make it easy for you to choose colors for your website.

HTML Styles
HTML Links

6.2 SGML basic types

The document type definition specifies the
syntax of HTML element content and attribute values using SGML tokens (e.g.,
PCDATA, CDATA, NAME, ID, etc.). See for their full
definitions. The following is a summary of key information:

CDATA is a sequence of characters from
the document character set and may include character entities. User agents
should interpret attribute values as follows:
- Replace character entities with characters,
- Ignore line feeds,
- Replace each carriage return or tab with a single space.
User agents may ignore leading and trailing white space in CDATA attribute
values (e.g., » myval » may be interpreted as
«myval»). Authors should not declare attribute values with leading or trailing
white space.

For some HTML 4 attributes with CDATA attribute values, the specification
imposes further constraints on the set of legal values for the attribute that
may not be expressed by the DTD.

Although the and elements use CDATA for
their data model, for these elements, CDATA must be handled differently by user agents.
Markup and entities must be treated as raw text and passed to the application
as is. The first occurrence of the character sequence «</» (end-tag open
delimiter) is treated as terminating the end of the element’s content. In valid
documents, this would be the end tag for the element.
ID and NAME tokens must
begin with a letter () and may be followed by any number of letters,
digits (), hyphens («-«), underscores («_»), colons («:»), and periods
(«.»).
IDREF and
IDREFS are references to ID tokens defined by other
attributes. IDREF is a single token and IDREFS is a space-separated list of
tokens.
NUMBER tokens must contain at least
one digit ().

6.1 Case information

Each attribute definition includes information about the
case-sensitivity of its values. The case information is presented
with the following keys:

CS: The value is case-sensitive (i.e., user agents interpret «a» and «A»
differently).
CI: The value is case-insensitive (i.e., user agents interpret «a» and «A» as
the same).
CN: The value is not subject to case changes, e.g., because it is a number or a
character from the document character set.
CA: The element or attribute definition itself gives case information.
CT: Consult the type definition for details about case-sensitivity.

If an attribute value is a list, the keys apply to every value in the list,
unless otherwise indicated.

6.13 Media descriptors

The following is a list of recognized media
descriptors ( in the DTD).

screen: Intended for non-paged computer screens.
tty: Intended for media using a fixed-pitch character grid, such as teletypes,
terminals, or portable devices with limited display capabilities.
tv: Intended for television-type devices (low resolution, color, limited
scrollability).
projection: Intended for projectors.
handheld: Intended for handheld devices (small screen, monochrome, bitmapped
graphics, limited bandwidth).
print: Intended for paged, opaque material and for documents viewed on screen in
print preview mode.
braille: Intended for braille tactile feedback devices.
aural: Intended for speech synthesizers.
all: Suitable for all devices.

Future versions of HTML may introduce new values and may allow parameterized
values. To facilitate the introduction of these extensions, conforming user
agents must be able to parse the
attribute value as follows:

The value is a comma-separated list of entries. For example,

media="screen, 3d-glasses, print and resolution > 90dpi"

is mapped to:

"screen"
"3d-glasses"
"print and resolution > 90dpi"

Each entry is truncated just before the first character that isn’t a US
ASCII letter (ISO 10646 hex 41-5a, 61-7a), digit (hex 30-39), or
hyphen (hex 2d). In the example, this gives:
```
"screen"
"3d-glasses"
"print"
```
A match is then made with the set of media types
defined above. User agents may ignore entries that don’t match. In the example
we are left with screen and print.

Note. Style sheets may include media-dependent
variations within them (e.g., the CSS @media construct). In
such cases it may be appropriate to use «=all».

Using an Inline Style attribute

If we want to change the color of a text using an inline style attribute which is to be displayed on a web page, we have to follow the steps which are given below. Using these steps, we can easily change the color of text.

Step 1: Firstly, we have to type the Html code in any text editor or open the existing Html file in the text editor in which we want to use the style attribute for changing the color of a text.

<!Doctype Html>
<Html>
<Head>
<Title>
Change color using style attribute
</Title>
</Head>
<Body>
This page helps you to understand how to change the color of a text.
And, this section helps you to understand how to change the text color using the style attribute.
</Body>
</Html>

Step 2: Now, move the cursor at the starting of that text whose color we want to change. And then, type the inline style attribute within any element. Here, we use the <p> (paragraph) tag:

<p style=»color: ; «> Any Text

Step 3: In this step, we have to give a name of color as a value. We can give the color name in three forms:

We can type the name of a color
We can also enter the RGB value of a color
We can also enter the hexadecimal value of a color.

Step 4: Then, we have to close the element at the end of the text whose color we want to change.

Step 4: And, at last, save the Html code which changes the text color using the CSS style attribute.

<!Doctype Html>
<Html>
<Head>
<Title>
Change color using style attribute
</Title>
</Head>
<Body>
<p style=»color :red;»>
This page helps you to understand how to change the color of a text.
</p>
<p style=»color :pink; «>
And, this section helps you to understand how to change text color using style attribute.
</p>
</Body>
</Html>

Test it Now

The output of the above code is shown in the following screenshot:

HTML Colors — RGB Values

Example

Ссылки. Все о работе с ссылками.

Transparency

6.16 Frame target names

6.6 Lengths

Using Internal CSS

Browser Safe Colors

Color Names

6.5 Colors

6.5.1 Notes on using colors

Списки, нумерация.

6.11 Dates and times

HTML Colors — Hex Codes

Example

6.4 URIs

6.12 Link types

Специальные символы.

Border Color

Embedded and External Styles

Color Names

Transparency

Choosing Colors — The Easy Way

6.2 SGML basic types

6.1 Case information

6.13 Media descriptors

Using an Inline Style attribute

Похожие записи:

Похожие записи: