how2j.cn

下载区
文件名 文件大小
answer.html 4k

工具版本兼容问题
参考答案在右侧下载



步骤 1 :

练习效果图

edit Or  姿势不对,事倍功半! 点击查看做练习的正确姿势
练习效果图


HOW2J公众号,关注后实时获知最新的教程和优惠活动,谢谢。


问答区域    
2019-10-23 交作业
空白丨旋律




比给的答案简洁一点
加载中
<html>
<style>
div{
font-size:50%;
font-family:黑体;
}
span{
color:red;
}
table{
font-size:50%;
border-style:solid;
border-width:1px;
border-color:rgb(210,210,255);
border-collapse:collapse;
}
tr.nn{
border-top-style:solid;
border-top-width:2px;
border-top-color:rgb(210,210,255);
}
td.aa{
background:rgb(230,230,255);
color:blue;
}
td.ac{
width:300px;
}

input{
width:135px;
background:rgb(245,245,245);
font-size:50%;
border-style:solid;
border-color:gray;
border-width:thin;
}
input.ad{
width:80px;
margin:7px;
}
p{
background:rgb(245,245,245);
padding:10px;
}
a{
color:blue;
}
</style>
<div>
<span>请注意:带有“*”的项目必须填写。</span>
<table>
<tr>
<td colspan="3" class="aa"><b>请填写您的用户名:</b></td>
</tr>
<tr>
<td><span>*</span>通行证用户名:</td>
<td ><input type="text" placeholder="请输入用户名"><br/><a href="https://www.baidu.com/">查看用户名是否被占用</a></td>
<td class="ac"><p>用户名由a~z的英文字母(不区分大小写)、0~9的数字、点、减号或下划线组成,长度为3~18个字符,只能以数字或者字母开头和结尾,例如:kyzy_001.</p></td>
</tr>
<tr class="nn">
<td colspan="3" class="aa"><b>请填写安全设置:</b>(安全设置用于验证账号和找回密码)</td>
</tr>
<tr>
<td colspan="3"><span>以下信息对保证您账号的安全极为重要,请您务必认真填写。</span></td>
</tr>
<tr>
<td><span>*</span>输入登录密码:</td>
<td><input type="password"></td>
<td rowspan="2" class="ac"><p>密码长度为6~16位,区分字母大小写。登录密码可以由字母、数字、特殊字符组成。【<a href="https://www.baidu.com/">更多说明</a>】</p></td>
</tr>
<tr>
<td><span>*</span>登录密码确认:</td>
<td><input type="password"></td>
</tr>
<tr class="nn">
<td><span>*</span>密码提示问题:</td>
<td><input type="password"></td>
<td rowspan="2" class="ac"><p>当你忘记密码时可以由此找回密码。例如,问题是“我的哥哥是谁?”,答案为“peter2”。问题长度不大于36个字符,一个汉字占两个字符。答案长度在6~30位之间,区分大小写。【<a href="https://www.baidu.com/">更多说明</a>】</p></td>
</tr>
<tr>
<td><span>*</span>密码提示答案:</td>
<td><input type="password"></td>
</tr>
<tr class="nn">
<td align="right"><span>*</span>输入安全码:</td>
<td><input type="password"></td>
<td rowspan="2" class="ac"><p>安全码是找回密码的重要途径,安全码长度为6~16位,区分字母大小写,由字母、数字、特殊字符组成。<span>特别提醒:安全码一旦设定,将不可自行修改。</span>【<a href="https://www.baidu.com/">更多说明</a>】</p></td>
</tr>
<tr>
<td align="right"><span>*</span>安全码确认:</td>
<td><input type="password"></td>
</tr>
<tr class="nn">
<td colspan="3" align="center"><input class="ad" type="button" value="提 交 表 单"></td>
</tr>
</table>
</div>
</html>

							





回答已经提交成功,正在审核。 请于 我的回答 处查看回答记录,谢谢
答案 或者 代码至少填写一项, 如果是自己有问题,请重新提问,否则站长有可能看不到





2019-10-21 交作业,搞了四遍,可算会搞了。。。
则恺




<html>
    <head>
        <meta charset="UTF-8">

<style>
.yidong{
	width:700px;
	padding:200px;
	margin:auto;
}
.background{
	width:720px;
	border:2px solid lightblue;
	
}
.background2{
	background-color:whitesmoke;
}
table{
	border-bottom:1px solid lightblue;
}
.title{
	background-color:lightblue;
	font-size:15px;
	font-weight:bold;
	color:steelblue;
	margin:2px;
	display:block;
}
.ziti{
	font-size:13px;
	letter-spacing:1.5px;
}
.title2{
	font-size:14px;
}
.red{
	color:red;
}
tr
td.one{
	width:20%;
}
td.two{
	width:20%;
}
td.thr{
	width:60%;
}
td{
    height:70px;
}
</style>
</head>

<body>
	<div class="yidong">
	<div style="font-size:12px"
		class="red ziti">请注意:带有“*”的项目必须填写
	</div>
<div class="background">
<span class="title">填写您的用户名:</span>

<table>
	<tr>
		<td class="ziti one"><span class="red">*</span>通行证用户名:</td>
		<td class="ziti two">
			<input type="text" style="background-color:ghostwhite;color:gray" value="请输入用户名" onfocus="if (value=='请输入用户名'){value=''}" onblur="if (value=='') {value='请输入用户名'}">
			<a href="">查看用户名是否被占用</a>
		</td>
		<td class="ziti thr background2">
			用户名由a~z的英文字母(不区分大小写)、0~9的数字、<b>点、减号</b>或<b>下划线</b>组成,长度为3~18个字符,只能以数字或者字母开头和结尾,例如:kyzy_001。
		</td>
	</tr>
</table>
<div class="title">
	请填写安全设置:<span class="title2" style="font-weight:normal">(安全设置用于验证账号和找回密码)</span>
</div>
<div class="ziti red">
	以下信息对保证您账号的安全极为重要,请您务必认真填写。
	</div>

<table>
	<tr>
		<td class="ziti one">
			<span class="red">*</span>
			输入登陆密码:<br/>
			<span class="red">*</span>
			登录密码确认:
		</td>
		<td class="two">
			<input type="text" style="background-color:ghostwhite">
			<input type="text" style="background-color:ghostwhite">
		</td>
		<td class="ziti thr background2">       密码长度为6~16位,区分字母大小写,登陆密码可以由字母、数字、特殊字符组成。【<a href="">更多说明</a>】  
		</td>
	</tr>
</table>

<table>
	<tr>
		<td class="ziti one">
			<span class="red">*</span>
			密码提示问题:<br/>
			<span class="red">*</span>
			密码提示答案:
		</td>
		<td class="two">
			<input type="text" style="background-color:ghostwhite"><br/>
			<input type="text" style="background-color:ghostwhite">
		</td>
		<td class="ziti thr background2">
			当您忘记密码时可以由此找回密码,问题是“我的哥哥是谁”,答案为“perer2”。问题长度<b>不大于</b>36个字符,一个汉字占两个字符,答案长度在6~30位之间,区分大小写。【<a href="">更多说明</a>】
		</td>
	</tr>
</table>

<table>
	<tr>
		<td class="ziti one">
			<span class="red">*</span>
			输入安全码:<br/>
			<span class="red">*</span>
			安全码确认:
		</td>
		<td class="two">
             <input type="text" style="background-color:ghostwhite"><br/>
             <input type="text" style="background-color:ghostwhite">
		</td>
		<td class="ziti thr background2">
			安全码是您找回密码的重要途径,安全码长度为6~16位,区分字母大小写,由字母、数字、特殊字符组成。<font class="red">特别提醒:安全码一旦设定,将不可自行修改。</font>【<a href="">更多说明</a>】
		</td>
	</tr>
</table>
<center>
	<input type="button" style="margin:15px" value="   提 交 表 单   ">
</center>

</div>
</div>

</body>
</html>

							





回答已经提交成功,正在审核。 请于 我的回答 处查看回答记录,谢谢
答案 或者 代码至少填写一项, 如果是自己有问题,请重新提问,否则站长有可能看不到





2019-09-25 提交
2019-09-17 交作业
2019-08-30 交作业!!
2019-08-27 交作业!!!!
2019-07-25 兄弟们,我吐了
2019-07-23 ZZ交作业 CSS-综合性练习3
2019-07-22 。。。。
2019-07-05 最新作业
2019-05-29 提交提交,写的不是很好
2019-04-24 交作业
2019-03-30 交作业啦啦
2019-03-24 交作业 用div布局做了一点感觉太麻烦了 又改成table
2019-03-07 提交作业
2019-03-03 内边距怎么设置
2019-03-03 交作业
2019-01-25 交了交了 调得头疼
2019-01-12 交作业,框框隔离弄了好久,还是要记得多用div
2019-01-06 为啥我的文本框和左边的输入提示都不能够居中 vertical-align:center为啥失效
2018-12-08 交作业
2018-11-28 交作业
2018-10-01 交作业
2018-08-13 交作业
2018-06-07 作业
2018-06-05 作答!
2017-12-22 交作业
2017-12-20 用table快很多,虽然我写的比较慢
2017-03-14 也是按照图片写了一个,不是用table写的
2017-02-24 练习题贴图
2017-01-14 照图搞了一个...
2016-11-04 简单做了一下 做得不好 见谅(效果图 见下)
2016-11-02 没有见答案呢?




提问之前请登陆
提问已经提交成功,正在审核。 请于 我的提问 处查看提问记录,谢谢
关于 前端部分-CSS-综合性练习3 的提问

尽量提供截图代码异常信息,有助于分析和解决问题。 也可进本站QQ群交流: 982790551
提问尽量提供完整的代码,环境描述,越是有利于问题的重现,您的问题越能更快得到解答。
对教程中代码有疑问,请提供是哪个步骤,哪一行有疑问,这样便于快速定位问题,提高问题得到解答的速度
在已经存在的几千个提问里,有相当大的比例,是因为使用了和站长不同版本的开发环境导致的,比如 jdk, eclpise, idea, mysql,tomcat 等等软件的版本不一致。
请使用和站长一样的版本,可以节约自己大量的学习时间。 站长把教学中用的软件版本整理了,都统一放在了这里, 方便大家下载: https://how2j.cn/k/helloworld/helloworld-version/1718.html

上传截图