html - 如何在将元素保留在页面上的同时使用 css 隐藏它?

标签 html css

我想在我的页面上隐藏一个元素,但我仍然希望它存在。我想要一个仍然可以点击的按钮,但我希​​望它不可见。

最佳答案

有3种方法可以隐藏元素并保持页面位置。您可以获得有关 Normal flow 之间的更多信息和css样式(即:opcity、visibility)属性关系。

  1. 知名度
  2. 城市
  3. 透明

$('div').click(function (){
  alert(this.innerHTML)
})
div{
  border: 1px solid #000;
}
.one{
  visibility:hidden;
}
.two{
  opacity: 0;
}
.three{
  background: transparent;
  color: transparent;
}
<!DOCTYPE html>
<html>
<head>
<script src="//code.jquery.com/jquery-2.1.1.min.js"></script>
  <meta charset="utf-8">
  <title>JS Bin</title>
</head>
<body>
  1
  <div class="one">visibility</div>
  2
  <div class="two">opticy</div>
  3
  <div class="three">transparent</div>
  4
</body>
</html>

关于html - 如何在将元素保留在页面上的同时使用 css 隐藏它?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/29588632/

相关文章:

html - 在 IE 中使用 Angular 操作内联样式不起作用

javascript - 打开模态视图时禁用主体滚动

javascript - 当数据来自数据库时如何只选择一个复选框

javascript - 单选按钮的选定值不会改变

Javascript - 选择网格元素时显示 div

html - firefox 显示的文字比其他的大

javascript - Jquery函数的迭代

javascript - 从后台执行内容脚本和关联的 CSS (Manifest V3) - Chrome 扩展

css - 仅在特定元素中引用 CSS 类

javascript - 克隆 jquery 输入文件未清除