html-lists

问题 I want to hide all the <li> if they are empty or if there any blank space in <li> . I am doing it like this: $("li:empty").filter(function(i,v){return $.trim($(v).text()).length == 0;}).css('display', 'none'); Is this the wrong syntax? If I create a class to make empty <li> invisible, it works fine. Like this: $("li[class='hideLi']").filter(function(i,v){return $.trim($(v).text()).length == 0;}).css('display', 'none'); But I don't know which <li> will be empty . Can anybody help me plz. I

问题 I have a nav bar with dropdown menus, I would like the dropdown menus to stretch to whatever width necessary for the content inside it, but they will only go as wide as their parent element I've read quite a bit on this, and most people suggest setting position:absolute on the dropdown menus. I've already done this and it doesn't effect it My jsFiddle is here: http://jsfiddle.net/Rqgh6/ Does anyone know how I can get it the dropdowns to go wider than their parent element? 回答1: You can simply

问题 What I have: An ordered list with a custom counter: ol { /*list-style-type:decimal-leading-zero;*/ list-style: none; padding-left: 0px; counter-reset: item; } ol>li { display: table; counter-increment: item; } ol>li:before { display: table-cell; padding: 0 0.5em 0 0; content: counter(item) "."; font-weight: bold; } <ol> <li>List item one.</li> <li>List item two.</li> <li>List item three.</li> <li>List item four.</li> <li>List item five.</li> <li>List item six.</li> <li>List item seven.</li>

问题 I wanted to create colored list-markers for <ul> and I did it, but in all lists now the list-style-position attribute does not works. Here is the code: ul.FirmStyle { list-style-type: none; } ul.FirmStyle li:before { color: orange; content: "▪"; list-style-position: outside; /* !!!!!! */ margin-left: 10px; } <ul class="FirmStyle"> <li>A lot of texttttttttttttttttt-t-t-t-tttttttt-tt-tt-tt-ttttt-t-tttttt-t-tttt-tttt</li> <li>Text</li> </ul> Why? 回答1: As per W3C Specs, the list-style-position

问题 I need to push all my ID's into an array, both ways I've tried this only pushes the first ID into the array: var some = []; $('ul#jdLists li').each(function () { some.push([$('ul#jdLists li').attr("id")]); }); This returns the correct number of items in the array but with the ID of the first li or var some = []; some.push([$('ul#jdLists li').attr("id")]); this returns a single item with the first li ID thanks 回答1: This piece of code: some.push([$('ul#jdLists li').attr("id")]); will push id of

问题 Wordpress outputs my child menus inside this ul tag... <ul class="sub-menu"> how can I wrap a simple div around it? Preferably a way to do it through functions.php, but jquery can work too. 回答1: While it would be EASY to use something like jQuery to wrap your child menus, it is NOT good practice to use jQuery for this purpose. Place this in functions.php: class Child_Wrap extends Walker_Nav_Menu { function start_lvl(&$output, $depth = 0, $args = array()) { $indent = str_repeat("\t", $depth);

问题 I've got this menu wich is setup inline and has dropdowns. The inner ul has a background. Each dropdown li has a :hover that changes the background of the li : <div id="navMain"> <ul> <li><a href="#nogo">Forside</a> <ul> <li><a href="#nogo">1111111111111</a></li> <li><a href="#nogo">Link 1-2</a></li> <!-- etc. --> </ul> </li> <li><a href="#nogo">Om Os</a> <ul> <li><a href="#nogo">Link 2-1</a></li> <li><a href="#nogo">Link 2-2</a></li> <!-- etc. --> </ul> </li> <li><a href="#nogo">Link 3</a>

问题 I would like to alternate list-style-type properties for ul lists, so that the outer is a disc, then one inner ul list is a circle, than one more inner is a disc, and so on. Essentially, what I want is this: <ul><!-- use disc --> <li>Lorem ipsum</li> <li> <ul><!-- use circle --> <li>Lorem ipsum</li> <li> <ul><!-- use disc --> <li>Lorem ipsum</li> </ul> </li> <li>Lorem ipsum</li> </ul> </li> <li>Lorem ipsum</li> </ul> How would I accomplish this using CSS? 回答1: Like this... li { list-style:

问题 I'm having an issue with a menu un-ordered list. Whereby the list items are over running the <ul> and <div> boundaries and only starting the next line once it has reach the edge of the screen. Heres the website: http://finalonline.co.uk/mypics/gallery/categories/ 回答1: You can use float: left; on the li s instead of display: inline; . Just remember to also use overflow: hidden; on the parent element (the ul ). Another option would be to use: display: inline-block , but I'm not 100% sure about

问题 It's difficult to tell what is being asked here. This question is ambiguous, vague, incomplete, overly broad, or rhetorical and cannot be reasonably answered in its current form. For help clarifying this question so that it can be reopened, visit the help center. Closed 7 years ago . What would be the best way of achieving an unordered list that would look like this? 回答1: You might want to take a look at jQuery Masonry. As far as I know, it's probably the most popular tool used to achieve