学成在线项目

最新推荐文章于 2024-07-06 20:10:23 发布

繁星佛晓

最新推荐文章于 2024-07-06 20:10:23 发布

阅读量103

点赞数

文章标签： css sass javascript

本文链接：https://blog.csdn.net/m0_46697061/article/details/124871463

版权

本文档详细介绍了学成在线项目的HTML5和CSS技术应用，包括页面结构设计、样式美化以及响应式布局等内容，旨在帮助读者深入理解如何使用CSS预处理器Sass提升样式编写效率。

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

学成在线官网HTML5文档如下：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>学成在线</title>
    <link rel="stylesheet" href="./css/index.css">
</head>
<body>
    <!-- 网站的首页, 所有网站的首页都叫index.html, 因为服务器找首页都是找index.html -->
    <!-- 布局: 从外到内, 从上到下, 从左到右 -->
    <!-- CSS: 浮动/display ; 盒子模型; 文字样式 -->

    <!-- 头部header: 负责头部区域的样式, wrapper只负责版心效果 -->
    <div class="header wrapper">
        <h1>
            <a href="#"><img src="./images/logo.png" alt=""></a>
        </h1>

        <!-- 导航 -->
        <div class="nav">
            <ul>
                <li><a href="#">首页</a></li>
                <li><a href="#">课程</a></li>
                <li><a href="#">职业规划</a></li>
            </ul>
        </div>
        <!-- 搜索 -->
        <div class="search">
            <input type="text" placeholder="输入关键词"><button></button>
        </div>
        <!-- 用户 -->
        <div class="user">
            <img src="./images/user.png" alt="">
            <span>lilei</span>
        </div>
    </div>

    <!-- 轮播图banner -->
    <div class="banner">
        <div class="wrapper">
            <div class="left">
                <ul>
                    <li><a href="#">前端开发<span>></span></a></li>
                    <li><a href="#">运维教程<span>></span></a></li>
                    <li><a href="#">python<span>></span></a></li>
                    <li><a href="#">java<span>></span></a></li>
                    <li><a href="#">c/c++<span>></span></a></li>
                    <li><a href="#">Mysql数据库<span>></span></a></li>
                    <li><a href="#">前端框架<span>></span></a></li>
                    <li><a href="#">项目合集<span>></span></a></li>
                    <li><a href="#">linux<span>></span></a></li>
                &l

最低0.47元/天解锁文章

繁星佛晓

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
学成在线项目

学成在线官网HTML5文档如下：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0">.
复制链接

扫一扫