构建移动版旅游网站页面（大专）

最新推荐文章于 2024-06-13 23:18:49 发布

孙诗宇ya~

最新推荐文章于 2024-06-13 23:18:49 发布

阅读量1.1k

点赞数 4

分类专栏：响应式web 开发项目教程文章标签： html5 css3

本文链接：https://blog.csdn.net/Huskylove/article/details/115731111

版权

这篇博客主要介绍了如何构建一个适用于移动端的旅游网站页面，包括HTML和CSS的使用。作者提供了页面的预览效果，并分享了相关资源的下载链接，包含HTML文件、CSS样式及图片素材。

摘要由CSDN通过智能技术生成

构建移动版旅游网站页面（大专）

效果如下：
在这里插入图片描述

在这里插入图片描述
资源分享：
网址：https://pan.baidu.com/s/1hnGeeaBam0FHwZTwqJZ31g
密码：1234

代码形式：
在这里插入图片描述
代码如下：
html：
1.html：

<!DOCTYPE html>
<html lang="zh-cn">
 <head>
  <meta charset="utf-8" />
  <title>国内旅游</title>
  <!--链入对网页某类型元素的通用设置样式表-->
  <link href="css/common.css" rel="stylesheet" type="text/css" />
  <!--链入对某个元素的特定设置的样式表-->
  <link href="css/main.css" rel="stylesheet" type="text/css" />
 </head>
 <body>
  <!--右半边-->
  <section class="qui-page">
   <!--header-->
   <header class="qui-header">
    <h1>国内旅游计划</h1>
   </header>
   <!--/header-->
   <!--begin-->
   <section class="container">
    <!--<section></section>语义化元素表示页面中的一个内容区块-->
    <div class="plcRouteList">
     <a href="#"> <img src="images/fengjing.jpg" width="100%" alt="" class="pic" />