Мавзу: Cascading Style Sheets. Css стилларини қўллаш. Режа

• Мавзу: Cascading Style
• Sheets.
• CSS стилларини қўллаш.

Режа:

1. CSS – Каскадли стиллар билан ишлаш;

2. CSS қоидаси структураси;

3. Стилларни теглар билан боғлаш усуллари;

6. Меросхўрлик.

5. Гуруҳлаш;

4. Стилларни ҳужжатга боғлаш;

• 1. CSS – Каскадли стиллар билан ишлаш
• Ҳужжатнинг ташқи кўринишини бошқаради
• ҳужжат таркибидаги маълумотларни турли кўринишда ифодалаш
• сайтдаги турли хил ҳужжатлар учун ягона (бир хил) стилни жорий этиш, бу эса вақтни тежашга олиб келади.

• CSS лардан фойдаланиш 1996 йилдан бошланган.
• Ҳозирги кунда CSS3, CSS 4 стандартларидан фойдаланилмоқда

• Стил – бу браузерга аниқ танлаб олинган тегнинг таркибидаги маълумотларни қандай кўринишда чиқаришни кўрсатиб берадиган қоида ҳисобланади.

• Ҳар бир тегнинг ўзига мос хоссалари мавжуд бўлиб, бу хоссалар браузерда кўринишини таъминлайди.

• Бу қоидалар тегнинг бир нечта хоссаларини аниқ қийматлар бўйича олдиндан белгилаб олиш учун қўлланилади.

• Масалан: ранг, шрифт, қаторлар орасидаги интервал, жадвалда жойлашиши, фон ва бошқ.

• h1

• { }

• color: red;

• background: yellow;

• 2. CSS қоидаси структураси

• Селектор

• эълон

• Эълон қилиш блоки

• хосса

• хосса

• қиймат

• қиймат

• эълон

• h1

• { }

• color: red;

• background: yellow;

• Селектор –HTML элементи ҳисобланади– h1, p, em, table
• P {color: silver;} em {background: red;}
• Эълонлар блокида бир ёки бир нечта хоссалар берилиши мумкин. Бунда : ва ; белгилари ва ихтиёрий пробеллар орқали берилади.
• Қиймат – бу бирор калит сўздан иборат хосса қиймати:
• P { font: medium Helvetica; }
• Агар бир хосса қиймати нотўғри киритилса, у ҳолда барча хоссалар бутунлигича инкор этилади (ишламайди).

• 3. Стилларни теглар билан боғлаш усуллари

• Тегга ички жойлаштирилган стил

• Ҳужжат ичидаги стил

• Ташқи файлдаги стил

• Тегнинг ички қисмида тег атрибути сифатида қўлланилади. Бунинг учун style атрибутидан фойдаланилади:
•