Use Stylesheets
Overview
If HTML decides what is on a page, CSS decides how it looks. Cascading Style Sheets let you set the fonts, colours, spacing and alignment of your elements, and the clever part is the word cascading: when several styles could apply to the same element, clear rules decide which one wins. Write your styles once in an external file and you can give a whole website a consistent, professional look from a single place.
In this lesson you will learn the three ways to apply CSS (inline, internal and external) and the order of precedence between them, the syntax of a CSS rule with its selector and declarations, how to target elements, classes and ids, and the properties for fonts, colour, alignment and backgrounds. You will also see why external stylesheets must be linked with relative file paths.
Objectives
- Use CSS in the presentation layer.
- Create the presentation layer of a web page Create generic external styles and inline style attributes including: • background properties including colour, images • font properties • table, table row, table header and table data properties including size, background colour, horizontal and vertical alignment, spacing, padding, borders: including collapsed, colour, thickness, visible/invisible Create classes including: • background properties including colour, images • font properties • table, table row and table data properties including size, background colour, horizontal and vertical alignment, spacing, padding, borders: including collapsed, colour, thickness, visible/invisible Create external styles to be tagged in a web page including h1, h2, h3, p, li Specify the font properties including font family, size, colour, alignment, bold, italic Attach comments to an external stylesheet Save styles in cascading stylesheet format.
- The use of CSS in the presentation layer.
- Characteristics of cascading stylesheets including the difference between attached stylesheets and inline style attributes, the hierarchy of multiple attached stylesheets and inline styles within a web page Characteristics of a style and a class including the difference between them Reason relative file paths must be used for attached stylesheets.
Audio Lesson
Listen to this lesson in the app
Mind map
This topic is mapped out so you can see how the ideas connect.
Open the mind map in the app
Flashcards
Quick recall practice on the facts this topic is tested on.
Practise these cards in the app
Lesson Note
Complete Note Available on the Green Bridge App
Get the Green Bridge CBT app on your phone or computer for the complete IGCSE library: past papers, mark schemes, mind maps, flashcards and audio lessons.
Lesson Evaluation
Congratulations on completing the lesson on Use Stylesheets. Now that youve explored the key concepts and ideas, its time to put your knowledge to the test. This section offers a variety of practice questions designed to reinforce your understanding and help you gauge your grasp of the material.
You will encounter a mix of question types, including multiple-choice questions, short answer questions, and essay questions. Each question is thoughtfully crafted to assess different aspects of your knowledge and critical thinking skills.
Use this evaluation section as an opportunity to reinforce your understanding of the topic and to identify any areas where you may need additional study. Don't be discouraged by any challenges you encounter; instead, view them as opportunities for growth and improvement.
- Which way of applying CSS lets one file style many web pages at once? A. Inline style B. Internal style C. External stylesheet D. A comment Answer: C
- If an inline style and an attached stylesheet set the same property, which is used? A. The attached stylesheet B. The inline style C. Neither D. A random one Answer: B
- In the CSS rule p {color:#0000ff;}, the part 'p' is the: A. Property B. Value C. Selector D. Declaration Answer: C
- How is a class called right applied to a paragraph in the HTML?
A.
B.
C.
D.
Answer: B
- In a font-family list, the generic font family (such as sans-serif) should be placed: A. First B. Last C. In the middle D. In a separate rule Answer: B
Work through these questions in the app
Work through these questions in the app
Recommended Books
Practice Mock Questions
Want to practice mock questions on Use Stylesheets? Download the Green Bridge CBT app to access mock questions and full practice assessments for this topic.
Download The App On Google Playstore
Everything you need to excel in your exams
