jQuery changing style of HTML element

后端 未结 6 1318
星月不相逢
星月不相逢 2020-12-07 19:23

I have a list on HTML

And the winner isn\'t...&l
相关标签:
6条回答
  • 2020-12-07 20:04
    $('#navigation ul li').css('display', 'inline-block');
    

    not a colon, a comma

    0 讨论(0)
  • 2020-12-07 20:04

    I think you can use this code also: and you can manage your class css better

    <style>
       .navigationClass{
            display: inline-block;
            padding: 0px 0px 0px 6px;
            background-color: whitesmoke;
            border-radius: 2px;
        }
    </style>
    <div id="header" class="row">
        <div id="logo" class="col_12">And the winner is<span>n't...</span></div> 
        <div id="navigation" class="row"> 
            <ul id="pirra">
                <li><a href="#">Why?</a></li>
                <li><a href="#">Synopsis</a></li>
                <li><a href="#">Stills/Photos</a></li>
                <li><a href="#">Videos/clips</a></li>
                <li><a href="#">Quotes</a></li>
                <li><a href="#">Quiz</a></li>
            </ul>
        </div>
     <script>
        $(document).ready(function() {
    $('#navigation ul li').addClass('navigationClass'); //add class navigationClass to the #navigation .
    
    });
     </script>
    
    0 讨论(0)
  • 2020-12-07 20:10

    changing style with jquery

    Try This

    $('#selector_id').css('display','none');
    

    You can also change multiple attribute in a single query

    Try This

    $('#replace-div').css({'padding-top': '5px' , 'margin' : '10px'});
    
    0 讨论(0)
  • 2020-12-07 20:20

    you could also specify multiple style values like this

    $('#navigation ul li').css({'display': 'inline-block','background-color': '#ff0000', 'color': '#ffffff'});
    
    0 讨论(0)
  • 2020-12-07 20:24

    Use this:

    $('#navigation ul li').css('display', 'inline-block');
    

    Also, as others have stated, if you want to make multiple css changes at once, that's when you would add the curly braces (for object notation), and it would look something like this (if you wanted to change, say, 'background-color' and 'position' in addition to 'display'):

    $('#navigation ul li').css({'display': 'inline-block', 'background-color': '#fff', 'position': 'relative'}); //The specific CSS changes after the first one, are, of course, just examples.
    
    0 讨论(0)
  • 2020-12-07 20:25
    $('#navigation ul li').css({'display' : 'inline-block'});
    

    It seems a typo there ...syntax mistake :))

    0 讨论(0)
提交回复
热议问题