5.1 Атрибутът стил на таг
И още няколко полезни неща за HTML. Тъй като мрежата започна да набира популярност, имаше нарастващо търсене уеб страниците да бъдат красиво or много красиво проектирани. Този проблем беше решен с помощта на style .
Общата форма на този атрибут има следния формат:
<tag style="name=value;name2=value2;nameN=valueN">Стойността на атрибута, разделена styleс точка и запетая, изброява всички "стилове", които трябва да бъдат приложени към етикета.
Да приемем, че искате да покажете изображение като квадрат 100*100и да го направите наполовина прозрачно. За да направите това, трябва да добавите специални стилове към него:
- ширина=100px;
- височина=100px;
- непрозрачност=0,5;
Тогава HTML codeът с това изображение ще изглежда така:
<img src="logo.png" style="width=100px;height=100px;opacity=0.5">Има стотици, ако не и хиляди стилове. И разработчиците на браузъри постоянно измислят нови. Хубаво е, че учиш за Java разработчик, а не за уеб дизайнер :)
5.2 Популярни CSS стилове
Малко вероятно е да пишете много HTML code or да редактирате неговите стилове в живота си, но всичко може да се случи. Например, вие пишете няколко малки HTML страници, за да тествате API. Следователно познаването на основните стилове HTMLможе да бъде полезно.
По-долу са 10-те най-често срещани за бекенд разработчиците:
| # | Име | Пример | Описание |
|---|---|---|---|
| 1 | ширина | ширина: 100px | ширина на елемента в пиксели |
| 2 | височина | височина: 50% | височина на елемента като процент (от ширината на родителя) |
| 3 | дисплей | дисплей: няма | елемент за показване (не показвайте елемент) |
| 4 | видимост | видимост: скрит | видимост на елемента (елементът е скрит, но за него е запазено място) |
| 5 | цвят | цвят: червен; | цвят на текста |
| 6 | Цвят на фона | цвят на фона: дим | Цвят на фона |
| 7 | граница | рамка: 1px плътно черно; | рамка (ширина 1 пиксел, цвят черен, плътна линия) |
| 8 | шрифт | шрифт: verdana 10pt | шрифт: verdana, размер 10pt |
| 9 | подравняване на текст | подравняване на текст: център; | хоризонтално подравняване на текста |
| 10 | марж | margin:2px | подложка извън елемента |
Не е нужно да помните тези етикети, всичко е в Интернет. Освен това всеки "стил" има свой собствен набор от валидни стойности и собствен формат за описание на стойността. Вижте поне borderor font.