Home > Article > Web Front-end > How to use css bottom property
How to use css bottom property
- 藏色散人Original
- 2019-05-29 13:55:523127browse
css bottom property is used to specify the bottom edge of the element. This property defines the offset between the lower margin boundary of the positioned element and the lower boundary of its containing block. If the value of the "position" property is "static", then setting the "bottom" property has no effect.
#How to use the css bottom property?
Function: The bottom attribute specifies the bottom edge of the element.
Description: This attribute defines the offset between the lower margin boundary of the positioned element and the lower boundary of its containing block. If the value of the "position" property is "static", then setting the "bottom" property has no effect.
Note: All major browsers support the bottom attribute. The attribute value "inherit" is not supported in any version of Internet Explorer (including IE8).
css bottom attribute usage example
<html>
<head>
<style type="text/css">
img.ex1
{
position:absolute;
bottom:0px;
}
img.ex2
{
position:relative;
bottom:-100px;
}
</style>
</head>
<body>
<img class="ex1" src="https://img.php.cn/upload/article/000/005/656/5af270fd37755429.jpg" / alt="How to use css bottom property" >
<h1>This is a heading</h1>
<img class="ex2" src="https://img.php.cn/upload/article/000/005/656/5af270fd37755429.jpg" / alt="How to use css bottom property" >
</body>
</html>Effect output:
The above is the detailed content of How to use css bottom property. For more information, please follow other related articles on the PHP Chinese website!