I'm trying to write this code:
<ul>
<li> 1
<li> 2
<li> 3
Whithout </li>.
How would this html code look on the Jade lang?
I don't think you should do this.
But here's a way (a really dirty hack. Not recommended!) - writing li/ would mean that li is self closing. So if you have doctype html, it would generate the desired output.
doctype html
...
ul
li/
| 1
li/
| 2
The output:
<ul>
<li> 1
<li> 2
</ul>
Again, you shouldn't do this. Just close the goddamn tag.
Related
My link doesn't work in HTML and I don't know why.
<div class="banner-text">
<ul>
<li><h3>HOME</h3></li>
</li><h3>ABOUT US</h3></li>
</li><h3>CONTACT</h3></li>
</li><h3>STUDENT's CORNER</h3></li>
</ul>
<h1 class="big">CHAWLA CLASSES</h1>
</div>
Use a validator.
Only <li> elements may be children of <ul> elements.
Put the links in the list items, not the other way around.
Asides:
Level 3 heading elements should be used for headings. If the entirely content of a list item is a heading, you are using the wrong markup. Apply CSS if you want to format the list items.
Screen readers will tend to spell out words written in ALL CAPS letter-by-letter. If you want something to be visually rendered in capital letters: Use the CSS text-transform property.
You should change it like this
<ul>
<li> Home </li>
<li> About Us </li>
<li> Contact </li>
<li> Student's Corner </li>
</ul>
UPDATE: Well, I check again but it works. There is the screenshots
1
2
Put the anchor tag inside the <li> tag. If it doesn't work, go-to developer console to trace it .
The HTML 4 spec treats the following as a deprecated example (search for "DEPRECATED EXAMPLE"):
<UL>
<LI> ... Level one, number one...
<OL>
<LI> ... Level two, number one...
<LI> ... Level two, number two...
<OL start="10">
<LI> ... Level three, number one...
</OL>
<LI> ... Level two, number three...
</OL>
<LI> ... Level one, number two...
</UL>
Why is this example deprecated?
The start attribute is deprecated in HTML 4 (it is un-deprecated in HTML 5). Everything else about the example is fine.
The spec details the proper way to nest ul and ol elements. They must be encased in an li element, as follows:
<ul>
<li>
<ol>
<li>Hello there</li>
</ol>
</li>
</ul>
However in your example, the lists are not wrapped in an li tag, meaning that it would fail HTML validation.
I have code :
<ul>
<li>home</li><span class="divider"> | </span>
.....
</ul>
and
<ul><li>one</li> | <li>two</li> | <li>three</li></ul>
But validator say it wrong. What should I do?
The allowed elements inside a <ul> is simply <li>:
Permitted contents
Zero or more li elements
http://www.w3.org/TR/html-markup/ul.html
If you want to add borders / piping, use CSS. Like this example (for simplicity)
<ul>
<li style="border-right:solid 1px #000;">Home</li>
<li style="border-right:solid 1px #000;">About Me</li>
</ul>
As you get more familiar with CSS, you'll find better ways to do that... and also not inline.
All tags directly beneath a <ul> tag must be <li> tags. These <li> tags can contain spans, but the <ul> itself should not.
Why is the following code valid when I am using a <div> inside a <li>?
<ul>
<li class="aschild">
<div class="nav">Test</div>
</li>
</ul>
Yes you can use a div inside a li and it will validate.
<!ELEMENT li %Flow;>
<!ENTITY % Flow "(#PCDATA | %block; | form | %inline; | %misc;)*">
<!ENTITY % block "p | %heading; | div | %lists; | %blocktext; | fieldset | table">
Inside a <li> you can have anything you could naturally put inside a <div>. They are no different in this sense.
It should be valid in HTML4, XHTML and HTML5 as well.
This is NOT valid though (so the sources you found about "no divs in lists" could refer to this situation):
<ul>
<li></li>
<div></div>
<li></li>
</ul>
So: Lists (ul, ol) can only have lis as their children. But lis can have anything as their children.
Because <li> is a block element, not an inline element like <span> or <a>.
An <li> is a block element, and will work perfectly fine with other block elements inside.
Yes, you can. As much as you want.
if you take a look with your developer tools and inspect katespade website's code you will find that you can add as many div inside a Li tag but you cannot add the tag as a child in <ul> or <ol>.
<ul>
<li> <div class="example1>
<span>lorem ipsum </span>
</div> </li>
<li> </li>
</ul>
here is an example on this katespade's web app
Katespade
Is there an open-source library or code-sample in C#, that will re-indent a string of HTML code?
For example, convert this:
<li>
this
</li><li>that
</li>
To this:
<li>
this
</li>
<li>
that
</li>
Note: I don't want any of the HTML to be altered or moved around the way HTML Tidy does.
I only want the markup to be re-indented, nothing else.
Using Notepad++ if you paste your sample in and choose Language | Html and then Text FX | Text FX Html Tidy | Tidy Reindent Xml ...
Your sample becomes:
<li>
this
</li>
<li>
that
</li>