文章/答案/技术大牛

发布

问css在表单块中隐藏文本
EN

Stack Overflow用户

提问于 2017-09-11 08:49:49

回答 3查看 1.5K关注 0票数 3

<div class="tree-control">
<form>
   <div class="input-append" style="margin-right: 10px;">
       <input class="tree-search" type="text">
       <button title="search" class="btn tree-search-btn" type="button"/>
   </div>

   <a href="">link</a>
   some text
   <a href="">link</a>

</form>
</div>

我可以在不向添加任何标记的情况下隐藏一些文本吗？

我正试着这样做：

div.tree-control form {
    display:none;
}

div.tree-control form > div:first-of-type {
    display:block;
}

但它会隐藏所有的形式。我怎么能把短信藏起来？

html

css

css-selectors

回答 3

Stack Overflow用户

回答已采纳

发布于 2017-09-11 08:56:01

您可以在这里使用可见性属性。

visibility属性与display属性不同，因为它允许隐藏父元素和可见子元素。

div.tree-control form {
    visibility: hidden; /* hide the whole form */
}

div.tree-control form > div:first-of-type {
    visibility: visible; /* make the first div in the form visible */
}

div.tree-control form {
    visibility: hidden;
}

div.tree-control form > div:first-of-type {
    visibility: visible;
}

<div class="tree-control">
<form>
   <div class="input-append" style="margin-right: 10px;">
       <input class="tree-search" type="text">
       <button title="search" class="btn tree-search-btn" type="button"/>
   </div>

   some text

</form>
</div>

票数 2

Stack Overflow用户

发布于 2017-09-11 09:37:55

当不允许给标签时，没有禁用文本的方法。但对你来说总会有办法的。

更改与背景相同的文本颜色。希望这能帮到你。

<!DOCTYPE html>
<html>
<head>
<style>

div.tree-control form {
    color:white;
}


div.tree-control form > div:first-of-type {
    display:block;
}
</style>
<title>Page Title</title>
</head>
<body>

<h1>This is a Heading</h1>
<p>This is a paragraph.</p>

</body>
</html>

<div class="tree-control">
<form>
   <div class="input-append" style="margin-right: 10px;">
       <input class="tree-search" type="text">
       <button title="search" class="btn tree-search-btn" type="button">
       I am Button
       </button>
   </div>

   some text

</form>
</div>

票数 0

Stack Overflow用户

发布于 2017-09-11 09:35:52

始终可以将文本添加为元素- <p>Some Text</p> <label>Some Text</label> <span>Some Text</span>。

分配和Id或类和简单的display: none;就行了。

form span{
  display: none;
}

<div class="tree-control">
<form>
   <div class="input-append" style="margin-right: 10px;">
       <input class="tree-search" type="text">
       <button title="search" class="btn tree-search-btn" type="button"/>
   </div>

   <a href="">link</a>
   <span>some text</span>
   <a href="">link</a>

</form>
</div>

票数 -2

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/46151616

复制

相似问题

问css在表单块中隐藏文本
EN

回答 3

Stack Overflow用户

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问css在表单块中隐藏文本EN

回答 3

Stack Overflow用户

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问css在表单块中隐藏文本
EN