CSS控制元素隐藏和显示的方法有以下几种:
1. display属性:可以设置为none来隐藏元素,设置为block或其他合适的值来显示元素。
```css
.hidden {
display: none;
}
.visible {
display: block;
}
```
2. visibility属性:可以设置为hidden来隐藏元素,设置为visible来显示元素。不同于display属性,隐藏的元素仍会占据空间。
```css
.hidden {
visibility: hidden;
}
.visible {
visibility: visible;
}
```
3. opacity属性:可以通过设置为0来隐藏元素,设置为1来显示元素。不同于display属性和visibility属性,隐藏的元素仍会占据空间。
```css
.hidden {
opacity: 0;
}
.visible {
opacity: 1;
}
```
4. height和width属性:可以通过设置为0来隐藏元素,设置为auto或其他合适的值来显示元素。不同于display属性、visibility属性和opacity属性,隐藏的元素不会占据空间。
```css
.hidden {
height: 0;
width: 0;
}
.visible {
height: auto;
width: auto;
}
```