Standard web tutorial: Getting started with CSS on the seventh day

Source: Internet
Author: User

After understanding the XHTML code specifications, we need to perform CSS layout. First, we will introduce some introduction to CSS.
Skip this section if you are familiar with it.
CSS is short for Cascading Style Sheet.
It is a simple mechanism for adding styles to web documents and belongs to the layout language of the presentation layer.
1. Basic Syntax Specification
Analyze a typical CSS statement:
P {COLOR: # FF0000; BACKGROUND: # FFFFFF}
· "P" is called "selectors", indicating that we want to define a style for "p;
· Style declaration is written in a pair of braces;
· COLOR and BACKGROUND are called "properties". Different properties are separated by semicolons;
· "# FF0000" and "# FFFFFF" are attribute values ).
2. Color value
The color value can be written in RGB format, for example, color: rgb (, 0, 0) or hexadecimal format, just like color: # FF0000 in the preceding example. If the hexadecimal value is repeated in pairs, the effect is the same. For example, # FF0000 can be written as # F00. However, it cannot be abbreviated if it is not repeated. For example, # FC1A1B must be filled with six characters.
3. Define the font
The following font definition method is recommended for web standards:
Body {font-family: "Lucida Grande", Verdana, Lucida, Arial, Helvetica,, sans-serif ;}
The font is selected in the listed order. If your computer contains the Lucida Grande font, the document will be specified as Lucida Grande. If no, it is specified as the Verdana font. If no Verdana is available, it is specified as the Lucida font, and so on ,;
· Lucida Grande font is suitable for Mac OS X;
· Verdana fonts are suitable for all Windows systems;
· Lucida is suitable for UNIX users
· "" Is suitable for simplified Chinese users;
If none of the listed fonts are available, the default sans-serif font can be called;
4. Group selector
When the style attributes of several elements are the same, you can call a declaration. Elements are separated by commas ,:
P, td, li {font-size: 12px ;}
5. Derivative selector
You can use the derived selector to define a style for the child element in an element. For example:
Li strong {font-style: italic; font-weight: normal ;}
The child element strong under li defines a italic style that is not bold.
6. id selector
The CSS layout is mainly implemented by the "div" layer, and the div style is defined by the "id selector.

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.