• HTML 综合案例简陋的相亲网站界面


    1. HTML 代码

    <!doctype html>
    <html lang="en">
    <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">
        <meta http-equiv="X-UA-Compatible" content="ie=edge">
        <title>综合案例-相亲网站</title>
    </head>
    <body>
        <h1>青春不常在,抓紧谈恋爱</h1>
        <hr>
        <form action="">
            昵称:<input type="text" placeholder="请输入昵称">
            <br>
            <br>
            性别:
            <label><input type="radio" name="sex" checked></label>
            <label><input type="radio" name="sex"></label>
            <br><br>
    
            所在城市:
            <select>
                <option>北京</option>
                <option>上海</option>
                <option>广州</option>
                <option>深圳</option>
                <option>南京</option>
                <option>苏州</option>
                <option>无锡</option>
                <option>盐城</option>
            </select>
            <br>
            <br>
    
            婚姻状况:
            <label><input type="radio" name="condition" checked> 未婚</label>
            <label><input type="radio" name="condition"> 已婚</label>
            <label><input type="radio" name="condition"> 保密</label>
            <br><br>
    
            喜欢的类型:
            <label><input type="checkbox" checked> 可爱</label>
            <label><input type="checkbox" checked> 性感</label>
            <label><input type="checkbox"> 御姐</label>
            <label><input type="checkbox"> 萝莉</label>
            <label><input type="checkbox"> 正太</label>
            <label><input type="checkbox"> 小鲜肉</label>
            <label><input type="checkbox"> 大叔</label>
            <label><input type="checkbox"> 潮男</label>
            <label><input type="checkbox"> 油物</label>
    
            <br>
            <br>
    
            个人介绍:<br>
            <textarea name="" id="" cols="60" rows="10"></textarea>
    
            <h3>我承诺</h3>
            <ul>
                <li>年满18岁,单身</li>
                <li>抱着严肃的态度</li>
                <li>真诚寻找另一半</li>
            </ul>
            <!--按钮:input button-->
            <input type="submit" value="免费注册">
            <button type="reset">重置</button>
        </form>
    </body>
    </html>

    2. 展示效果

  • 相关阅读:
    Protocol Buffers教程
    Paxos、ZAB、RAFT协议
    kafka自定义序列化器
    Java cas原理
    常见的排序算法
    Java反射
    etcd单机集群
    通过tomcat shutdown port关闭tomcat
    Java ConcurrentHashMap初始化
    LaTeX技巧892: Ubuntu 安装新版本TeXLive并更新
  • 原文地址:https://www.cnblogs.com/shenyuanhaojie/p/15853797.html
Copyright © 2020-2023  润新知