Home > Developer > Web Develop
HTML + CSS style settings-CSS will be used once you learn, css will be used once you learn
HTML + CSS style settings
CSS :( Cascading Style Sheets) cascade Style settings table.
The Display Effect of a webpage is closely related to its layout. CSS is used to set and adjust the layout.
The following describes the process of joint use of CSS and HTML:
(1) create a CSS file (usually placed in the css folder in the same path as the HTML file ).
(2) In the HTML
<Link rel = "stylesheet" type = "text/css" href = "file address/css file name .css"/>.
(3) write the style setting code in the CSS file based on the HTML Tag or identifier.
CSSBasic syntaxSelector, Property, and Value)
The code format is: selector {property: value }.
MainSelector: Tag tags (html tags), class Identifiers (custom), and id Identifiers (custom)
Selector syntaxIs:
(1) tag tags are directly followed by {}, such as body {}, table {}, p {}, and font.
(2) Class Identifier, in the form of ". identifier {property: property value;}", for example,. xs {color: blue ;}.
(3) id Identifier, in the form of "# identifier {property: property value;}", for example, # xs {color: blue ;}.
Supplement: When the tag selector is used, if multiple tags have the same effect, you can write them together. Separate multiple labels with spaces and use one {} to set them. Different effects can be set separately. Example table tr td {color: red }.
Example:
HTML code:
<Html>CSS code:
/* Id Identifier · example */# all {Background-color: # F0F0F0;/* set the Background color to light gray */width: 600px; /* set the width of this forum to 600 pixels */height: 700px;/* The height is 700 pixels */}. set {/* set */text-align: center for 1st rows and 1st columns;/* center text */font-weight: bold/* Text bold */} table {/* set the overall style of the table */width: 500px;/* set the table width to 500 pixels */height: 400px; /* Table Height: 400 pixels */}There are four style settings: (SeeCSS features and four methods for adding a webpage)
The following are commonly used:
(1) directly write in the tag, such
<Table style = "border-left-width: 2px"> </table>/* set the width of the left border of the table to 2 pixels */(2) in
<Style type = "text/css"> p {text-align: center;}/* set the text center of the p tag */</style>(3)save as an external .css file and use the <link/> statement to reference it. Example
<link rel=”stylesheet” type=”text/css” href=”css/setTable.css” />The sample table settable.css file is placed in the css folder.
For details about CSS processing results, we recommend that you[Proficient in DIV. CSS webpage style and layout]. He Li. HD scan version with directory
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
