Div property Div tag attributes how to set attributes (music relaxation Chair)
Div attribute Introduction: What are the attributes that can be added to a div? List of Div attributes: divcss5
Divcss5 sorts out common attributes in the DIV tag, and uses small instances of each attribute to let everyone know and master the attributes.
List of common attributes in a div tag
1. Set CSS styles in style (Extended style labels)
2. Align sets the content in the DIV box to center, center left, and right
3. ID attracts external correspondence # (well ID) Select the symbol Style
4. class attracts external correspondence. (period) Select the symbol Style
5. Set the title to display text when the div (title) cursor goes through (extended understanding of the title label)
(Music relaxation Chair)
Next, divcss5 will introduce Div attributes one by one, and introduce the above five Div attributes through the Basic HTML syntax structure and CSS syntax infrastructure.
I. Div style attributes-top (music relaxation Chair)
You can directly use the style attribute in the DIV label. This attribute can be used to directly set CSS styles, also called intra-tag styles, similarly, labels such as span, H1, H2, strong, and P can directly use the style attribute to set CSS styles.
1. We have seen a syntax demonstration.
<Div style = "color: # f00; font-size: 18px"> the font size is 18px, And the font color is red. </div>
In this example, the DIV uses the style to set the CSS style.
2. Set CSS effect for style
Set the style attribute CSS style in the div (music relaxation Chair)
Effect of setting the style attribute CSS style in Div
3. Summary of style in Div attributes
To use style in a div label, you can directly set the CSS style for the DIV label. Therefore, if you want to directly use the style table in the DIV label, you can directly set the style for the DIV using the style attribute.
Ii. Div align Attribute-top
Directly add the align attribute to the tag to make the content in the object Center, Center, and right.
1. The code for setting the align attribute for div is as follows (music relaxation Chair)
<! Doctype HTML>
<HTML>
<Head>
<Meta charset = "UTF-8"/>
<Title> Div property demonstration </title>
</Head>
<Body>
<Div align = "Left"> left </div>
<Div align = "center"> center </div>
<Div align = "right"> right </div>
</Body>
</Html>
2. Case studies
Set the align attribute for the DIV to center the content to the left and right
Set the align attribute for the DIV to center the content to the left and right
3. Related CSS styles
1) CSS center, CSS center left, and CSS center right.
2). html Div align tutorial
3. Div ID Attribute-top
Use ID in the DIV label. On the one hand, if it is a JS effect, it may be an Action Script recognition function, and on the other hand, it is a style selector style named by # in CSS. Of course, you can set the ID attribute for other labels.
1. ID: Use the instance code
<! Doctype HTML>
<HTML>
<Head>
<Meta charset = "UTF-8"/>
<Title> Div property demonstration </title>
<Style>
# Divcss5 {color: # f00; font-size: 16px; font-weight: bold}
</Style>
</Head>
<Body>
<Div id = "divcss5">
The font is red, 16 PX, bold
</Div>
</Body>
</Html>
2. Div ID instance
Use Id in Div
Use Id in Div
Iv. Div Class Attribute-top
The class and ID syntax are used in the same structure. Generally, the object style is set to use. the style selector named after the English half-width lowercase ending point. It is applied to Div or other labels using class.
1. Complete HTML source code of the Instance
<! Doctype HTML>
<HTML>
<Head>
<Meta charset = "UTF-8"/>
<Title> Div property demonstration </title>
<Style>
. Divcss5 {color: # 00f; font-size: 18px}
</Style>
</Head>
<Body>
<Div class = "divcss5">
The font is blue and the font is 18px.
</Div>
</Body>
</Html>
2. Class Div instance Effect
Div class attribute instance
Div class attribute instance
5. Set the title Attribute-top for the DIV
Set the title attribute for the Div or other labels to display the prompt content when the mouse is hovering over the Div or modifying the object, just like setting the title attribute for a tag (understanding the title on the webpage ).
1. Div + CSS instance code
<! Doctype HTML>
<HTML>
<Head>
<Meta charset = "UTF-8"/>
<Title> Div property demonstration </title>
</Head>
<Body>
<Div Title = "show me when hovering">
Divcss5 content
</Div>
</Body>
</Html>
2. instance effect Browser
Set title for div
Set the title of the DIV, and hover the mouse over the DIV object.
When you move the cursor over the DIV box with the title attribute set, a message is displayed next to the cursor. This method is the same as setting the title attribute for HTML ahyperlink.
Vi. Summary of Div attributes-top
The above basics and examples describe how to set common attributes in Div labels. You can also set the above five attributes for other labels. The principles and syntax structure are the same. You can refer to the divcss5.
Div property Div label attribute how to set attributes
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
