Learn about DIV + CSS from today and update it every day

Source: Internet
Author: User
At present, more and more websites use DIV + CSS for design. To some extent, it can be said that it reduces the load on the website and is a good thing, so it is necessary to learn.
I. Basics
The basic structure of DIV is as follows:
<DIV-related attributes> text description </DIV>
<DIV style = ""> text description </DIV>
So what I need to learn is something in the style of the relevant attribute.
For example, <div style = "width: 500px; height: 300px; background-color: # 0099CC"> </div>

II. Introduction to DIV attributes
Aglin: Horizontal Alignment: Center, Justify, Left, and Right.
Class: Css Class Name
Dir: Unknown [to be updated]
ID:
More events [no need to write these events]
Style: This is what we want to learn.

Iii. Introduction to Style values
 Azimuth:Left-side | far-left | center | right | far-right | right-side | leftwards | rightwards | angle
Sets or retrieves the sound field angle of the current sound.
Currently, IE5.5 does not support this attribute.
========================================================== ==================
Background-color:Transparent|Color
Parameters:
Transparent:Transparent background color
Color:Specify the color. See color unit and Appendix: Color Table
========================================================== ====================
Background:Url (picview/jpg/1.jpg) background image
Parameters:
Transparent:Transparent background color
Color:Specify the color. See color unit and Appendix: Color Table
========================================================== ==================
Background-repeat: repeat|No-repeat|Repeat-x|Repeat-y
Parameters:
Repeat:The background image is tiled vertically and horizontally.
No-repeat:Background image not tiled
Repeat-x:The background image is tiled horizontally.
Repeat-y:The background image is tiled vertically.
========================================================== ==================
Background-attachment: It is fixed to set or retrieve the background image as it scrolls with the object content.
Parameters:
Scroll:The background image is tumble with the object content.
Fixed:Fixed background image

Width:Width, such as 500px and 100%
Height:Height, such as: 100% PX
 

**************************************** *********************
============== Updates ============================== =
**************************************** **********************

Syntax:
Clear:None|Left|Right|Both
 
Parameters:
 
None:Allow both sides to have floating objects [so the text will be surrounded by both sides of the div]
Both:Floating objects are not allowed. [there is nothing on either side of the div]
Left:Float objects on the left are not allowed [so there is nothing on the left of the div]
Right:Float objects on the right are not allowed [so there is nothing on the right of the div]

Float: none|Left|Right
 
Parameters:
 
None:Objects do not float [so there is nothing on both sides of the div]
Left:Object floating on the left [align the left of the div]
Right:Object floating on the right [align the right side of the div]

Overflow: visible|Auto|Hidden|Scroll
 
Parameters:
 
Visible:Do not cut the content or add a scroll bar. If this default value is explicitly declared, the object is cut to the size of the window or frame containing the object. And the clip attribute settings will be invalid.
Auto:This is the default value for the body object and textarea. Cut the content and add a scroll bar as needed
Hidden:Content beyond the object size is not displayed
Scroll:Always display the scroll bar
[Generally, the overflow attribute = hidden is used to set a div with a small height]

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.