HTML unordered list bullet points using images CSS writing

Create an HTML page with an unordered list of at least five best-selling books. The bullet point before each book must be a thumbnail that summarizes the cover. This information can be obtained on the Web. Requires CSS approach for layout.

HTML:

Copy code

The code is as follows:

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<link href="book.css" rel="stylesheet" type="text/css">
</head>

<body>
<div>
<h1 class="diffentcolor">Linux Bestsellers</h1>
<div id="menu">

</div>
<div id="content">
<ul>
<li id="book1">Bird Brother's Linux Private Recipe Basics</li>
<li id="book2">Bird Brother's Linux Private Kitchen Server Edition</li>
<li id="book3">Linux command line and shell script programming encyclopedia</li>
<li id="book4">Linux Operation and Maintenance</li>
<li id="book5">Linux/Unix System Programming Manual</li>
</ul>
</div>
</div>
</body>

book.css:

Copy 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);
}

<<: idea uses docker plug-in to achieve one-click automated deployment

>>: JS practical object-oriented snake game example

CSS implements the bottom tapbar function

HTML unordered list bullet points using images CSS writing

CSS implements the bottom tapbar function

A brief discussion on VUE uni-app's commonly used APIs

Detailed steps for running springboot project in Linux Docker

jQuery implements all selection and reverse selection operation case

Summary of Mysql update multi-table joint update method

Detailed graphic and text tutorial on downloading, installing and configuring mysql-5.7.28 under Windows

MySQL 5.7.16 free installation version graphic tutorial under Linux

Introduction to HTML method of opening link files using hyperlinks

WeChat applet implements the Record function

Vue implements carousel animation

Recommend

How to filter out duplicate data when inserting large amounts of data into MySQL

A brief understanding of the relevant locks in MySQL

Detailed explanation of fuser command usage in Linux

Detailed example of sorting function field() in MySQL

Detailed explanation of the basic implementation principle of MySQL DISTINCT

How to install and uninstall IIS7 components using the WIN2008 server command line

Understanding MySQL Locking Based on Update SQL Statements

A detailed introduction to Linux system operation levels

Docker case analysis: Building a Redis service

Things to note when designing web pages for small-screen mobile devices

Excel export always fails in docker environment

How to change the Ali source in Ubuntu 20.04

A brief talk about Rx responsive programming

Two ways to exit bash in docker container under Linux

Script example for starting and stopping spring boot projects in Linux