如何在css中隐藏带有ID和Class的div中没有​​ID的？

This is so frustrating, I'm trying to hide an specific paragraph, but it doesn't have an ID:

这太令人沮丧了，我试图隐藏一个特定的段落，但它没有ID：

<div id="form-2" class="widget widget-box w-widget">
<p style>Some text 1</p>
<p style>Some text 2</p>
</div>

As you can see, there is no ID for P. I already tried like this:

如您所见，P没有ID我已经尝试过这样：

#form-2 p {
display: none;
}

But it is hiding all the paragraphs. Also tried using the class, same result.

但它隐藏了所有段落。也尝试使用类，相同的结果。

PS: Need to hide Some text 1

PS：需要隐藏一些文字1

and leave Some text 2

6 个解决方案

#1

you can use the nth-child selector (or just first-child / last-child selector) you can use as well the nth-of-type selector (or just the first-of-type / last-of-type selector)

你可以使用nth-child选择器（或者只是第一个子/最后一个子选择器），你也可以使用nth-of-type选择器（或者只是第一个类型/最后一个类型的选择器）

here is a few snippets based on yours

这里有一些基于你的片段

first-child

#form-2 p:first-child {display:none}

<div id="form-2" class="widget widget-box w-widget">
  <p>Some text 1</p>
  <p>Some text 2</p>
</div>

last-child

#form-2 p:last-child {display:none}

<div id="form-2" class="widget widget-box w-widget">
  <p>Some text 1</p>
  <p>Some text 2</p>
</div>

nth-child

#form-2 p:nth-child(3) {display:none}

<div id="form-2" class="widget widget-box w-widget">
  <p>Some text 1</p>
  <p>Some text 2</p>
  <p>Some text 3</p>
  <p>Some text 4</p>
  <p>Some text 5</p>
</div>

nth-of-type

#form-2 p:nth-of-type(4) {display:none}

<div id="form-2" class="widget widget-box w-widget">
  <p>Some text 1</p>
  <p>Some text 2</p>
  <p>Some text 3</p>
  <p>Some text 4</p>
  <p>Some text 5</p>
</div>

#2

You can do this with first-child.

你可以用第一个孩子做到这一点。

#form-2 p:first-child {
display: none;
}

Here is a JSFiddle

这是一个JSFiddle

#3

#form-2 > p:first-of-type {
    display: none;
}

#4

Try this #form-2 p:first-child

试试这个＃form-2 p：first-child

#5

You can do nth-child(1), nth-child is used for an arbitrary child. If you happen to just want to hide the first <p> then you can use :first-child.

你可以做nth-child（1），nth-child用于任意的孩子。如果您碰巧只想隐藏第一个

，那么您可以使用：first-child。

#form-2 p:nth-child(1) {
display: none;
}

#6

You need to select first p tag using :first-child

您需要使用：first-child选择第一个p标签

#form-2 p:first-child {
    display: none;
}