携程页面（适配）

最新推荐文章于 2022-04-01 12:12:52 发布

Caishunqi

最新推荐文章于 2022-04-01 12:12:52 发布

阅读量1.2k

点赞数 1

分类专栏： css HTML

本文链接：https://blog.csdn.net/weshouldhelp/article/details/82252731

版权

这篇博客展示了携程页面的HTML结构和CSS样式，详细解释了如何进行响应式设计以适应不同设备的屏幕尺寸。内容包括头部适配设置、导航栏布局、链接样式、图片全屏显示以及底部导航和页脚的样式设计。通过这段代码，读者可以学习到如何创建具有良好用户体验的网页布局。

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

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />

/*适配头*/
       <meta name="viewport" content="width=device-width,user-scalable=no,initial-scale=1.0,maximum-scale=1.0,minimum-scale=1.0" />
       <title></title>
   </head>
   <style>
       *{
           margin: 0;
           padding: 0;
           list-style: none;
       }
       a{
           text-decoration: none;
           color: #333;
       }
       img{
           display: block;
           width: 100%;
       }
       .nav .item{
           height: 90px;
           display: flex;
           background-color: deeppink;
           margin: 10px;
           border-radius: 15px;
       }
       .nav .item:nth-child(2){
           background-color: mediumseagreen;
       }
       .nav .item:nth-child(3){
           background-color: #daa520;
       }
       .nav .item:nth-child(4){
           background-co

最低0.47元/天解锁文章

Caishunqi

关注

1
点赞
踩
2

收藏

觉得还不错? 一键收藏
0
评论
携程页面（适配）

&lt;!DOCTYPE html&gt;&lt;html&gt; &lt;head&gt; &lt;meta charset="utf-8" /&gt; /*适配头*/ &lt;meta name="viewport" content="width=device-width,user-scalable=no,ini
复制链接

扫一扫

专栏目录