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

How to hide div with css? css hidden div method

云罗郡主
Release: 2018-11-21 13:53:44
Original
13125 people have browsed it

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

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/> 
同样我也是可以看见的
Copy after login

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!

Related labels:
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