and re "those <p> tags:
inside the list items, they force (usually) a blank line which trails the content so that there's a blank line between bullets.

eg:

<ul>
<li><p>foo</p></li>
<li><p>foo1</p></li>
<li>foo2</li>
<li>foo3</li>
</ul>
[download]

will look like this:

∙ foo

∙ foo1

∙ foo2
∙ foo3

And, as ikegami said, you can control the presentation with css -- http://www.w3schools.com/ has a decent tutorial if you're unfamiliar with style sheets. Once you have the basics, you may find it worthwhile to read the various css specs at http://www.w3.org/Style/CSS/.

For a example (anything more is well outside the scope of the Monastery), change the display of those updated for clarity the content of the list-items with something like this (inline for ease of display):

<ul>
<li><p style="color: red; background-color: transparent; font-size: 1.
+1em; font-weight:bold;">foo</p></li>
<li><p style="color: #000000; background-color: #dddddd;; font-size: 1
+.1em; font-weight:bold;">foo1</p></li>
<li style="color: blue; background-color: transparent; font-size: 1.1e
+m; font-weight:bold;">foo2</li>
<li style="font-size: 1.1em; font-weight:bold;">foo3</li>
</ul>
[download]

which would give you bold, slightly larger than normal-font-size type, with "foo" in red; "foo1" in black on a silver background; "foo2" in blue, and "foo3" in black again (assuming you had not used some other color as a default for the page.

Update ikegami provides a more technical (and CORRECT) answer; however, if you're just starting with css the code and descriptions of the rendering are correct; the statement re the placement of the blank lines is imprecise ok, admit it! wrong.