HTML（一）静态登录注册页面附有完整网页（html+css+js）

原创

已于 2022-11-20 18:41:57 修改 · 3w 阅读

665 ·

CC 4.0 BY-SA版权

文章标签：

#html

于 2021-08-19 16:32:20 首次发布

这个博客展示了如何使用HTML和CSS创建一个登录和注册页面，包括头部导航、内容区域的登录/注册切换、样式设计以及简单的交互效果。页面包含第三方登录选项，并实现了点击链接切换显示不同注册登录表单的功能。

在这里插入图片描述

在这里插入图片描述
建一个文件夹，文件夹里面放两个文件，一个是login.html文件，存放html代码，一个是login.css文件,存放css代码

html

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset=UTF-8">
    <title>程序员之家</title>
    <link rel="stylesheet" href="login.css">
</head>

<body>
    <div id="head">
        <ul>
            <li><a>首页</a></li>
            <li><a>博客</a></li>
            <li><a>程序员学院</a></li>
            <li><a>论坛</a></li>
            <li><a>问答</a></li>
            <li><a>代码</a></li>
            <li><a>高校</a></li>
            <li><a href="https://www.youkuaiyun.com/" target="blank">优快云</a></li>
            <li><a href="https://www.cnblogs.com/" target="blank">博客园</a></li>
            <li><a>登录/注册</a></li>
            <li><a>会员中心</a></li>
        </ul>
    </div>
    <div
        style="background-image: url(download.jfif); background-size:100% 100%;margin-left: auto;margin-right: auto;width: 100%;height: 635px;">
        <section id="content">
            <div class="header">
                <a href="javascript:;" class="current">我要登录</a>
                <

最低0.47元/天解锁文章