Html 如何在不注释的情况下使 div 不可见?

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/3028025/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-29 03:26:16  来源:igfitidea点击:

How to make a div invisible without commenting it out?

csshtml

提问by Mubeen

Is it possible to make a div invisible without commenting it out? If so, how?

是否可以在不注释的情况下使 div 不可见?如果是这样,如何?

回答by Sarfraz

You need to hide that with CSS:

你需要用 CSS 隐藏它:

div {                    /* this will hide all divs on the page */
  display:none;
}

If it is a particular div with certain class or id, you can hide it like:

如果它是具有特定类或 id 的特定 div,则可以将其隐藏,例如:

<div class="div_class_name">Some Content</div>

CSS:

CSS:

div.div_class_name {     /* this will hide div with class div_class_name */
  display:none;
}

Or

或者

<div id="div_id_name">Some Content</div>

CSS:

CSS:

div#div_id_name {        /* this will hide div with id div_id_name */
  display:none;
}

Note:You need to wrap CSS tyles in between <style type="text/css"></style>tags, example:

注意:您需要在<style type="text/css"></style>标签之间包装 CSS 样式,例如:

<style type="text/css">
  div#div_id_name {
    display:none;
  }
</style>

More Information :)

更多信息 :)

回答by Tasawer Khan

You can do this by inline style

您可以通过内联样式执行此操作

<div style="display:none"></div>

or by defining CSS Style like In css add

或者通过像 In css add 一样定义 CSS 样式

.HideableDiv{display:none;}

and in your HTML write

并在您的 HTML 中写入

<div class="HideableDiv" ></div>

回答by Max Ruf

Its Easy. The only thing you need is, adding a style to it, like following example shows:

这很简单。您唯一需要的是,为其添加样式,如下例所示:

CSS:

CSS:

<style type="text/css">
    div.myInvisibleDiv {
        overflow: hidden;
        visibility: hidden;
        height: 0;
        width: 0;
    }
</style>

HTML:

HTML:

<div class="myInvisibleDiv"><p>My invisible content</p></div>

This div, and it content does definitely not show, and it wont disturb surrounding elements.

这个div,它的内容绝对不显示,也不会干扰周围的元素。

回答by Jubair

if you want it to be essentially gone from your layout:

如果您希望它基本上从您的布局中消失:

.element_class {
 display:none;
}

if you want to just make it invisible (but still keeping it's space seemingly empty)

如果你只想让它不可见(但仍然保持它的空间看起来是空的)

.element_class {
 visibility: hidden;
}

and then your element (if a div) would look like this:

然后您的元素(如果是 div)将如下所示:

<div class="element_class"></div>

basically anything you add the class="element_class" to will be either invisible or completely hidden.

基本上,您添加 class="element_class" 的任何内容都将不可见或完全隐藏。

回答by Arsman Ahmad

May be, its not the required solution, but you can tackle this kind of issues by these little tricks.

也许,它不是必需的解决方案,但您可以通过这些小技巧解决此类问题。

You can use jQueryto achieve the solution. If you want to totally hide/show the div, then you can use:

您可以使用jQuery来实现解决方案。如果您想完全隐藏/显示div,则可以使用:

$('#my_element').show()
$('#my_element').hide()

Or if you want that your div become invisible and its still existing in the page, then you can use efficient trick:

或者,如果您希望您的 div 变得不可见并且它仍然存在于页面中,那么您可以使用有效的技巧:

$('#my_element').css('opacity', '0.0');    // invisible Maximum
$('#my_element').css('opacity', '1.0');   // visible maximum

回答by Adam Asham

position: absolute;
left: -99999px; /* big number */

will make the content accessible to most screen readers but will render the element off-screen.

将使大多数屏幕阅读器可以访问内容,但会将元素呈现在屏幕外。