html-lists | 易学教程

Anchor tag not working inside List Item

阅读更多关于 Anchor tag not working inside List Item

问题 https://jsfiddle.net/1exbczjy/ <body> <section class="main"> <form class="search" action=""> <input type="search" id ="searchit" placeholder="search.." /> <ul class="results" id="searchlist"> </ul> </form> </section> </body> This is a demo of the code that I am trying to run , my original code contains js file which is dynamically populating my ul class using the innerHTML function but the output is same as the dummy list data I have provided. I am not able to understand why my list tag does

Change text color when hovered over li

阅读更多关于 Change text color when hovered over li

问题 I want to change the text color of links when an <li> element is hovered over. Right now I have #nav li a:hover { margin-left: -10px; padding-left: 10px; background-color: #13118C; color: white; font-weight: bold; width: 100%; } #nav ul li:hover { margin-left: -10px; padding-left: 10px; background-color: #13118C; color: white; font-weight: bold; width: 100%; } However, this only changes the text color when the link itself is hovered over. If the mouse is slightly to the right of the link, the

HTML5 nested lists: Indented list item without parent possible?

阅读更多关于 HTML5 nested lists: Indented list item without parent possible?

问题 I'm working on a text editor based on a contenteditable DIV. I'd like to produce valid HTML5, but ran into problems with nesting lists. The following two formatting examples seem to be impossible to create using valid HTML5 because they would require nesting a <ul> element as a direct child of the parent <ul> : Scenario 1: Empty parent item ● ○ nested item with empty parent Scenario 2: Nested item without parent list item ○ nested item without parent I read https://stackoverflow.com/a/5899394

Color names allowed in HTML/CSS

阅读更多关于 Color names allowed in HTML/CSS

问题 I know and use a few color names like 'white', 'blue', 'red', is there a complete list of colors allowed in HTML/CSS ? 回答1: There are a plethora of colors listed at http://www.w3schools.com/HTML/html_colornames.asp. There's also a cautionary note at the bottom: Note: The names above are not a part of the W3C web standard. The W3C HTML and CSS standards have listed only 16 valid color names: aqua, black, blue, fuchsia, gray, green, lime, maroon, navy, olive, purple, red, silver, teal, white,

2 column lists gets separated by its heading

阅读更多关于 2 column lists gets separated by its heading

问题 I was trying to get the h2 along with its list items, but every time the list count varies the header seems to be appearing in separate column and its lists in other column is there any way that the header should be stuck along with its lists? below is my code, ul li { list-style-type: none; } .list-parent ul li a { color: #428bca; } ul.list-parent { columns: 2 } .list-parent h2 { margin: 15px 0; } <h2 class="heading">Main Heading</h2> <div class="row"> <div class="col-sm-12"> <ul class="list

How do I make css affect list item in .js only and not in my .html

阅读更多关于 How do I make css affect list item in .js only and not in my .html

问题 I am currently using Visual Studio Code to develop a web application and I have 3 files index.html, styles.css and app.js Currently in my html, I am creating a navbar based on ul and li whereas in my app.js, I am also using ul li to create a list to show values pulled from my database. My issue is, in my css, this styles meant for my app.js only, is appearing for my index.html li items as well. I understand why it is happening, but I am unsure of how to fix this. li{ padding: 20px; background

Javascript to create an li and append to an ol

阅读更多关于 Javascript to create an li and append to an ol

问题 I'm trying to use JavaScript to create an li and append it to an existing ol. The code I am using is <ol id=summaryOL> </ol> function change(txt) { var x=document.getElementById("summaryOL"); newLI = document.createElementNS(null,"li"); newText = document.createTextNode(txt); newLI.appendChild(newText); x.appendChild(newLI); } change("this is the first change"); change("this is the second change"); These should look like: 1. this is ... 2. this is ... But look like: this is the first

Add Bullets with proper formatting in Android

阅读更多关于 Add Bullets with proper formatting in Android

问题 I wanted to show bullets in android text. I have added them successfully. I search over internet and found that you can add bullets. but if text goes more than one line it does not follow proper spacing like html list does. See Screenshot below. I have used following code to add bullets. String longDescription = "Enhanced bass performance.\n" + "Lightweight headband enhances comfort and adds durability\n" + "Easy to adjust headband ensures optimum fit and comfort\n" + "2 metre-long cable";

HTML ARIA validation issues (HTML5)

阅读更多关于 HTML ARIA validation issues (HTML5)

问题 I pretty much make sure my website(s) always validates. So today, after changing a certain item on my website, I ran the W3C validator once again. And suddenly got about 20 errors - which weren't there on thursday (2 days ago). (For my validation I chose HTML5 / UTF8 - just like last time) For some reason I now get a: Element li is missing one or more of the following attributes: aria-checked, aria-expanded, aria-valuemax, aria-valuemin, aria-valuenow, aria-valuetext, role."-error for every

can we give <div> within <li>

阅读更多关于 can we give within

问题 can we give div tag within un order list tag.............. it will be in this format <li><div>blablabla</div></li> Is it Possible 回答1: There are a lot of people that say a division inside a list item is incorrect, but according to the W3C validator it is perfectly fine. You'll never catch me putting divisions inside a list item though. Lists are too malformed to be putting additional block-level elements inside them. 回答2: Syntactically, if you are unsure about the nesting of elements, there