Home  >  Article  >  Web Front-end  >  How to hide beyond height in css

How to hide beyond height in css

青灯夜游
青灯夜游Original
2021-07-14 16:47:194852browse

In CSS, you can use the overflow-y attribute to achieve the effect of hiding beyond the height. You only need to add the "overflow-y:hidden" style to the element. The overflow-y attribute specifies what happens when the content overflows the top/bottom edge of the element. When the value is hidden, the excess part will be hidden.

How to hide beyond height in css

The operating environment of this tutorial: Windows 7 system, CSS3&&HTML5 version, Dell G3 computer.

In CSS, you can use the overflow-y attribute to achieve the effect of exceeding height hiding.

Let’s take a look at the code example:






这是一个段落。这是一个段落。这是一个段落。这是一个段落。 这是一个段落。这是一个段落。这是一个段落。这是一个段落。 这是一个段落。这是一个段落。这是一个段落。这是一个段落。 这是一个段落。这是一个段落。这是一个段落。这是一个段落。 这是一个段落。这是一个段落。这是一个段落。这是一个段落。

Rendering:

How to hide beyond height in css

Description:

The overflow-y attribute specifies what happens when the content overflows the top/bottom edge of the element; when the value is hidden, the content will be trimmed and the excess part will be hidden.

The overflow-y attribute has the following values:

ValueDescription
visible default value. The content will not be trimmed and will be rendered outside the element box.
hiddenThe content will be trimmed and the remaining content will be invisible.
scrollThe content will be trimmed, but the browser will display scroll bars to view the remaining content.
autoIf content is trimmed, the browser displays scroll bars to view the remaining content.
no-displayIf the content does not fit into the content box, delete the entire box.
no-contentHide the entire content if it does not fit into the content box.

(Learning video sharing: css video tutorial)

The above is the detailed content of How to hide beyond height in css. For more information, please follow other related articles on the PHP Chinese website!

Statement:
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
Previous article:How to add spaces in cssNext article:How to add spaces in css