用HTML做一个简单的界面

最新推荐文章于 2024-06-25 10:48:10 发布
最新推荐文章于 2024-06-25 10:48:10 发布
阅读量3.5k 收藏 23
点赞数 5
文章标签： html web
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/a23_23/article/details/111713633
版权 
只做了个超级超级简单的界面，只是大概总结了HTML的一些知识点，超级超级超级初级哇

目录

前言

建议在这里打开 ，结合界面理解叭。
在这里插入图片描述

界面

大概的界面样子
在这里插入图片描述

代码：

<!DOCTYPE html>         <!---"!"+回车，自动生成模板，body里写内容-->
<html lang="en">

<!-- Ctrl+/ 整行注释 -->

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style></style>           <!---style里写CSS-->
</head>

<body>
    <h4 align=center>注册界面</h4>

    <table align=center>            <!--//以表格形式布局-->
        <tr>                                          <!--//第一行-->
            <td>姓名：</td>          <!--//第一个单元格-->
            <td>
                <input type="text">        <!--//普通文本框-->
            </td>
        </tr>

        <tr>                                          <!--//第二行-->
            <td>性别：</td>
            <td>
                <input type="radio" name="sex"> 男   <!--//当name相同时，是单选框-->
                <input type="radio" name="sex"> 女
            </td>
        </tr>

        <tr>                                          <!--//第三行-->
            <td>电话号码：</td>
            <td>
                <input type="text">
            </td>
        </tr>

        <tr>                                           <!--//第四行-->
            <td>证件号码：</td>
            <td>
                <input type="text">
            </td>
        </tr>

        <tr>                                           <!--//第五行-->
            <td>籍贯：</td>
            <td>
                <select name="zhengjian" >    <!--//下拉选择框-->
                    <option>请选择</option>
                    <option>湖南</option>
                    <option>湖北</option>
                    <option>广州</option>
                    <option>深圳</option>
                    <option>北京</option>
                    <option>天津</option>
                    <option>河南</option>
                    <option>江西</option>
                </select>
            </td>
        </tr>

        <tr>                                            <!--//第六行-->
            <td>喜好：</td>
            <td> 
                <input type="checkbox" name='love'> 美食      <!--//复选框-->
                <input type="checkbox" name='love'> 旅行
                <input type="checkbox" name='love'> 摄影
                <input type="checkbox" name='love'> 手工
                <br>                                          <!--//换行符-->
                <input type="checkbox" name='love'> 吉他
                <input type="checkbox" name='love'> 穿搭
            </td>
        </tr>
 
        <tr>                                             <!--//第七行-->
            <td>简要介绍：</td>
            <td>
                <textarea name="jieshao" cols="30" rows="4"></textarea>   <!--//多行文本框-->
            </td>
        </tr>

        <tr>
            <td></td>
            <td>
                <a href="https://www.bilibili.com/video/BV14J4114768?p=59">注册条款</a>     <!--超链接-->
            </td>
        </tr>

        <tr>
            <td></td>
            <td>
                <input type="checkbox" checked="checked"> 我同意注册条款    <!---checked="checked"代表默认选上复选框-->
            </td>
        </tr>

        <tr>
            <td></td>
            <td>
                <input type="submit" value="注册">                    <!--//按钮 -->
            </td>
        </tr>

        <tr>
            <td></td>
            <td>
                <h6>小标题 h6大小</h6>
                <ul>
                    <li>我想不出写啥了。。。</li>
                    <li>无序列表第二行</li>
                    <li>无序列表第三行</li>
                </ul>             
            </td>
        </tr>

        <tr>
            <td></td>
            <td>
                <h1>这是个有序列表 h1大小</h1>
                <ol>
                    <li>第一行</li>
                    <li>第二行</li>
                    <li>第三行</li>
                </ol>

            </td>
        </tr>

    </table>

    <h3>简要介绍：</h3>
    <p>HTML5是构建Web内容的一种语言描述方式。<br/>                     <!--段落文本-->               <!---换行-->
        是互联网的下一代标准，是构建以及呈现互联网内容的一种<b>语言方式</b>．                          <!---加粗-->
        被认为是互联网的核心技术之一。HTML产生于1990年，1997年HTML4成为互联网标准，并<i>广泛应用于</i>  <!---倾斜-->
        互联网应用的开发。HTML5是Web中核心语言HTML的规范，用户使用任何手段进行<s>网页浏览时</s>         <!---删除线-->
        看到的内容原本都是HTML格式的，在浏览器中通过一些技术处理将其转换成为了可识别的信息。<u>HTML5</u> <!---下划线-->
        在从前HTML4.01的基础上进行了一定的改进，虽然技术人员在开发过程中可能不会将这些新技术投入应用，   
        但是对于该种技术的新特性，网站开发技术人员是必须要有所了解的。</p>

</body>

</html>

后面文本的界面：
在这里插入图片描述

_23_
关注
  • 5
    点赞
  • 踩
  • 23
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
专栏目录
个人博客HTML界面
01-24
一个HTML的个人博客界面，只有首页界面。包含css和HTML
html 打造漂亮的登录界面
09-29
html 打造漂亮的登录界面。
html界面
qq_42327860的博客
04-19 226
html界面
HTML做一个简单的页面（纯html代码）地球专题学习网站
最新发布
专注于dreamweaver网页设计制作
06-25 720
🥇 关于作者: 💬历任研发工程师，技术组长，教学总监；曾于2016年、2020年两度荣获CSDN年度十大博客之星。 十载寒冰，难凉热血；多年过去，历经变迁，物是人非。 然而，对于技术的探索和追求从未停歇。 💪坚持原创，热衷分享，初心未改，继往开来！🍵茶文化网站、🏳️‍🌈中华传统文化题材、京剧文化🔏水墨风书画、中国民间年画文化艺术网站 、等网站的设计与制作。🏷️ 这个首页代码运用了DIV盒子的使用方法，如盒子的嵌套、浮动、margin、border、background等属性的使用，外部大盒
HTML 好看界面
yangrun33的博客
12-25 4535
无聊逛外网的时候，突然看见一个用HTML写的界面，我觉得挺好看，对于我这个才接触这个的学生来说，挺厉害的，所以我也把他分享出来，你们可以去参考参考， <!DOCTYPE html> <html lang="en" > <head> <meta charset="UTF-8"> <title>CodePen - Glassmorphism Creative Cloud App Redesign</title> <li
自己制作的一个简单的HTML网页
12-20
自己制作的一个简单的HTML网页
简单通用的后台登录界面html模板
07-14
在网页设计和开发中，一个简洁而通用的后台登录界面html模板是构建任何Web应用程序的基础部分。它通常包含输入字段，如用户名和密码，以及登录按钮，有时还会有“忘记密码”或“注册”等链接。这些元素的设计应该...
创建一个简单的HTML后台管理界面模板.txt
04-06
html后台管理界面模板
简单登录注册界面html模板
04-25
这个模板利用了HTML的基础结构，结合JavaScript的功能性和CSS的样式设计，为开发者提供了一个快速构建基本用户交互界面的起点。 【HTML】在HTML方面，此模板包含典型的登录和注册表单元素，如输入框（input标签）...
HTML+CSS一个简单却不失美感的登录界面！
01-21
在本文中，我们将深入探讨如何使用HTML和CSS创建一个简单但具有吸引力的登录界面。HTML（超文本标记语言）和CSS（层叠样式表）是网页设计的基础，它们结合使用可以构建出美观且功能丰富的用户界面。在此示例中，我们...
一个简单用HTML5和css3 写的界面
04-17
一个简单用HTML5和css3 写的界面
html界面设置
12-27
作为OW老玩家，自学通过vs2010制作了一个网站，只具有浏览功能，不具备动态交互，兴趣爱好，不喜勿喷
漂亮的html登陆界面
06-14
浅蓝色漂亮的html登陆界面 PSD与HTML
HTML实现界面登录
09-28
利用HTML编写的网站登录界面，界面友好，代码可见 下载即可使用
HTML实验-登录界面（html+js+css）
11-15
初学者可以学习一下,HTML写的登陆界面,增加一些JS和CSS代码对数据进行验证和美化界面。 下载下来直接打开html文件即可。
豆瓣读书的静态网页（HTML+CSS)
09-22
静态的豆瓣读书网页，只使用了html+css 忽略了一些细节和重复的问题 没有动态效果，但是布局和原网页差不多，可能边距有些偏差
【HTML界面设计（二）】说说模块、登录界面
守夜人
06-18 1874
记录很早之前写的前端界面（具体时间有点久远） 采用 适配器（Adapter）原理 来设计这款说说模板 （因为我这个项目有二维码登录的需求，所以有一个扫描图标，但demo里没有） 如果需要设计出一个这样的功能，可以参考同栏目下的【全栈开发】基于Spring Boot&Vue&Android扫码授权登录 建议：其实啊，我个人不是很推崇直接前端生成验证码数据，这玩意最好还是交给后端，始终要遵守开发安全原则 后端负责生成，前端负责渲染
html 索引界面
coolsunxu的博客
05-11 2793
原来大家这么喜欢网页设计呀，这个也是我模仿的，分享一下 <!doctype html> <html> <head> <meta charset="utf-8"> <title>index</title> <script type="text/javascript" src="js/jquery.min.js">...
测试
weixin_30764883的博客
03-22 57
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml" ><head> <tit...
用html做一个登录界面
05-10
为了创建一个登录界面，您需要使用HTML代码。 以下是一个简单的登录界面的例子： ```html <!DOCTYPE html> <html> <head> <title>登录界面</title> </head> <body> <h1>登录</h1> <form action="/login" method="post"> <label for="username">用户名：</label><br> <input type="text" id="username" name="username"><br> <label for="password">密码：</label><br> <input type="password" id="password" name="password"><br><br> <input type="submit" value="登录"> </form> </body> </html> ``` 该代码创建了一个名为“登录界面”的HTML文档，其中包含一个表单，该表单具有两个文本字段（用户名和密码）和一个提交按钮。 请注意，这只是一个简单的例子，您可能希望进一步定制您的登录界面，例如添加验证，更改布局等。
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值