Question

我有12个div，每个月一个。然后，我将PHP变量设置为“开始月份”。我要显示的是开始月份和之后的2个月，其余的隐藏起来。另一件事是，如果开始月份是11月，我只想显示第11个月和第12个月，或者如果开始月份是12月，我只想显示第12个月，则它不应该延续到下一年。

<?php $startMonth = "7"; ?>

<div>January</div>
<div>February</div>
<div>March</div>
<div>April</div>
<div>May</div>
<div>June</div>
<div>July</div>
<div>August</div>
<div>September</div>
<div>October</div>
<div>November</div>
<div>December</div>

<style>
div {
  display:none;
}
  div:nth-child(<?php echo $startMonth; ?>) {
    display:block;
  }
</style>

PHP / CSS可以实现类似的功能吗？我假设我将不得不根据开始月份进行一些计算，并实施一些条件语句来处理11月/ 12月开始月份。

Answer 1

假设这些div全部包含在一个包装的div中，那么...

div {
  display:none;
}
  div:nth-child(<?php echo $startMonth; ?>),
  div:nth-child(<?php echo $startMonth; ?>) ~ div {
    display:block;
  }

这将显示所需的第n个子代及其后的所有div子代。我建议应用一个类，而不要使用非常脆弱的nth-child。

div {
  display: none;
}

div:nth-child(7),
div:nth-child(7)~div {
  display: block;
}

<div>January</div>
<div>February</div>
<div>March</div>
<div>April</div>
<div>May</div>
<div>June</div>
<div>July</div>
<div>August</div>
<div>September</div>
<div>October</div>
<div>November</div>
<div>December</div>

Answer 2

也许不是您要的特定方法，但我发现这是解决问题的更好方法。

<?php
    $startMonth = 7;
    $j = 0;
?>

<?php for ($i = $startMonth; $i <= 12; $i++): ?>
    <?php
        if ($j>2) break;
        $j++;
        $date = DateTime::createFromFormat('!m', $i);
    ?>
    <div data-month-number="<?= $i ?>">
        <h4><?= $date->format('F'); ?></h4>
    </div>
<?php endfor; ?>

处理您的显示逻辑，它是最佳的（假设这些月提取了数据），并且比CSS更清晰。

在此处查看：http://sandbox.onlinephpfunctions.com/code/b9e0ee96624943cf15587030d8e82985e1540536

Answer 3

您可以为当前div设置特殊设置吗？然后尝试使用此CSS代码div.current + div , div.current + div + div {display:block}。希望你能解决！

基于动态PHP变量的第n个子配方

3 个答案: