# 第一次体验到important在css里真的有用
* 抖音：
* B站：
之前我一直觉得CSS里的important是个鸡肋
但是今天遇到了一个场景
我觉得挺好哈
给大家看一下
我现在这个地图（Demo演示为一张地图图片）里边
有两个点是通过地址栏参数传进来的
大家看如果我只传一个start
大家看！End就不显示
然后呢再传一个End
它就显示
也就是说
这两个点是通过地址来参数控制的
而且呢
它们这个样式是直接写在行内的
大家看！display = block
然后呢比如说其中一个不传
它的display就是none了
然后遇到什么问题呢
就是这还有一个功能
就是可以切换这个大头针的功能
就是我可以控制它显示和不显示
在这种情况下
大家看！只显示一个start的情况下
隐藏没问题
但是一打开的时候
注意看这个End就跑这来了
其实原因很简单
就是我们在做切换显示的时候呢
应该做一个判断
看地址栏有没有End参数对吧
但这样的话逻辑就稍微有点复杂了
那这时候important就能用上了
大家看我们定一个样式叫强制隐藏
然后display: none !important
然后呢我们在切换的时候呢
我还写了另一个方法
在这是 ...
大家看我们在切换的时候
只是控制它有没有这样式就好了
我们再试一下
把这个打开
看一下这两个样式
好把它关掉
大家看它还是一个block 一个none
但是呢多了一个force hide
他俩都不显示了
我再把它打开也没有问题
那个End也没有显示
这样的话呢
我们就简化了代码逻辑
只要有 .force-hide
就说明要强制隐藏起来
---
# Agent Instructions: Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.
Perform an HTTP GET request on the current page URL with the `ask` query parameter:
```
GET https://sunzsh.gitbook.io/xiaoshan.bug/di-yi-ci-ti-yan-dao-important-zai-css-li-zhen-de-you-yong.md?ask=
```
The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.
Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.