Question

<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>

我可以隐藏某些文字而不向html添加任何标签吗？

我试着这样做：

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

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

但它会隐藏所有表格。我怎样才能隐藏文字？

Answer 1

您可以在此处使用visibility属性。

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 */
}

＆＃13;

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

＆＃13;

<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>

＆＃13;

Answer 2

当您不允许提供标记时，没有禁用文本的方法。但总会有一种解决方法。

将文本颜色更改为与背景相同。希望这可以帮助你。

<!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>

Answer 3

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

分配和ID或类，简单display: none;即可。

＆＃13;

form span{
  display: none;
}

＆＃13;

<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>

＆＃13;

css隐藏表单块中的文本

3 个答案: