1. Toy模板网首页
  2. > Toy博客

携程网移动端首页制作（html5+css3）

10月前 作者：俗世没有清欢 分类：Toy博客 阅读(43) 违法举报

这篇具有很好参考价值的文章主要介绍了携程网移动端首页制作（html5+css3）。希望对大家有所帮助。如果存在错误或未考虑完全的地方，请大家不吝赐教，您也可以点击"举报违法"按钮提交疑问。

1.预期完成效果

主要是自己做记录，记录做的过程以及遇到的一些问题

携程网移动端首页制作（html5+css3）

2.开始制作

2.1 搜索框的制作

携程网移动端首页制作（html5+css3）

1.首先引入normal.css（Normalize.css: Make browsers render all elements more consistently.）。其中搜索符号使用图标，阿里图标（iconfont-阿里巴巴矢量图标库）：打开网址搜索需要的图标，添加到自己的项目中，点击“download code” ，下载后将压缩包放进项目中进行解压使用。

携程网移动端首页制作（html5+css3）

2.遇到的问题：手机模式下搜索框显示不完全

携程网移动端首页制作（html5+css3）

解决：给搜索框最大的盒子添加width:100%;

2.2 导航栏的制作

携程网移动端首页制作（html5+css3）

1.上面为图标，下面为文字的，可以采用flex布局将主轴设置成y轴，然后将侧轴设置为居中对齐。

2.渐变色的制作：background: -webkit-linear-gradient(起始方向 颜色1, 颜色2,...);

3.flex:wrap;换行

2.3销售模块制作

携程网移动端首页制作（html5+css3）

1.分为两个盒子，采用flex布局，各占50%

2.遇到的问题：

（1）在切换为移动设备仿真时，页面显示不完全，如图

携程网移动端首页制作（html5+css3）

修改了<head></head>标签中的 <meta name="viewport"   content="width=device-width,user-scalable=no,initial-scale=0.7,user-scalable=yes,maximum-scale=1.0,minimum-scale=0.7">，将原本的1.0替换成了0.7，虽然可以正常显示了，但是不知道有没有更好的方法。

（2）写“权威排行榜”的时候样式突然不起效果，如图

携程网移动端首页制作（html5+css3）

后来发现自己html代码中把它的类名写错位置了，写在了href里面哈哈哈哈我还疑惑了半天 

（3）滚动的时候搜索框无法显示在最上面，如图

携程网移动端首页制作（html5+css3）

 给搜索框的大盒子添加 z-index: 1;置于最上层

2.4 底部图片

携程网移动端首页制作（html5+css3）

1.准备一个盒子，放一张图片

2.5 底部工具模块

携程网移动端首页制作（html5+css3）

1.需要下载新图标；小竖线采用伪类选择器做；&nbsp；空格符号

2.遇到的问题：

（1）在做“网站地图”和“电脑版”中间那根小竖线时，用的after伪类选择器，采用定位，但是一直没有内容，后面发现是把background-color写成了color

（2）2022前面的那个符号不会写，不知道是怎么来的

2.6 底部导航栏模块

携程网移动端首页制作（html5+css3）

1.大盒子用flex布局，每个占25%；小盒子为一个图标加文字，采用flex布局，将主轴设置成y轴；图标是精灵图

3. 代码部分

html代码

<!DOCTYPE html>
<html lang="zh-CN">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport"
        content="width=device-width,user-scalable=no,initial-scale=0.7,user-scalable=yes,maximum-scale=1.0,minimum-scale=0.7">
    <!-- 引入我们的css初始化文件 -->
    <link rel="stylesheet" href="css/normalize.css">
    <link rel="stylesheet" href="css/index.css">
    <title>携程旅行-酒店预订，机票预订查询</title>
</head>

<body>
    <!-- 搜索框 -->
    <div class="search-box">
        <div class="search">
            <i class="iconfont icon">&#xe651;</i>
            <span>搜索：目的地/酒店/景点/航班号</span>
        </div>
    </div>
    <!-- 导航栏 -->
    <nav>
        <ul class="nav-entry">
            <li class="nav-entry-li1">
                <a href="#">
                    <span class="nav-entry-icon1"></span>
                    <span>酒店</span>
                </a>
            </li>
            <li class="nav-entry-li2">
                <a href="#">
                    <span class="nav-entry-icon2"></span>
                    <span>机票</span>
                </a>
            </li>
            <li class="nav-entry-li3">
                <a href="#">
                    <span class="nav-entry-icon3"></span>
                    <span>火车票</span>
                </a>
            </li>
            <li class="nav-entry-li4">
                <a href="#">
                    <span class="nav-entry-icon4"></span>
                    <span>旅游</span>
                </a>
            </li>
            <li class="nav-entry-li5">
                <a href="#">
                    <span class="nav-entry-icon5"></span>
                    <span>攻略景点</span>
                </a>
            </li>
            <li class="nav-entry-li6">
                <a href="#">
                    <span class="nav-entry-icon6"></span>
                    <span>民宿/客栈</span>
                </a>
            </li>
            <li class="nav-entry-li7">
                <a href="#">
                    <span class="nav-entry-icon7"></span>
                    <span>机+酒</span>
                </a>
            </li>
            <li class="nav-entry-li8">
                <a href="#">
                    <span class="nav-entry-icon8"></span>
                    <span>汽车/船票</span>
                </a>
            </li>
            <li class="nav-entry-li9">
                <a href="#">
                    <span class="nav-entry-icon9"></span>
                    <span>门票/活动</span>
                </a>
            </li>
            <li class="nav-entry-li10">
                <a href="#">
                    <span class="nav-entry-icon10"></span>
                    <span>美食</span>
                </a>
            </li>
            <li class="nav-entry-li11">
                <a href="#">
                    <span class="nav-entry-icon11"></span>
                    <span>特价/爆款</span>
                </a>
            </li>
            <li class="nav-entry-li12">
                <a href="#">
                    <span class="nav-entry-icon12"></span>
                    <span>接送机/包车</span>
                </a>
            </li>
            <li class="nav-entry-li13">
                <a href="#">
                    <span class="nav-entry-icon13"></span>
                    <span>租车</span>
                </a>
            </li>
            <li class="nav-entry-li14">
                <a href="#">
                    <span class="nav-entry-icon14"></span>
                    <span>周边游</span>
                </a>
            </li>
            <li class="nav-entry-li15">
                <a href="#">
                    <span class="nav-entry-icon15"></span>
                    <span>购物/免税</span>
                </a>
            </li>
        </ul>
    </nav>
    <!-- 销售模块 -->
    <div class="sales">
        <div class="salse-hd">
            <!-- 左边 -->
            <div class="sales-tejia">
                <div class="tejia-hd">
                    <a href="#" class="tejia-hd-zuo"></a>
                    <a href="#" class="tejia-hd-you">特价好货直播中</a>
                </div>
                <div class="tejia-bd">
                    <a href="#"></a>
                </div>
                <div class="tejia-ft">
                    <a href="#">￥</a>
                    <a href="#">660</a>
                </div>
            </div>
            <!-- 右边 -->
            <div class="sales-rank">
                <div class="rank-hd">
                    <a href="#" class="rank-hd-zuo"></a>
                    <a href="#" class="rank-hd-you">权威排行榜</a>
                </div>
                <div class="rank-bd">
                    <div class="rank-bd-zuo">
                        <a href="#" class="tu"></a>
                        <span class="tubiao">上海</span>
                        <span class="text">上海10大奢华酒店</span>
                    </div>
                    <div class="rank-bd-you">
                        <a href="#" class="tu"></a>
                        <span class="tubiao">上海</span>
                        <span class="text">上海亲子乐园酒店榜</span>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- 底部图片 -->
    <div class="bottom-img">
        <a href="#"></a>
    </div>
    <!-- 底部功能模块 -->
    <div class="toolbox">
        <div class="tool-group">
            <a href="#" class="link">
                <span class="iconfont">&#xe88b;</span>
                <span>电话预订</span>
            </a>
            <a href="#" class="download">
                <span class="iconfont">&#xe668;</span>
                <span>下载携程</span>
            </a>
        </div>
        <div class="tool-text">
            <a href="#" class="zuo">网站地图</a>
            <a href="#">电脑版</a>
            <p>c2022携程旅行 &nbsp;泸ICP备08023580号</p>
        </div>
    </div>
    <!-- 底部导航栏 -->
    <!-- 局部导航栏 -->
    <ul class="bottom-nav">
        <li>
            <a href="#">
                <span class="local-nav-icon-icon1"></span>
                <span>首页</span>
            </a>
        </li>
        <li>
            <a href="#">
                <span class="local-nav-icon-icon2"></span>
                <span>社区</span>
            </a>
        </li>
        <li>
            <a href="#">
                <span class="local-nav-icon-icon3"></span>
                <span>消息</span>
            </a>
        </li>
        <li>
            <a href="#">
                <span class="local-nav-icon-icon4"></span>
                <span>我的</span>
            </a>
        </li>
    </ul>
</body>

</html>

 css代码

body {
    color: #000;
    /* 防止水平滚动条出现 */
    overflow-x: hidden;
    /* 防止一些元素点击之后背景会高亮 */
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    -webkit-text-size-adjust: none;
    max-width: 540px;
    min-width: 320px;
    margin: 0 auto;
    font: normal 14px/1.5 PingFangSC-regular, Tahoma, Lucida Grande, Verdana, Microsoft Yahei, STXihei, hei;
    background: #f4f4f4;
}

div {
    box-sizing: border-box;
}

ul li {
    list-style: none;
}

a {
    text-decoration: none;
}

@font-face {
    font-family: 'iconfont';
    src: url('../fonts/iconfont.woff2?t=1662898789972') format('woff2'),
        url('../fonts/iconfont.woff?t=1662898789972') format('woff'),
        url('../fonts/iconfont.ttf?t=1662898789972') format('truetype');
}

.iconfont {
    font-family: "iconfont" !important;
    font-size: 16px;
    font-style: normal;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* 搜索框 */
.search-box {
    /* 因为滚动时一直保持在上面，所以用固定定位 */
    position: fixed;
    /* 在页面最上层 */
    z-index: 1;
    top: 0;
    display: flex;
    width: 100%;
    height: 50px;
    max-width: 540px;
    min-width: 320px;
    background-color: #fff;
}

.search {
    flex: 1;
    width: 516px;
    height: 32px;
    border: 1.5px solid #377ab1;
    border-radius: 16px;
    margin: 10px;
}

.search .icon {
    position: absolute;
    top: 11px;
    left: 24px;
    font-size: 20px;
}

.search span {
    position: absolute;
    top: 13px;
    left: 53px;
    color: #a2a2a2;
    font-size: 16px;
}

/* 导航栏模块 */
nav {
    margin-top: 50px;
    height: 184px;
    width: 100%;
}

.nav-entry {
    display: flex;
    padding: 6px 12px 2px;
    background-color: #fff;
    /* 换行 */
    flex-wrap: wrap;
    /* 因为没有宽度所以只写上面这一句不会换行 将flex写成百分比，相对于父级来说*/
}

.nav-entry li [class^="nav-entry-icon"] {
    width: 28px;
    height: 28px;
    margin-top: 4px;
    background-size: 28px auto;
}

.nav-entry-icon1 {
    background: url(../images/hotel.png) no-repeat;
}

.nav-entry-icon2 {
    background: url(../images/flight.png) no-repeat;
}

.nav-entry-icon3 {
    background: url(../images/train_ticket.png) no-repeat;
}

.nav-entry-icon4 {
    background: url(../images/vacation.png) no-repeat;
}

.nav-entry-icon5 {
    background: url(../images/gs.png) no-repeat;
}

.nav-entry-icon6 {
    background: url(../images/hotel_inn.png) no-repeat;
}

.nav-entry-icon7 {
    background: url(../images/flight_package.png) no-repeat;
}

.nav-entry-icon8 {
    background: url(../images/bus_ticket.png) no-repeat;
}

.nav-entry-icon9 {
    background: url(../images/ticket.png) no-repeat;
}

.nav-entry-icon10 {
    background: url(../images/food.png) no-repeat;
}

.nav-entry-icon11 {
    background: url(../images/hotel_sale.png) no-repeat;
}

.nav-entry-icon12 {
    background: url(../images/airport_transfer.png) no-repeat;
}

.nav-entry-icon13 {
    background: url(../images/car.png) no-repeat;
}

.nav-entry-icon14 {
    background: url(../images/weekend.png) no-repeat;
}

.nav-entry-icon15 {
    background: url(../images/shop.png) no-repeat;
}

.nav-entry [class^="nav-entry-li"] {
    flex: 18%;
    border-right: 1px solid #fff;
    border-bottom: 1px solid #fff;
}

.nav-entry-li1 {
    border-radius: 8px 0 0 0;
    /* 渐变色 */
    background: -webkit-linear-gradient(#fb5f53, #fc8251);
}

.nav-entry-li2 {
    background: -webkit-linear-gradient(#3e87fa, #4facf9);
}

.nav-entry-li3 {
    background: -webkit-linear-gradient(#6084fe, #6aa1ff);
}

.nav-entry-li4 {
    background: -webkit-linear-gradient(#32c5b5, #4ed5b4);
}

.nav-entry-li5 {
    border-radius: 0 8px 0 0;
    background: -webkit-linear-gradient(#ff8c39, #ffa338);
}

.nav-entry-li6,
.nav-entry-li11 {
    background-color: #fff6f1;
}

.nav-entry-li11 {
    border-radius: 0 0 0 8px;
}

.nav-entry-li7,
.nav-entry-li12 {
    background-color: #f1f8ff;
}

.nav-entry-li8,
.nav-entry-li13 {
    background-color: #f2f4ff;
}

.nav-entry-li9,
.nav-entry-li14 {
    background-color: #ecfcf9;
}

.nav-entry-li10,
.nav-entry-li15 {
    background-color: #fff8f3;
}

.nav-entry-li15 {
    border-radius: 0 0 8px 0;
}

.nav-entry a {
    display: flex;
    flex-direction: column;
    align-items: center;
    font-size: 13px;
    color: #fff;
}

.nav-entry [class^="nav-entry-li"]:nth-child(n+6) a {
    color: #2d2824;
}

/* 销售模块 */
.sales {
    display: flex;
    width: 100%;
}

.salse-hd {
    display: flex;
    flex: 1;
}

/* 特价直播 */
.sales-tejia {
    height: 148px;
    flex: 50%;
    background-color: #fff;
    border-radius: 8px;
    margin: -7px 16px;
}

.tejia-hd {
    position: relative;
}

.tejia-hd-zuo {
    display: inline-block;
    width: 73px;
    height: 20px;
    background: url(../images/salezb.png) no-repeat;
    background-size: 73px auto;
    margin: 6px;
}

.tejia-hd-you {
    position: absolute;
    top: 8px;
    right: 9px;
    display: inline-block;
    width: 84px;
    height: 18px;
    color: #ff4607;
    font-size: 12px;
    background-color: #ffebe3;
    padding: 1px 4px;
    border-radius: 2px;
}

.tejia-bd a {
    display: inline-block;
    width: 230px;
    height: 84px;
    border-radius: 8px;
    margin-left: 6px;
    background: url(../upload/02018120008mxmb3g3DDF_D_280_280_R5.jpg) no-repeat center;
    background-size: 238px auto;
}

.tejia-ft a {
    color: #f06500;
    margin: 5px;
    font-weight: 700;
}

.tejia-ft a:nth-child(2) {
    margin: -9px;
}

/* 携程精选榜 */
.sales-rank {
    flex: 50%;
    height: 148px;
    background-color: #fff;
    border-radius: 8px;
    margin: -7px 3px;
}

.rank-hd {
    position: relative;
}

.rank-hd-zuo {
    display: block;
    width: 73px;
    height: 20px;
    background: url(../upload/0zc6g120008g0hcb587E5.png) no-repeat;
    background-size: 73px auto;
    margin: 8px;
}

.rank-hd-you {
    position: absolute;
    top: 1px;
    right: 9px;
    display: inline-block;
    width: 61px;
    height: 18px;
    color: #ae6e15;
    font-size: 12px;
    background-color: #fdefd2;
    padding: 1px 4px;
    border-radius: 2px;
}

.rank-bd {
    display: flex;
}

.rank-bd-zuo {
    position: relative;
    overflow: hidden;
    flex: 50%;
}

.rank-bd .tu {

    display: inline-block;
    width: 117px;
    height: 84px;
    border-radius: 8px;
}

.rank-bd-zuo .tu {
    background: url(../upload/zuo.jpg) no-repeat center;
    background-size: 117px auto;
    margin: 0 6px;
}

.rank-bd-you {
    overflow: hidden;
    position: relative;
}

.rank-bd-you .tu {
    background: url(../upload/you.webp) center;
    background-size: 117px auto;
}

.rank-bd .tubiao {
    position: absolute;
    top: 0;
    left: 0;
    display: inline-block;
    width: 30px;
    height: 16px;
    color: #663c00;
    font-size: 12px;
    background-color: #dab996;
    border-radius: 8px 0 8px 0;
}

.rank-bd .rank-bd-zuo .tubiao {
    left: 6px;
}

.text {
    display: block;
    font-size: 12px;
}

/* 底部图片 */
.bottom-img a {
    display: block;
    height: 129px;
    width: 518px;
    background: url(../upload/bottom.jpg)no-repeat;
    background-size: 518px auto;
    margin: 20px 18px;
    border-radius: 8px;
}

/* 底部工具模块 */
.tool-group .link,
.download {
    box-sizing: border-box;
    display: inline-block;
    width: 104px;
    height: 34px;
    border: 1px solid #ccc;
    text-align: center;
    line-height: 32px;
    border-radius: 4px;
    color: #000;
}

.link {
    margin: 7px 153px 14px 100px;
}

.tool-text a {
    display: inline-block;
    color: #666;
    /* padding: 10px; */
    width: 96px;
    height: 15px;
}

.tool-text a:nth-child(2) {
    margin-left: 12px;
}

.tool-text .zuo {
    position: relative;
    margin-top: 9px;
    margin-left: 200px;
}

.tool-text .zuo::after {
    position: absolute;
    top: 2px;
    left: 85px;
    content: "";
    background-color: #e0e0e0;
    width: 1px;
    height: 18px;
}

.tool-text p {
    color: #666;
    margin-left: 171px;
    font-size: 13px;
}

/* 底部导航栏 */
.bottom-nav {
    display: flex;
    height: 49px;
    background-color: #fff;
}

.bottom-nav li {
    flex: 1;
}

.bottom-nav a {
    display: flex;
    /* 将主轴设置成y轴 */
    flex-direction: column;
    /* 侧轴居中对齐 单行的· */
    align-items: center;
    font-size: 12px;
    color: #666;
}

/* 利用属性选择器 */
.bottom-nav li [class^="local-nav-icon"] {
    width: 32px;
    height: 32px;
    background: url(../images/tabbar.png) no-repeat 0 0;
    background-size: 32px auto;
}

.bottom-nav li .local-nav-icon-icon2 {
    background-position: 0 -32px;
}

.bottom-nav li .local-nav-icon-icon3 {
    background-position: 0 -64px;
}

.bottom-nav li .local-nav-icon-icon4 {
    background-position: 0 -96px;
}

.bottom-nav li .local-nav-icon-icon5 {
    background-position: 0 -128px;
}

4. 完成效果

携程网移动端首页制作（html5+css3）

5. 总结

      内容参考来自b站的up主：黑马前端 的pink老师前端入门教程。自己动手做的时候感觉自己学的太差了呜呜呜，什么都没掌握好，最后的完成效果也一般，完成时间也比预期中耗费的更多，只能说继续努力吧。

 文章来源地址https://www.toymoban.com/news/detail-447836.html

到了这里，关于携程网移动端首页制作（html5+css3）的文章就介绍完了。如果您还想了解更多内容，请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章，希望大家以后多多支持TOY模板网！

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处： 如若内容造成侵权/违法违规/事实不符，请点击违法举报进行投诉反馈，一经查实，立即删除！

分享到：
领支付宝红包 赞助服务器费用

相关文章

  • CSS3与HTML5

    CSS3与HTML5

    box-sizing content-box：默认，宽高包不含边框和内边距 border-box：也叫怪异盒子，宽高包含边框和内边距 动画：移动translate，旋转、transform等等 走马灯：利用动画实现animation：from… to… 隐藏元素： visibility：hidden 占位 display：none 不占位 画页面前重置浏览器自带样式 快格式化上

    2024年02月07日
    浏览(44)
  • HTML5和CSS3笔记

    HTML5和CSS3笔记

    1.1：页面结构： 1.2：标签类型： 1.2.1：块标签：  1.2.2：行内标签： 1.2.3：行内块标签： 1.2.4：块标签与行内标签的转换： （可以设置在不在同一行和隐藏） 1.3：表单与表格标签：   表单：    表格：   1.4：H5标签： 1.4.1：语义标签：   1.4.2：多媒体标签： （音频audio和视

    2024年03月24日
    浏览(51)
  • 尚硅谷html5+css3（3）布局

    尚硅谷html5+css3（3）布局

    1.文档流normal flow -网页是一个多层结构 -通过CSS可以分别为每一层设置样式 -用户只能看到最顶层 -最底层：文档流（我们所创建的元素默认都是从文档流中进行排列） 2.盒子模型   1.盒子模型-边框 2.盒子模型-内边距 3.盒子模型-外边距 4.盒子模型-水平方向的布局 5.盒子模型

    2024年04月09日
    浏览(63)

  • html5和css3的新特性

    标签         !-- 高亮 mark --         !-- 摘要概述 --         details             summary                 咖啡             /summary             ul                 li拿铁/li                 li美式/li             /ul         /details           

    2024年02月11日
    浏览(42)

  • HTML5CSS3提高

    HTML5 的新增特性主要是针对于以前的不足，增加了一些新的标签、新的表单和新的表单属性等。 这些新特性都有兼容性问题，基本是 IE9+ 以上版本的浏览器 才支持，如果不考虑兼容性问题，可以大量使用这些新特性。 以前布局，我们基本用 div 来做。div 对于搜索引擎来说，

    2024年02月14日
    浏览(52)
  • HTML5+CSS3实现小米商城 （完整版）

    HTML5+CSS3实现小米商城 （完整版）

    对于小米商城，也是自己初学前端的一个小作品吧，这个网页大概写了有三四天吧，总体感受就是写着还行，只要有耐心，就一定能成功。 毕竟第一次做，代码写的可能比较乱，命名可能也不是太规范，以后多加改正。 基本还原了原网页，并且只用到了CSS3和HTML5。 链接：

    2024年02月04日
    浏览(49)
  • h5(html5)+css3前端笔记二

    h5(html5)+css3前端笔记二

    一、表格标签 表格的主要作用： 表格主要用于 显示、展示数据 ，因为它可以让数据显示的非常的规整，可读性非常好。特别是后台展示数据的时候，能够熟练运用表格就显得很重要。一个清爽简约的表格能够把繁杂的数据表现得很有条理。 1. table/table 用来定义表格的标签

    2024年02月14日
    浏览(65)
  • 响应式Web开发项目教程（HTML5+CSS3+Bootstrap）第2版 第1章 HTML5+CSS3初体验 项目1-1 三栏布局页面

    响应式Web开发项目教程（HTML5+CSS3+Bootstrap）第2版 第1章 HTML5+CSS3初体验 项目1-1 三栏布局页面

    三栏布局是一种常用的网页布局结构。 除了头部区域、底部区域外，中间的区域（主体区域）划分成了三个栏目，分别是左侧边栏、内容区域和右侧边栏，这三个栏目就构成了三栏布局。当浏览器的宽度发声变化时，页面中左侧边栏和右侧边栏的宽度固定不变，而内容区域的

    2024年01月17日
    浏览(85)
  • HTML5+CSS3实现小米官网（完整版）

    HTML5+CSS3实现小米官网（完整版）

    小米官网其实是一个结构非常简单的网页，相比与小米商城，难度降低了很多很多。我也写过一次小米商城，可以移步到我的主页。本篇文章简单分析一下小米官网的静态结构，文章末尾附源代码和素材。 先展示一下页面的效果吧！ 1. 头部导航栏 头部导航栏可以用 fixed 定位

    2024年02月13日
    浏览(82)

  • 【前端基础篇】HTML5 + CSS3 入门知识

    万维网的核心语言、标准通用标记语言下的一个应用超文本标记语言（HTML）的第五次重大修改（这是一项推荐标准、外语原文：W3C Recommendation） HTML5是HTML最新的修订版本，2014年10月由万维网联盟（W3C）完成标准制定。 HTML5的设计目的是为了在移动设备上支持多媒体。 HTML5 简

    2024年02月09日
    浏览(78)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包，优惠每天领

二维码1

领取红包

二维码2

领红包