CSS basics: basic and syntax, css basic syntax
CSS syntax
CSS Rules consist of two main parts: Selector and one or more declarations. A selector is usually an HTML element that you need to change the style.
selector {declaration1; declaration2; ... declarationN }Each declaration consists of an attribute and a value.
Property is a style attribute ). Each attribute has a value. The attribute and value are separated by colons.
selector {property: value}For example, the following line of code defines the text color in h1 as red, and sets the font size to 14 pixels.
In this example, h1 is the selector, color and font-size are attributes, and red and 14px are values.
h1 {color:red; font-size:14px;}Introduce CSS styles
How to insert a style sheet? When reading a style sheet, the browser will format the HTML document based on it. There are three ways to insert a style sheet: external style sheet, internal style sheet, and inline style.
1. External Style Sheets
When a style needs to be applied to many pages, the external style sheet is ideal. When using an external style sheet, you can change the appearance of the entire site by changing a file. Use the <link> label to link to the style sheet on each page. <Link> tag in (document) header:
2. Internal Style Sheets
When a document requires a special style, you should use an internal style sheet. You can use the <style> label to define an internal style sheet in the Document Header, as shown in the following figure:
<Head> <style type = "text/css"> p {margin-left: 20px;} body {background-image: url ("images/test.gif ");} </style>
3. because inline styles need to mix the representation and content, that is, HTML code and CSS code, this is not conducive to the document structure and is not easy to maintain. Therefore, do not use this method to introduce styles. For example, to change the color and left margin of a paragraph:
<p style="color: red; margin-left: 20px;">This is a paragraph</p>
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
