Table表格做登陆页面

最新推荐文章于 2024-04-19 20:39:07 发布
最新推荐文章于 2024-04-19 20:39:07 发布
阅读量3.1k 收藏 1
点赞数
分类专栏： HTML
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/kongjunchao159/article/details/47334525
版权
<html>
<body>
<table align="center" border="1px" background="bjpicture.jpg" width="500px" height="200px">
<form action="??" method="get">
<tr>
<td>&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp</td>
<td></td>
</tr>
<tr>
<td></td>
<td><b>用户名</b><input type="text" name="username"/></td>
</tr>
<tr>
<td></td>
<td><b>密&nbsp&nbsp码</b><input type="password" name="password"/></td>
</tr>
<tr>
<td></td>
<td>
&nbsp&nbsp&nbsp&nbsp<input type="submit" value="登录系统"/>&nbsp&nbsp&nbsp
<input type="reset" value="重新填写"/>
</td>
</tr>
<tr>
<td></td>
<td>
&nbsp&nbsp&nbsp&nbsp&nbsp<a href="zhaohuimima.html" ><font color="red"><b>找回密码</b></font></a>&nbsp&amp;nbsp&nbsp
<a href="zhuceyonghu.html" ><font color="red"><b>注册用户</b></font></a>
</td>
</tr>
</form>
</table>
</body>
</html>
显示效果：
kongjunchao159
关注
  • 0
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
TableLayout布局实现登录界面
qq_24946843的博客
12-14 2378
确定行列数 如果我们直接往TableLayout中添加组件的话,那么这个组件将占满一行 如果我们想一行上有多个组件的话,就要添加一个TableRow的容器,把组件都丢到里面 tablerow中的组件个数就决定了该行有多少列,而列的宽度由该列中最宽的单元格决定 三个常用属性 android:collapseColumns:设置需要被隐藏的列的序号 android:shrinkColumns:设置允许被收缩的列的列序号 android:stretchColumns:设置运行被拉伸的列的列序号 .
网页中的表格
Meatball_MMY的博客
04-18 2404
网页中的表格，现在我们来做一个四行四列的表格，代码如下： <body> <table width="500" cellspacing="0" border="1"> <tr> <td>1</td> <td>2</td> <td>3</td...
表格，登陆表单
qq_44862330的博客
09-26 500
&lt;div&gt; <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> </head> <body> <form action="http//www.baidu" metho...
table和form的使用，以及制作登录表单
小梁说代码的博客
09-23 1869
table的简单使用 <table> <caption>表格标题</caption> <tr> <th>列名一</th> <th>列名二</th> </tr> <tr> <td>数据一</td> <td>数据二</td> </tr> </table> 效果
CSS基础：table的4个标签的样式详解（6000字长文！附案例）
最新发布
u013179804的博客
04-19 4809
之前在 HTML 基础部分，我们讲解了表格的结构和写法。简单回顾下。包含等表格部分。和分别包含多个行。行中可以包含或单元格，用来显示表格的标题或数据。本文，我们来给它们增加一些漂亮的样式。图为增加样式前，增加样式后的效果，是不是确实漂亮多了。ok，那我们一起来看看这些表格标签的样式属性吧。
使用表格布局编写登录页面实例
fairy0000000的博客
05-13 988
首先来看一下表格布局几个常用的属性： android:shrinkColumns设置可收缩的列，内容过多就收缩显示到第二行 android:stretchColumns设置可伸展的列，将空白区域填充满整个列 android:collapseColumns设置要隐藏的列 列的索引从0开始，通过TableRow确定行，TableRow中的组件数量为列数 来看一下实例 <?xml version="1.0" encoding="utf-8"?> <TableLayout xmln
利用table制作一个登陆页面
weixin_33681778的博客
05-17 830
需要制作这么图的一个如下图的效果：做这个页面主要是通过最原始的table进行布局，首先贴上代码简单解释下：最外层的table是把整张页面分成三行三列，而登陆的页面位于第二行第二列中，在第二行第二列中添加一个table，table（table中以图片为背景色）分为三行二列，在第二行第二列中再放置一个table，这个table主要是为布局输入用户名和密码，和一些按钮，这个tabl...
CsS 元素框模
yxpjx的专栏
11-13 1014
 CSS 框模型概述  元素框的最内部分是实际的内容，直接包围内容的是内边距。内边距呈现了元素的背景。内边距的边缘是边框。边框以外是外边距，外边距默认是透明的，因此不会遮挡其后的任何元素。内边距、边框和外边距都是可选的，默认值是零。但是，许多元素将由用户代理样式表设置外边距和内边距。可以通过将元素的 margin 和 padding 设置为零来覆盖这些浏览器样式。这可以分别
分享Bootstrap简单表格、表单、登录页面
08-29
Bootstrap 简单表格、表单、登录页面实践指南 Bootstrap 框架作为一个流行的前端框架，提供了许多实用的UI组件，帮助开发者快速构建Web应用程序。在本文中，我们将探讨如何使用 Bootstrap 创建简单的表格、表单和...
denglu.zip_Table_注册 登录_注册登录界面_登录注册_登录界面
09-21
"denglu.zip"这个压缩包文件包含了关于"注册登录"界面的设计和实现，特别强调了使用"Table"样式进行界面切换。以下是关于这个主题的详细知识点： 1. **表格（Table）布局**： - 表格布局是一种常见的网页设计方法...
应用表格布局管理器实现喜马拉雅的用户登录页面
01-13
应用表格布局管理器实现喜马拉雅的用户登录页面 在 Android 开发中，表格布局管理器是一个非常重要的组件，它可以帮助我们快速地创建复杂的用户界面。在本实验中，我们将使用表格布局管理器来实现喜马拉雅的用户...
html+table实现注册页面
11-25
初学者实用例子，欢迎大家下载
注册登录界面，asp.net+Table框架结构
05-13
注册登录界面，asp.net+Table框架结构注册登录界面，asp.net+Table框架结构注册登录界面，asp.net+Table框架结构注册登录界面，asp.net+Table框架结构
js展现table方法
11-24
本文将深入探讨如何使用JavaScript来动态地创建、操作和展现`<table>`，以及如何结合其他技术，如单点登录（Single Sign-On, SSO）和选项卡切换，来增强用户界面。 首先，让我们关注如何使用JavaScript来创建一个...
09 使用table布局 设计企业邮箱登陆界面
weixin_30677475的博客
05-16 235
布局使用的表格<table></table> table表格可以放置背景图： 布局前可以给border加边界。 布局完成后再将border边界去除。 设计思路： 一共使用了3个table元素，使table中表格的子元素也可以嵌套table 代码： <html> <head> <tit...
Servlet生成验证码 连接数据库验证信息
qq_43760243的博客
04-03 1511
1.ImageServlet.java 创建一个Servlet项目 右击项目名创建Servlet文件 命名ImageServlet 同样地 创建的时候删去这个 代码： public void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { response.setContentType("text/html,charset=utf-8");
基于jsp和mysql的简易登陆界面
VictoryKingLIU的博客
05-22 551
环境：jdk8 mysql8.X 数据库准备 数据库login 数据表logintable 代码目录 input.html 输入用户信息 login.jsp 连接数据库，判断用户名是否正确 successful.jsp 成功登陆界面 error.jsp 失败界面 页面展示 代码 input.html <!DOCTYPE html> <html> <head> <title>input.html</title>
表单标签实现简单的登陆页面
m0_61464684的博客
04-23 1416
登陆页面
网页设计之登录界面
m0_58887730的博客
03-24 2033
1.创建一个registe.css文件，里面存放界面的设置，包含大小字体颜色等。2.创建一个html文件，存放对用户名密码手机号的验证信息。
用表格布局做html 登录页面
06-07
可以使用表格布局来创建一个简单的登录页面。下面是一个示例代码： ```html <!DOCTYPE html> <html> <head> <title>Login Page</title> <style> body { background-color: #f1f1f1; } table { margin: 100px auto; background-color: white; border: 1px solid #ccc; border-collapse: collapse; } td { padding: 10px; border: 1px solid #ccc; } input[type="text"], input[type="password"] { width: 100%; padding: 10px; box-sizing: border-box; border: none; border-bottom: 1px solid #ccc; } input[type="submit"] { width: 100%; padding: 10px; background-color: #4CAF50; color: white; border: none; cursor: pointer; } </style> </head> <body> <table> <tr> <td colspan="2" style="text-align: center;"><h2>Login Form</h2></td> </tr> <tr> <td><label for="username">Username:</label></td> <td><input type="text" id="username" name="username"></td> </tr> <tr> <td><label for="password">Password:</label></td> <td><input type="password" id="password" name="password"></td> </tr> <tr> <td colspan="2"><input type="submit" value="Login"></td> </tr> </table> </body> </html> ``` 在这个示例中，我们使用了一个包含三个行的表格来布局登录表单。第一行包含了一个跨越两个单元格的标题单元格，用于显示“Login Form”文本。第二行包含了一个用于输入用户名的单元格和一个用于输入密码的单元格。第三行包含了一个跨越两个单元格的提交按钮单元格。 这只是一个简单的示例，实际上还可以使用表格布局来创建更复杂的登录页面布局，例如带有多个输入字段和复选框的表格。但是需要注意的是，表格布局并不是最适合用于布局的方式，因为它可能会导致一些语义上的问题。因此，对于更复杂的布局，可以考虑使用其他布局方式，例如Flexbox或Grid布局。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值