静态网页练习（html+css）

最新推荐文章于 2024-06-15 12:27:34 发布

小x今天暴富了吗

最新推荐文章于 2024-06-15 12:27:34 发布

阅读量550

点赞数

文章标签： html5

本文链接：https://blog.csdn.net/Sawada00/article/details/124234782

版权

本文详细介绍了如何使用HTML5和CSS创建静态网页，涵盖了基本语法、布局技巧以及样式美化等方面，适合初学者进行网页制作练习。

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

<!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>Document</title>
    <link rel="stylesheet" href="index.css">
</head>
<body>
    <!-- 导航条 -->
    <div class="nav wrapper">
        <!-- logo -->
        <h1>
            <a href="#"><img src="./images/logo.png" alt=""></a>
        </h1>
        <!-- 功能 -->
        <div class="header">
            <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>
        <!-- user -->
        <div class="user">
            <img src="./images/user.png" alt="">
            <span>admin</span>
        </div>
    </div>
    <!-- 轮播图 -->
    <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="#">移动开发<span>></span></a></li>
                    <li><a href="#">人工智能<span>></span></a></li>
                    <li><a href="#">商业预测<span>></span></a></li>
                    <li><a href="#">云计算&大数据<span>></span></a></li>
                    <li><a href="#">运维&从测试<span>></span></a></li>
                    <li><a href="#">UI设计<span>></span>

最低0.47元/天解锁文章

小x今天暴富了吗

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
静态网页练习（html+css）

<!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>Doc
复制链接

扫一扫