weixin_36977678
不知何去程序猿
2018-03-05 07:37
采纳率: 85.7%
浏览 4.8k

css怎么给第4个li和第8个li之间设置样式

css怎么给第4个li~8个li设置样式,有没有比连续写五个li:nth-child好
图片说明

  • 点赞
  • 写回答
  • 关注问题
  • 收藏
  • 邀请回答

14条回答 默认 最新

  • en_joker
    孤芳不自賞 2018-03-05 07:49
    已采纳

    用jquery的话,就是
    用ul>li的:gt(2)和:lt(8)即可处理。

    点赞 评论
  • qq_34965479
    无敌大饭勺 2018-03-05 07:47

    $('ul li:eq(3)').css('color', 'red');
    $('ul li:eq(4)').css('color', 'red');
    $('ul li:eq(5)').css('color', 'red');
    $('ul li:eq(6)').css('color', 'red');
    $('ul li:eq(7)').css('color', 'red');

    点赞 评论
  • qq_24081719
    qq_24081719 2018-03-05 08:04

    需要设置样式的标签都定义一个class 然后只对该class设置样式 这样比较好了

    点赞 评论
  • u012655526
    收破烂啦 2018-03-05 08:07

    css 伪元素选择器

    点赞 评论
  • qyp_slw
    lar_slw 2018-03-05 08:08

    肯定是共用一个类名啊

    点赞 评论
  • showbo
     $('li').filter(function (index) {return index>2&&index<8 }).css('color','#f00')
    
    点赞 评论
  • ly19930
    单纯不撩妹 2018-03-05 08:19

    <!DOCTYPE html>



    Insert title here .addstyle{ border: 2px solid; }


    1111111
      var i = 1; var sul = document.getElementById('uu'); while(i<10){alert(22) var lia = document.createElement("li"); lia.appendChild(document.createTextNode('new'+i)); if(i%4 == 0){alert(333) lia.setAttribute("class","addstyle"); } sul.appendChild(lia) ; i++; }


    点赞 评论
  • ttstts
    ttstts 2018-03-05 08:31

    li{color:red}
    li:nth-child(4n){color:blue}

    点赞 评论
  • weixin_39103342
    weixin_39103342 2018-03-06 01:25

    直接在第四个和第八个li之间加类标签 控制就行了

    点赞 评论
  • lilyJX
    lilyJX 2018-03-06 02:48

    共用一个name,给name添加属性就可以了

    点赞 评论
  • m0_37852904
    阡路陌人 2018-03-06 05:05

    相同元素添加相同类名比较好

    点赞 评论
  • insistlzh
    罗忠浩 2018-03-14 05:33

    做法很多,可以用JQ加判断选择,也可以添加公共样式来选择。

    点赞 评论
  • zheng_qi1218
    zheng_qi1218 2018-03-14 14:15
    li:nth-child(n+5){ background:#ff0000; } li:last-child{ background:white }
    
    

    效果如下
    图片说明

    但有选择的情况还是建议用css写法

    最后nth-child用法如下
    :nth-child(2)选取第几个标签,“2可以是你想要的数字”

    .demo01 li:nth-child(2){background:#090}
    :nth-child(n+4)选取大于等于4标签,“n”表示从整数,下同

    .demo01 li:nth-child(n+4){background:#090}
    :nth-child(-n+4)选取小于等于4标签

    .demo01 li:nth-child(-n+4){background:#090}
    :nth-child(2n)选取偶数标签,2n也可以是even

    .demo01 li:nth-child(2n){background:#090}
    :nth-child(2n-1)选取奇数标签,2n-1可以是odd

    .demo01 li:nth-child(2n-1){background:#090}
    :nth-child(3n+1)自定义选取标签,3n+1表示“隔二取一”

    点赞 评论
  • weixin_39366606
    娜小鈊 2018-06-27 10:03

    ul>li的:gt(4)和:lt(8)

    点赞 评论

相关推荐