Javascript 隐藏id大于$number的行

我有一个php变量，希望通过css隐藏所有大于$number的行。 例如：$number=12

<style>
#row<?php echo $number?>{
display: none;
}
</style>

#划船{
显示：无；
}

这将仅隐藏一行12。 我要隐藏大于12的所有行

---

有什么建议吗？

添加一个循环，并将代码自动写入页面

<?php

for ($i = $number; $i <= 100; $i++) {
    echo '#row'.$i.' {display: none;}';
}

?>

此外，如果您想将其直接放在页面中，它可能会如下所示：

<?php

echo '<style>';

for ($i = $number; $i <= 100; $i++) {
  echo '#row'.$i.' {display: none;}';
}

echo '</style>';

?>

---

要使其正常工作，您需要一个父div和一个支持

：第n个子项的浏览器

HTML

请参见演示
使用类标记最后可见的行-类似于
finalRow
-并使用CSS：

~combinator分隔两个选择器，仅当第二个元素前面有第一个元素时，才匹配第二个元素，并且两个元素共享一个公共父元素

要隐藏它后面的所有行（本例假设每一行都是
div
；当然，根据需要进行更改）：


.finalRow~div{
显示：无；
}

看。这种方法的一个好处是，您可以让客户端Javascript根据需要移动
finalRow
类。
为什么不让一个隐藏CSS类并将该类应用于相关行？不过，最好是通过服务器端（echo和条件语句）执行此操作，因为这仍然会在HTML源代码中显示。这取决于你，没有争论。但是，如果OP使用引导，则使用
可能会导致问题。引导使用完全相同的语法。只是说；-）这太完美了。谢谢回显“#行”。$i.{显示：无；}”；哦，是的。。。谢谢，把我的语言弄混了（我会把“+”改成a”。）
<?php

echo '<style>';

for ($i = $number; $i <= 100; $i++) {
  echo '#row'.$i.' {display: none;}';
}

echo '</style>';

?>

<div class="data">
    <div class="row">row1</div>
    <div class="row">row2</div>
    <div class="row">row3</div>

    <div class="row">row4</div>
    <div class="row">row5</div>
    <div class="row">row6</div>

    <div class="row">row7</div>
    <div class="row">row8</div>
    <div class="row">row9</div>    

    <div class="row">row10</div>
    <div class="row">row11</div>
    <div class="row">row12</div>       

    <div class="row">row13</div>
    <div class="row">row14</div>
    <div class="row">row15</div>       
</div>

.data div:nth-child(n+12) {
   display: none;
}

<style>
  .finalRow ~ div {
    display: none;
  }
</style>