They are the only way your browser can know when one declaration ends and the next begins. However, keep in mind that your browser will definitely get confused if you leave out the semi-colons that end each declaration. You can add just one ruleset to your stylesheet: #header For example, let's say you wanted to make some changes to the main header to which you attached the #header id. Now that you've see a few different CSS declarations, it's also important to note that a ruleset can include more than one declaration at once. For example: text-align: center Multiple Declarations
You can use the CSS text-align declaration to change the alignment of your selected text, and the values are predictable: left, right, justify, or center. By default, your browser will display any text you add to your page as left-aligned, just like you would read it in a book: There are a few different ways to specify the boldness of your chosen font, but the simplest is just a single-word value: font-weight: bold Alignmentįinally, you may also want to change the alignment of your text. For example, the CSS font-weight declaration can be used not only to make your selected text bold, but also to specify how bold it should be. However, you can also use CSS to accomplish the same things. You used the and HTML elements to mark certain sections of text as being italic or bold. Below are some of the most common web safe fonts that you can use on any website: For now, though, stick with the built-in fonts that we suggest, because most browsers will recognize them. Not every browser will recognize every font, and you can even add new fonts to a webpage that your browser doesn't recognize by default. You can also give the font-family declaration a value that specifics only a generic type of font, such as sans-serif or monospace, and your browser will change it to a fitting default. To change your webpage's font, you can use the CSS font-family declaration to specify what font you want to use instead. You've probably seen that font many times in many different contexts, but most webpages will make an effort to move away from Times New Roman, even if only to make themselves look more unique than the default. When no font is specified, most browsers display text in the Times New Roman font. One of the simplest ways to make a major change to the look of the text on a webpage is to change the font.
A pixel in CSS is an abstract unit of measurement that should look about the same size on any device, while the physical pixels on a screen can vary widely between devices. It's also important to note that 1px in CSS does not necessarily correspond to 1 physical pixel on your device screen. For simplicity's sake, though, we'll mostly be sticking to pixels (px) for these tutorials. You can also use a number of other measurements in the font-size declaration to change your text size, such as percentages and relative measurements. However, knowing that the browser's default is about 16px means that you can make some assumptions, like that adding a font-size: 18px declaration will make your text a little bit bigger, as you saw.
You probably won't have any frame of reference for how big or small 18px is just by reading the number.
If you want your text to be bigger or smaller, though, you can use the CSS font-size declaration to set the size to whatever you want.įor example, you already have one font-size declaration in your styles.css file: font-size: 18px For most browsers, that size is about 16px, which is short for 16 pixels. When you add text to a webpage-a element, for example-there is a default size at which your browser will display it.