Lesson03_01 how to set CSS and CSS _ basic tutorial

Source: Internet
Author: User
Lesson03_01 what is CSS and CSS settings? 3rd CSS
  • What is CSS?
  • CSS settings
  • Style rule Selector
  • Comment and valid range of style rules
  • Style attributes
What is the setting method of CSS and CSS?

Author: Loncer more learning resources available at: wwww.loncer.cn What is CSS? abbreviation of Cascading Style Sheet. Chinese: stacked Style sheet. in addition to setting the display position and format of webpage elements, it also produces gradient effects such as filters, image fading, and webpage fading. in short. CSS controls the Display Effect of webpages in the same way as that of Word.
For example, the following code:

A css style is set.

We can see from the above: the style attribute of an HTML element can specify multiple style styles. The names of each style and its setting values are separated by colons, use semicolons to separate different styles. various "style names" are called "CSS attributes", and "set values" of style are called "CSS attribute values ". CSS is used to set the Display Effect of webpage elements. CSS settings
  • Inline style sheet)
The method for directly setting the style attribute of HTML square labels is called inline style sheet.
For example:
When using inline style sheets, the HTML4.01 standard recommends that youAdd Tag,
As follows:
There are two disadvantages to using this method:
1. If you want to set the same style to all paragraphs

Tag.
2. A webpage can be output on multiple media sets. The style set using the inline style sheet will take effect when output on all media sets, you cannot specify different style sheets for different media sets.

  • Embedded style sheet (Embedded style sheet)



Media indicates the media on which the style is displayed.
It is written for browsers that do not support CSS. In . An external style sheet file can be Tags are connected to HTML documents.
Example:
Create a test.css file with the following code:
P {
"FONT-SIZE: 20px; COLOR: bule; FONT-FAMILY:; BACKGROUND-COLOR: gray; TEXT-DECORATION: underline"
}
Write another file to use the style sheet and set them to the same folder:



Type and media are optional, and rel and href are required.
Using an external style sheet, a Web Builder can change the appearance of the entire network by changing a file. Most browsers store external style sheet files in the buffer, which speeds up website browsing.
  • Imported sytle sheets)
You can use @ import of CSS to input a CSS file to another CSS file. The entered CSS style rule Definition Statement becomes part of the input CSS style rule Definition Statement. You can also use @ inport to input a CSS file Tag pairs. The entered CSS style rule Definition Statement is The Definition Statement in the tag pair.
Example:
<Style type = "text/css" media = "screen"> <br> <! -- <Br> @ import url (http ://..................); <Br> @ import url (/XXXX ...............); <Br> p {background: yellow; color: black} <br> --> <br> </style> <br> Note: All @ import parts should be placed in front

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.