How to write HTML unordered list bullets using images in CSS_HTML/Xhtml_Web page production

Create an HTML page with an unordered list of at least 5 best-selling books. The bullet before each book must be a thumbnail outlining the cover. This information can be obtained on the Web. It is required to use CSS method for layout.

HTML:

Copy code

The code is as follows:

< ;html>

Linux Bestseller

• Brother Niao’s Basics of Linux Private Kitchen

< ;li id="book2">Niao Ge's Linux private kitchen server article

• Linux command line and shell script programming encyclopedia


• Linux Operation and Maintenance


• Linux/Unix System Programming Manual

< /ul>

book.css:

Copy the code

The code is as follows:

.diffentcolor{color:green;}
#differcolor{color:green}
body, td, div, .p, a {
font-family: arial,sans-serif;
}
h1,h2{
font-family:sans-serif;
color:gray;
}
.author{
by:svitter;
}
h1{
border-bottom:1px solid black;
border-bottom:1px ;
solid black;
}
div#container{width:500p}
div#menu {width:150px;float:left;}
div#content {float:left;}
li#book1{
list-style-image:url(pic/popularBook.jpg);
}
li#book2{
list-style-image:url(pic/popularBook2 .jpg);
}
li#book3{
list-style-image:url(pic/popularBook3.jpg);
}
li#book4{
list-style -image:url(pic/popularBook4.jpg);
}
li#book5{
list-style-image:url(pic/popularBook5.jpg);
}