Home >Web Front-end >Front-end Q&A >How to use css max-width attribute
How to use css max-width attribute
- 青灯夜游Original
- 2019-05-30 15:25:303053browse
css max-width attribute sets the maximum width of the element; negative values are not allowed to be specified. This property sets a maximum limit on the width of the element; therefore, the element can be narrower than the specified value, but cannot be wider. All major browsers support the max-width attribute.
How to use the css max-width attribute?
The max-width attribute defines the maximum width of an element.
Syntax:
max-width: none|length|%|inherit;
Attribute value:
● None: Default. The definition places no limit on the maximum width of the element.
●length: Defines the maximum width of the element.
● %: Defines the maximum width based on the percentage of the block-level object that contains it.
● Inherit: Specifies that the value of the max-width attribute should be inherited from the parent element.
Description: This attribute will set a maximum limit on the width of the element. Therefore, the element can be narrower than the specified value, but not wider. Negative values are not allowed.
Note: All major browsers support the max-width attribute.
css max-width attribute example
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<style type="text/css">
p {
max-width: 400px;
border: 1px solid red;
}
</style>
</head>
<body>
<p>这是一些文本。这是一些文本。这是一些文本。 这是一些文本。这是一些文本。这是一些文本。 这是一些文本。
这是一些文本。这是一些文本。 这是一些文本。这是一些文本。这是一些文本。 这是一些文本。这是一些文本。
这是一些文本。
</p>
</body>
</html>Rendering:
The above is the detailed content of How to use css max-width attribute. For more information, please follow other related articles on the PHP Chinese website!