Home > Web Front-end > Front-end Q&A > How to use css max-width attribute

How to use css max-width attribute

青灯夜游
Release: 2019-05-30 15:25:30
Original
3051 people have browsed it

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 css 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;
Copy after login

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>
Copy after login

Rendering:

How to use css max-width attribute

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!

Related labels:
css
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template