As the main language for making web pages today, css has become a must-have for every Webmaster. If you still don't know css, you are still using dw to create a table Page, your website may not be able to get effective seo and other performance optimizations, thus losing the market. Today, I recommend a basic tutorial for you. Every Webmaster can understand it.
First look at the css section:
| Reference content is as follows: # Wrap { Border: 1px solid blue; Margin: 0 auto; Overflow: hidden;/* adds the overflow attribute to remove floating code so that the parent container can contain child layers. */ Width: 950px;/* The width here should also be set, instead of using the default adaptive width 100% of the browser */ } # Content { Border: 1px solid # C3CFEA; Float: left; Margin: 10px 0; Overflow: hidden; Padding: 10px 10px 15px;/* Note the padding settings here */ Width: 680px;/* Note that the width here only refers to the width of the content area of the layer. The actual width is 680px + 10px (right fill) + 10px (left fill) + 1px (Right Border) + 1px (left border) = 702 px ;*/ } # Sidebar { Border: 1px solid # FF0000; Color: # FF0000; Float: right; Margin: 10px 0; Overflow: hidden; Padding: 0 10px 20px; Width: 220px;/* the actual width is 220px + 10px + 10px + 1 + 1 = 242px */ } |
The above css is used in HTML:
| Reference content is as follows: <Div id = "wrap"> <Div id = "content"> Content </Div> <Div id = "sidebar"> Sidebar </Div> </Div> |
Let's look at the demo:
<Html>
Tip: the code can be modified before running!
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
