Презентація 3-2. Основи CSS.pdf
- 1. CSS (Cascading Style Sheets, каскадні таблиці стилей) • Призначені — для оформлення (і дозволяють виділити задачі оформлення від логіки документа)
- 2. Зліва — без стилей, зправа — та ж сторінка із CSS-стилями
- 3. Основні можливості та функції CSS • Відокремлюють оформлення від змісту • Різне оформлення — для різних пристроїв і носіїв • Прискорюють роботу сайтів • Один стиль на цілу множину документів (виправлення вносяться в один файл, а проявляються на всьому сайті)
- 4. Приклад CSS кода h1 { color: #dd0000; text-align: center; } p { margin-left: 20px; font-family: sans-serif; } strong { color: green; font-size: 133%; }
- 5. Початкова сторінка (без CSS)
- 7. Способи підключення CSS: глобальний стиль документа
- 8. Способи подключения CSS: вбудовані (inline) стилі
- 9. Способи підключення CSS: зв’язні стилі
- 10. Типи носіїв • all — всі типи • screen — дисплей монітора • print —версія для друку
- 11. Підключення стилю для конкретного типа носія
- 12. Селектори Селектор — вказівник на елемент або групу елементів, до яких має бути застосовий визначений стиль. селектор { властивість: значення; властивість: значення; … }
- 13. Типи селекторів • Селектори тегів (p, h1 і т.д.) • Класи • Ідентифікатори
- 14. Класи До останнього абзацу застосовано зразу два стилі, їх дія комбінується
- 16. Идентифікатори Кожен ідентифікатор повинен бути унікальним всередині документа
- 18. Властивості і їх значення http://htmlbook.ru/css
- 19. Загальні властивості для кількох селекторів h1, #about, .s1 { color: red; } p, .s1 { font-family: sans-serif; font-weight: bold; } До одного набора властивостів можна прив’язувати декяілька селекторів, перерахувавши їх через кому. У прикладі клас s1 володітиме зразу троьма властивостями: червоний колір, шрифт - sans-serif, жирне відображення.