Home  >  Article  >  Web Front-end  >  How to hide div with css? css hidden div method

How to hide div with css? css hidden div method

云罗郡主
云罗郡主Original
2018-11-21 13:53:4413089browse

When we usually lay out the website, we want to hide the div, but many people don’t know how to control the display and hiding of divs with css? Let's explain how to hide divs with css.

1: Hiding web content

We can use the display:none attribute to hide all information, including text and pictures, the syntax is:

<div style="display:none;">这里你是看不到的</div>

When we use the css style in the div, we can use the display:none attribute to hide the content, and it is not visible through the browser. At the same time, the hidden content does not occupy space. The content after hiding Search engines do not read it. Generally, we use js statistics code to hide the displayed icon.

2: Hide overflowing text or pictures

To hide overflowing text or pictures, we can use the overflow:hidden attribute. First, we need to set a width and height for the content. , and then use the overflow: hidden style to set the overflow part. It is found that the overflow part is not displayed. The code is as follows:

我是可以看见的<br/><br/> 
<div style="overflow: hidden; width:30px; height:20px;">你是看不见我的。</div> 
<br/> 
同样我也是可以看见的

The effect is as follows:

How to hide div with css? css hidden div method

The above is how to hide div with css? For a full introduction to the hidden div method, if you want to know more about CSS3 tutorial, please pay attention to the php Chinese website.


The above is the detailed content of How to hide div with css? css hidden div method. 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