Empowering Today’s Learners to Become Tomorrow’s Leaders
The following is the syntax of a style rule for embedded and external styles.
It includes the HTML element as the selector and the declaration (property and value)
The CSS syntax is made up of three parts: a selector, a property and a value
selector {property: value; property: value;}
h1{color:red; text-align:center; }
h1 is the selector
color and text-align are the properties
color has the value red
text-align has the value center
h1{
color:red;
text-align:center;
}
It is easier on the eyes to read the code in this vertical layout, but the code would work just the same if laid horizontally as in the example further above. Like HTML, extra spaces and lines in in the text version of the code do not effect how the browser interprets the code.
Enter the selector you want to define characteristics for, such as h1
Use the { bracket to start the rule
Use } to end the rule
Inside the brackets, list the characteristics you want the tag to use
List the property
Use the colon (:) to separate the property from its value
List the value
Use a semi-colon (;) to separate each characteristic.
Special Notes
With two different types of brackets now involved in the code that you are learning, it might be worth taking a look at the various types of brackets that exist on your keyboard and how they are typically referred to in the English language:
( ) — parentheses, round brackets, open brackets, soft brackets, close brackets or simply brackets
[ ] — square brackets, closed brackets, hard brackets, or brackets (US)
{ } — French brackets, curly brackets, definite brackets, swirly brackets, curly braces, birdie brackets, Scottish brackets, squirrelly brackets, braces, gullwings, seagull, or fancy brackets
< > — chevrons, inequality signs, pointy brackets, or brackets, broken brackets or brokets. Also, they are sometimes referred to as angle brackets in the context of html markup.