Мавзу: css кириш. Htmlга уланиш усуллари. Селектор турлари. Режа

• Мавзу: CSS кириш.
• HTMLга уланиш усуллари.
• Селектор турлари.

Режа:

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

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

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

6. Ўлчов бирликлар.

5. Гуруҳлаш. Меросхўрлик;

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

• 1 ta CSS hujjat orqali barcha HTML hujjatlarni tashqi ko‘rinishini o‘zgartiradi

• CSS-Cascading style sheets-
• Стилларнинг каскадли жадваллари

• 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. Стилларни теглар билан боғлаш усуллари

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

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

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

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