用html和css写一个介绍黄焖鸡的网页
时间: 2023-10-02 15:10:21 浏览: 53
好的,以下是一个简单的介绍黄焖鸡的网页:
```html
<!DOCTYPE html>
<html>
<head>
<title>黄焖鸡介绍</title>
<style>
body {
font-family: Arial, sans-serif;
margin: 0;
padding: 0;
}
header {
background-color: #FFA500;
padding: 20px;
color: white;
text-align: center;
font-size: 36px;
}
main {
padding: 20px;
display: flex;
flex-wrap: wrap;
justify-content: space-around;
}
article {
background-color: #F5DEB3;
width: 300px;
margin: 20px;
padding: 20px;
border-radius: 10px;
box-shadow: 5px 5px 10px #888888;
}
h2 {
margin-top: 0;
}
p {
margin-bottom: 0;
}
</style>
</head>
<body>
<header>
<h1>黄焖鸡介绍</h1>
</header>
<main>
<article>
<h2>什么是黄焖鸡?</h2>
<p>黄焖鸡是一道中国传统的烹饪菜肴,主要由鸡肉、土豆、胡萝卜、辣椒等食材制作而成。</p>
</article>
<article>
<h2>黄焖鸡的起源</h2>
<p>黄焖鸡起源于中国湖南省,后经过不断改良和发展,已经成为了一道享誉全国的美食。</p>
</article>
<article>
<h2>如何制作黄焖鸡?</h2>
<p>制作黄焖鸡的步骤包括:将鸡肉切块,腌制一段时间,炒香配料,加入鸡肉、土豆、胡萝卜、辣椒等材料,加水焖煮,调味即可。</p>
</article>
<article>
<h2>黄焖鸡的营养价值</h2>
<p>黄焖鸡中含有丰富的蛋白质和各种维生素,而且口感鲜美,深受人们的喜爱。</p>
</article>
</main>
</body>
</html>
```
这个网页包含了一个页面标题、一个页面头部、以及四个简单的文章介绍黄焖鸡的相关内容。使用 CSS 对页面进行了简单的美化,包括了字体、颜色、边距、阴影等方面的设置。