VirtualMV/CSS/Formatting/Text
From WikiEducator
< VirtualMV | CSS | Formatting
Objectives
- To give examples of the style attribute to format text
Text formatting style settings
Reference: (w3c schools, 2009)[1]
- Aligning text {left|right|center|justify}
- style="text-align: center"
- Background colour
- style="background-color: #DDFFEE"
- Colour
- style="color:#0000FF"
- Emphasising text
- style= "font-weight:bold"
- Fonts/Font family
- style="font-family: menu,Arial"
- Setting margins
- style="margin-right:10px"
- style="margin-left:auto"
Changing the size of text
- Use the relative em setting
- Example: <p style="font-size:1.5em;">This text is 1.5em</p>
- 1em keeps the font the same size, 2em doubles, .5 halves. BAER Urban Alternative Music Magazine (2003)[2] describes text size units.
- Avoid setting text sizes to fixed pixel sizes as they will not resize for a user (accessibility issue)
Examples
If we want to change the colour (color?) of text between two tags we can use the color style for example:
<h3 style="color: #FF0000;text-align: center">This heading 3 is in red and centered</h3> <h4 style="color: #00FF00;font-family: menu,Arial">This heading 4 is in green and in An Arial font</h4> <p style="color: #0000FF;margin-left:20px">This paragraph is in blue with a 20 pixel left margin</p>
Which would display as
This heading 3 is in red and centered
This heading 4 is in green and in An Arial font
This paragraph is in blue with a 20 pixel left margin
References
- ↑ w3schools (2009) CSS text-align Property Retrieved February 26, 2009 from http://www.w3schools.com/CSS/css_text.asp
- ↑ BAER Urban Alternative Music Magazine(2003) BIG BAER Explains CSS Font-Size. Retrieved August 30, 2009 from http://www.bigbaer.com/css_tutorials/css_font_size.htm
|
virtualMV | Superquick wiki guide | Please give me some feedback |
VirtualMV/CSS/Formatting/Text. (2024). In WikiEducator/VirtualMV wiki. Retrieved November 21, 2024, from http:https://wikieducator.org/VirtualMV/CSS/Formatting/Text (zotero)
|
