旅游网站html代码

<!DOCTYPE html>
<html>
<head>
<title>旅游网站</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<header>
<nav>
<ul>
<li><a href="#">首页</a></li>
<li><a href="#">旅游攻略</a></li>
<li><a href="#">景点推荐</a></li>
<li><a href="#">酒店预订</a></li>
<li><a href="#">机票预订</a></li>
<li><a href="#">联系我们</a></li>
</ul>
</nav>
<div class="hero">
<h1>欢迎来到旅游网站</h1>
<p>发现更多美丽的风景,体验不一样的旅行</p>
<a href="#" class="btn">开始探索</a>
</div>
</header>
<section class="features">
<div class="feature">
<img src="https://via.placeholder.com/300x200" alt="feature image">
<h2>旅游攻略</h2>
<p>了解更多旅游目的地的信息,制定更旅行计划</p>
<a href="#" class="btn">查看更多</a>
</div>
<div class="feature">
<img src="https://via.placeholder.com/300x200" alt="feature image">
<h2>景点推荐</h2>
<p>发现更多美丽的景点,体验不一样的旅行</p>
<a href="#" class="btn">查看更多</a>
</div>
<div class="feature">
<img src="https://via.placeholder.com/300x200" alt="feature image">
<h2>酒店预订</h2>
<p>预订更酒店,享受更舒适的住宿体验</p>
<a href="#" class="btn">查看更多</a>
</div>
<div class="feature">
<img src="https://via.placeholder.com/300x200" alt="feature image">
<h2>机票预订</h2>
<p>预订更便宜的机票,享受更方便的旅行</p>
<a href="#" class="btn">查看更多</a>
</div>
</section>
<section class="testimonials">
<h2>客户评价</h2>
<div class="testimonial">
<blockquote>
<p>这是我最旅行经历之一,我发现了很多美丽的景点,也结交了很多新朋友。</p>
</blockquote>
<div class="author">
<img src="https://via.placeholder.com/100x100" alt="author image">
<p>张三</p>
</div>
</div>
<div class="testimonial">
<blockquote>
<p>这是我第一次旅行,我非常喜欢这个网站提供的旅游攻略和酒店预订服务。</p>
</blockquote>
<div class="author">
<img src="https://via.placeholder.com/100x100" alt="author image">
<p>李四</p>
</div>
</div>
<div class="testimonial">
<blockquote>
<p>这是我第二次使用这个网站预订机票,我非常满意他们的服务。</p>
</blockquote>
<div class="author">
<img src="https://via.placeholder.com/100x100" alt="author image">
<p>王五</p>
</div>
</div>
</section>
<footer>
<p>版权所有 © 2021 旅游网站</p>
</footer>
</body>
</html>

下面我会。

在上面的代码中,我们可以看到以下几个部分:

DOCTYPE声明:<!DOCTYPE html>,用于指定文档类型为HTML5。

HTML标签:<html>,用于定义HTML文档。

Head标签:<head>,用于定义文档的头部,包含了文档的元数据,如标题、字符集、视口等。

Title标签:用于定义文档的标题,显示在浏览器的标题栏上。

Meta标签:用于定义文档的元数据,如字符集、视口等。

Link标签:用于引入外部样式表。

Body标签:<body>,用于定义文档的主体部分。

Header标签:<header>,用于定义文档的头部,通常包含网站的logo、导航栏、主要的图片等。

Nav标签:用于定义导航栏。

Ul标签:用于定义无序列表。

Li标签:用于定义列表项。

Div标签:用于定义文档中的块级元素。

Section标签:用于定义文档中的节。

Img标签:用于定义图像。

H1-H2标签:用于定义标题。

P标签:用于定义段落。

A标签:用于定义超链接。

Blockquote标签:用于定义长引用。

Testimonials标签:用于定义客户评价部分。

Blockquote标签:用于定义长引用。

Author标签:用于定义客户评价中的作者信息。

Footer标签:<footer>,用于定义文档的页脚部分。

在实际开发中,我们可以根据需要添加或删除这些标签,以满足不同的需求。