HTML unordered list project symbols are written in the CSS format of the image _ HTML/Xhtml _ webpage Creation

There is such a requirement that the content is an unordered list and the project symbol of the list must use thumbnails. In this article, we use the CSS Method for layout implementation. For details, refer to create an HTML page, the content is an unordered list that contains at least five best-selling books. The previous project symbols of each book must use thumbnail of the overview cover. This information can be obtained from the Web. CSS layout is required.

HTML:

The Code is as follows:

Best-selling Linux books

• Laruence's Linux private kitchen Basics


• Laruence's Linux private kitchen Server


• Linux Command Line and shell script Programming


• Linux O & M path


• Linux/Unix programming manual

Book.css:

The Code is as follows:

. Diffentcolor {color: green ;}
# Differcolor {color: green}
Body, td, p,. p, {
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;
}
P # container {width: 500 p}
P # menu {width: 150px; float: left ;}
P # 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 );
}