HTML第六章上机题3-------聚美优品美容热点列表

原创

于 2016-10-18 15:33:03 发布 · 3k 阅读

2 ·

CC 4.0 BY-SA版权

这是一个HTML代码示例，展示了如何创建一个聚美优品美容热点产品的列表。列表包含10个产品，每个产品都有编号、名称，并使用了CSS进行样式设计，包括背景颜色、边框、字体样式等，提供了鼠标悬停效果。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>聚美优品美容热点</title>
<style type="text/css">
body {
	background-color: #FF9;
}
.m {
	width:350px;
	border-top-width: thin;<img src="https://img-blog.youkuaiyun.com/20161018153241568?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQv/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/Center" alt="" />
	border-top-style: solid;
	border-top-color:#000;
	list-style-type:none;
	background:#FFF;
}
ul {
	padding:0px;
	margin:0px;
}
.sty {
	font-size: 24px;
	font-weight: bold;
	color: #FFF;
	background-color: #F9F;
}
.text  {
	border-bottom-color:#CCC;
	border-bottom-style:dashed;
	font-size:14px;
	
}
a span {
	color:#FFF;
	background:url(file:///C|/Users/Administrator/