Second year 2nd quarter CSBN - CSS, fonts and color
•Download as PPTX, PDF•
0 likes•2,748 views
This document discusses various aspects of fonts and colors in CSS including: 1. How to save a CSS file for the first time by specifying a filename and extension like "ewan.css". 2. Deprecated HTML tags and attributes that are no longer recommended but still supported. 3. Different types of style sheets like external, internal, and inline styles. 4. CSS syntax using selectors, properties, and values. 5. Common font properties like font-family, font-size, font-style, font-weight, and color with allowed values. 6. Additional text properties like text-align, text-decoration, letter-spacing, word-spacing and line-height.
Recommended
More Related Content
Similar to Second year 2nd quarter CSBN - CSS, fonts and color
Similar to Second year 2nd quarter CSBN - CSS, fonts and color (20)
Recently uploaded
Recently uploaded (20)
Second year 2nd quarter CSBN - CSS, fonts and color
- 1. Lesson 3: Experimenting with Fonts and Colors The filename “ewan” in Notepad was saved in CSS file. If you are going to save the css file for the first time, type “filename.css” (for example “ewan.css”).
- 2. Deprecated Tags and Attributes Deprecated – a deprecated element or attribute is one that has been outdated; it may become obsolete in the in the future but browsers should continue to support it for backward compatibility <center> - Centers text <u> - Underlines text <s> or <strike> - Defines strikethrough text <font> - Identifies font characteristics Style Sheet Associations External Style Sheet – a separate document or file where all the style sheet information are stored Internal Style Sheet – stores style information in your HTML document’s <head> tag and no external file is required for the style sheet to work. In-Line Style Sheet – stores information inside an HTML tag and, just like the internal style sheet, does not require an external file.
- 3. Style Sheet Syntax selector { property: value } Where selector – the HTML tag you want to define property and value – attribution or declaration, both are separated by colon (:) Typeface – another name for font Property and Value Usage 1. font-family = the font that your text will be in. Allowed value for font-family: Arial, Lucida Console, Monotype Corsiva, Tahoma, Times New Roman Example 1: h1 { font-family: arial; } Example 2: h1 { font-family: “Monotype Corsiva”, Tahoma, arial; }
- 4. 2. font-size Allowed value for font-size: The Old 7 Size Font System: xx-small; x-small; small; medium; large; x-large; xx-large; (the default size is medium) larger; or smaller; % - percent relative to the default font size of the browser (e.g. 150%) pt – point size, the font-sizing system of Windows (e.g. 22pt) em – where the size of the font is multiplied by value of the number (e.g. 1em = 100% font size and 1.5em = 150% font size) 3. font-style Allowed value for font-style: italic; normal; and oblique 4. font-weight Allowed value for font-weight: normal; lighter; bold; bolder 100 to 900 (100 = lightest & 900 = boldest, 400 is the default)
- 5. 5. color Allowed value for color: Aqua; black; blue; fuchsia; gray; green; lime; maroon; navy; olive; purple; red; silver; teal; white; yellow; transparent rgb(n,n,n) Where n = 0 to 255 red = rgb(255,0,0); green = rgb(0,255,0); blue = rgb (0,0,255); black = rgb(0,0,0); white = rgb (255,255,255) c. rgb-hex = #nnn or #nnnnnn Where n = #0 to f (in hexadecimal count) red = #f00 or #ff0000; green = #0f0 or #00ff00; blue = #00f or #0000ff; black = #000 or #000000; white #fff or ffffff Hexadecimal – numbering system that is base-16 rather than our commonly used decimal numbering system of base-10 6. text-align Allowed value for text-align: left; right; center; justify 7. text-decoration Allowed value for text-decoration: capitalize; uppercase; lowercase; none
- 6. 8. letter-spacing – refer to space between letters Allowed value for letter-spacing: normal; and _em 9. word-spacing – refer to space between words Allowed value for word-spacing: normal; and _em 10. line-height – refer to space between lines Allowed value for word-spacing: normal; _%; and _em
- 7. Escape Sequences – other characters with special meanings in HTML that cannot be used as they are in text < (Less Than) = < > (Greater Than) = > © (Copyright) = © & (Ampersand) = & “ (Quote) = " ñ (Lowercase n with tilde) = ñ è (Lowercase with = è grave accent) ç (Lowercase c with cedilla) = ç â (Lowercase a with = â circumflex accent) ü (Lowercase u with umlaut) = ü Comment Tags Comments – written remarks in your HTML or CSS document which will not be displayed in the browser For HTML format: <!– type your comments here --> For CSS format: /* type your comments here */