DIV的表单布局

表单布局其实用表格最好了,可是表格的话,无法定位,这个是一个硬伤。

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>表单布局</title>
<link rel="stylesheet" type="text/css" href="css/jnreset.css">
<style>
.formList{ margin:2px 0;}
.formList:before,.formList:after {content:""; display:table;}
.formList:after { clear:both; }
.formList{ zoom:1;}
.formList .formTit{ width:100px; line-height:30px; float:left; text-align:right;}
.formList .formMain{ margin-left:100px; padding-top:2px;}
.formList .formMain input{position:relative;top:2px;}
.formList .formMain select{position:relative;top:4px;}
.formList .formMain label{ margin-right:20px;}
.formList .formMain label input{ margin-right:3px; top:2px;}
</style>
</head>
<body><div class="formList"><div class="formTit"><label for="name">姓名:</label></div><div class="formMain"><input type="text" id="name" /></div>
</div><div class="formList"><div class="formTit">性别:</div><div class="formMain"><input type="radio" name="sex" id="man" /><label for="man"></label><input type="radio" name="sex" id="woman" /><label for="woman"></label></div>
</div><div class="formList"><div class="formTit">性别:</div><div class="formMain"><input type="checkbox" name="sex" /><label></label><input type="checkbox" name="sex" /><label></label></div>
</div><div class="formList"><div class="formTit">性别:</div><div class="formMain"><select><option>我的这个是什么情况</option></select></div>
</div><div class="formList"><div class="formTit">文件:</div><div class="formMain"><input type="file" /></div>
</div><div class="formList"><div class="formTit">备注:</div><div class="formMain"><textarea></textarea></div>
</div><div class="formList"><div class="formTit"></div><div class="formMain"><input type="button" value="登录" /></div>
</div></body></html>

 

转载于:https://www.cnblogs.com/busicu/p/4024404.html

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/376589.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

后台系统可扩展性学习笔记(三)DNS机制原理

文章目录DNS概念梳理域名基本概念资源记录基本概念路由策略DNS 域空间结构实现原理复制机制查询机制缓存机制参考DNS概念梳理 DNS&#xff08;Domain Name System&#xff09;相当于互联网的通讯录&#xff0c;能够把域名翻译成 IP 地址。 从技术角度来讲&#xff0c;DNS 是个…

后台系统可扩展性学习笔记(四)CDN机制原理

文章目录概念梳理CDN拓扑结构CDN内容分发方式架构原理工作原理实现原理概念梳理 CDN&#xff08;Content Delivery Network&#xff0c;内容分发网络&#xff09;是由分布在不同地理位置的代理服务器及其数据中心组成的网络&#xff0c;希望在空间距离上为用户就近提供服务&am…

Javascript 基础—变量 运算符

经过找工作笔试的洗礼&#xff0c;感觉自己js语法方面掌握的不是很系统&#xff0c;今天来梳理下——变量以及运算符。 基础篇 和C语言的不同点&#xff1a;是一种弱类型语言&#xff0c;申明变量时不需要指定类型&#xff1b;变量名的命名方法也有不同&#xff1b;简单类型种类…

后台系统可扩展性学习笔记(五)负载均衡

文章目录Load balancer(负载均衡器)请求传输拆解DNS 负载均衡客户端负载均衡OSI 七层模型回顾2 层、3 层负载均衡3/4 层负载均衡7 层负载均衡在 第一节谈到了系统的横向扩展在于从单机扩展到多机&#xff0c;那么面临的第一个问题就是这些机器如何协同工作&#xff0c;即如何调…

Struts2第一个工程helloStruts极其基本配置

前面已经准备好了Struts-2.3.15&#xff0c;现在就可以直接搭建Struts2的工程了。前面http://blog.csdn.net/huangchnegdada/article/details/9179041有对Struts-2.3.15的准备工作的详述。 首先打开MyEclispe新建一个Web Project&#xff0c;名字就叫Struts2_0100_Introduction…

[LeetCode]Find Minimum in Rotated Sorted Array

题目描述&#xff1a; Suppose a sorted array is rotated at some pivot unknown to you beforehand. (i.e., 0 1 2 4 5 6 7 might become 4 5 6 7 0 1 2). Find the minimum element. You may assume no duplicate exists in the array. 解题方案&#xff1a; 直接贴代码&…

后台系统可扩展性学习笔记(六)反向代理

文章目录Web代理服务反向代理反向代理作用Web代理服务 Web 代理服务指的是在客户端资源请求和提供这些资源的 Web 服务之间充当中介的角色&#xff0c;代理服务可以实现在客户端&#xff0c;或者从客户端到目标服务器中间的任意环节。 例如&#xff0c;客户端不直接向提供目标…

(C)单链表

老师版 1 #include <stdio.h>2 #include <stdlib.h>3 4 // 定于Node数据类型5 struct Node6 {7 int data; // 数据域8 struct Node *next; // 指针域9 };10 11 // 创建一个单链表&#xff0c;并把head节点返回&#xff1b;…

实验:sigsuspend(),sigprocmask()

实验&#xff1a;sigsuspend(),sigprocmask()源代码&#xff1a;/* * Program: pause_suspend.c * To test the difference between sigsuspend() and paus(). * Author: zsl * Date: 2014-10-17 * First release. * 参见网页&#xff1a;http://blog.csdn.net/liwentao1091/ar…

后台系统可扩展性学习笔记(七)Service Discovery与微服务

文章目录应用层微服务架构服务注册查询 Service Discovery客户端 Service DiscoveryDNS-SD DNS-based Service Discovery服务端 Service Discovery服务注册与注销自注册模式第三方注册模式总结参考应用层 在简单的 3 层结构中&#xff0c;Web 服务层既要处理请求&#xff0c;又…

很久没写代码了,这(那)几天真是累死了。。。先写一个幻方的程序吧

1 #include <stdio.h>2 #include <stdlib.h>3 #include <windows.h>4 5 #define EVEN_DOUBLE_4 4 //双偶的最基本类型&#xff0c;4阶双偶6 #define SCREEN_SIZE 19 //屏幕显示不变形的最大尺寸&#xff08;主要是因为窗口大小限制&#xff09;7 #defi…

#pragma once

http://baike.baidu.com/view/1276747.htm?fraladdin 转载于:https://www.cnblogs.com/prayer521/p/4069040.html

后台系统可扩展性学习笔记(八)Service Mesh

文章目录网络传输可靠性将微服务控制下沉到网络栈&#xff1f;Sidecar从 Sidecar 到 Service MeshService Mesh 部署平台参考网络传输可靠性 从计网的学习过程中我们可以知道数据在网络传输中可能会出现一些异常状况&#xff1a; 数据丢失&#xff1a;数据包可能会到达一个缓…

关于Spring batch的学习之CSV2DB

最近在学习Spring batch相关的内容&#xff0c;网上也有不少Spring Batch相关的知识&#xff0c;不过大多都是使用xml进行配置的。这里是我用注解的方式进行相关的学习心得。 首先我们来看如何将一个文本文件中的内容导入到数据库中。 我们先来看一下我们所需要的环境。我们这里…

后台系统可扩展性学习笔记(九)Database Replication

文章目录数据库扩展一致性问题Replication &#xff08;复制&#xff09;异步复制同步复制半同步复制拓扑结构单主结构多主结构无主结构复制具体措施参考数据库扩展 之前在第一章后台系统可扩展性学习笔记&#xff08;一&#xff09;概要谈到&#xff1a;理论上&#xff0c;有…

python中的sum函数.sum(axis=1)

看起来挺简单的样子&#xff0c;但是在给sum函数中加入参数。sum&#xff08;a&#xff0c;axis0&#xff09;或者是.sum(axis1) 就有点不解了 在我实验以后发现 我们平时用的sum应该是默认的axis0 就是普通的相加 而当加入axis1以后就是将一个矩阵的每一行向量相加 例如&…

后台系统可扩展性学习笔记(十)Database Partitioning

为了提升数据库的处理能力&#xff0c;我们把单库扩展成多库&#xff0c;并通过更新同步机制&#xff08;即Replication&#xff09;来保证多份数据的一致性。然而&#xff0c;在 各种复制方案下&#xff0c;每个数据库都持有一份完整数据&#xff0c;基于全量数据提供增删改查…

基于FPGA的HDTV视频图像灰度直方图统计算法设计

随着HDTV的普及&#xff0c;以LCD-TV为主的高清数字电视逐渐进入蓬勃发展时期。与传统CRT电视不同的是&#xff0c;这些高清数字电视需要较复杂的视频处理电路来驱动&#xff0c;比如&#xff1a;模数转换&#xff08;A/D Converter&#xff09;、去隔行&#xff08;De-interla…

后台系统可扩展性学习笔记(十一)Database Denormalization

之前的两篇笔记中谈到了从单库扩展到多库以承载更多的请求量以及单库&#xff08;表&#xff09;拆分成多库&#xff08;表&#xff09;&#xff0c;打破单库的性能瓶颈。 这都是为了应对大数据量下的措施。 然而&#xff0c;除却数据量外&#xff0c;还有一个极其影响单库性能…