Contents structure [-]
Hight Property value Type list
| Value | Describtion |
| Auto | Default |
| Length | Absolute length |
| % | Relative length |
| Inherit | Inherited |
here I mainly introduce the relative length of the usage, about the absolute length of the reader can refer to the CSS size unit px% em rem detailed to get more information.
Use of the% value of height
Defined:
This value is a percentage, which is based on the percentage of the block-level element that contains it.
Instance:
<! DOCTYPE html>Readers can click on "F12" in the Chrome browser and select "element", and readers can quickly find that <p> 's height is exactly 50% of the parent element <body>.
Need to be aware of
In the previous example, we verified the use of the relative value of height. However, the reader needs to note that if the parent element does not define hight, the hight percentage of the child element does not work, and the height value is equivalent to the auto value, unless it is changed with absolute value. Here hight is not defined to mean that the height is not written at all, and the height is defined as 0px different. Readers can try the following code:
<body id= "B" style= "width:0px;height:0px;" ><br><p id= "er" style= "width:50%;height:50%;border:1px solid red;" ></p>Then remove the body style attribute and try again.
<body id= "B" >
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
