求助！编写例题《利用CSS对注册页面实现修饰》遇到的问题

最新推荐文章于 2019-05-23 22:31:41 发布
最新推荐文章于 2019-05-23 22:31:41 发布
阅读量197 收藏 1
点赞数 1
分类专栏： 笔记
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/wqw_pakchoi/article/details/82855300
版权

（前面都是问题描述和遇到的问题，求助的问题在文末。）

原始界面：

注册界面

这里的界面与书上给的界面不一样的问题：“请选择你的性别！”这个提示信息太远了。

代码如下：

<!DOCTYPE html>
<html>
  <head>
    <title>注册页面</title>
    
    <meta name="keywords" content="keyword1,keyword2,keyword3">
    <meta name="description" content="this is my page">
    <meta name="content-type" content="text/html; charset=UTF-8">
    
    <!--<link rel="stylesheet" type="text/css" href="./styles.css">-->

  </head>
  
  <body>
    <form action="">
    <table border="0" align="center" width="600">
    <tr><td colspan="3" align="center" height="40">填写注册信息</td></tr>
    <tr><td align="right">用户名：*</td>
        <td> <input type="text" name="username"></td>
        <td>用户名由字母开头，后跟字母，数字或下划线！</td>
    </tr>
    <tr><td align="right">密码：*</td>
        <td> <input type="password" name="userpassword"></td>
        <td>设置登录密码，至少6位！</td>
    </tr>
    <tr><td aling="right">确认密码：*</td>
        <td> <input type="paaword" name="userpassword1"></td>
        <td>请再输入一次你的密码！</td>
    </tr>
    <tr><td align="right">性别：*</td>
        <td> <input type="radio" name="usersex" value="男" checked>男</td>
        <td>   <input type="radio" name="usersex" value="女">女</td>
        <td>请选择你的性别！</td>
    </tr>
    <tr> <td align="right">邮箱地址：*</td>
         <td> <input type="text" name="useremail" ></td>
         <td> 请填写你的常用邮箱，可以用次此邮箱找回密码！</td>
    </tr>
    <tr><td align="right" valign="top">基本情况：*</td>
        <td colspan="2">
            <textarea name="userbasicinfo" rows="5" cols="50"></textarea></td>
    </tr>
    <tr><td colspan="3" align="center" height="40">
        <input type="checkbox" name="accept" value="yes">
                        我已仔细阅读并同意接受用户使用协议</td>
    </tr>
    <tr><td colspan="3" align="center" height="40">
        <input type="submit" value="确认">&nbsp;
        <input type="reset" value="取消">
        </td>
    </tr>
        </table>
    </form>
  </body>
</html>

编写CSS文档：2-8-CSS.css，在该文档中定义整体样式。（这里使用的是导入式）

<!--程序2-8-CSS.css-->
<style type="text/css">
         #title{color:#FF7B0B;font-size:20px;font-weight:bod;}
         #i{width:350px;height:15px;color:blue;font-size:12px;}
         table{text-align:left;}
         #t{text-align:right;}
</style>

 

利用CSS对页面实现修饰（红色标记的为主要修改的地方）

源代码：

<!DOCTYPE html>
<html>
  <head>
    <title>注册页面</title>
    <style type="text/css">@import url(2-8-CSS.css);</style>
    <meta name="keywords" content="keyword1,keyword2,keyword3">
    <meta name="description" content="this is my page">
    <meta name="content-type" content="text/html; charset=UTF-8">
    
    <!--<link rel="stylesheet" type="text/css" href="./styles.css">-->

  </head>
  
  <body>
    <form action="">
    <table border="0" align="center" width="600">
    <tr><td colspan="3" align="center" height="40" id="title">填写注册信息</td></tr>
    <tr><td  id="t">用户名：*</td>
        <td> <input type="text" name="username"></td>
        <td id="i">用户名由字母开头，后跟字母，数字或下划线！</td>
    </tr>
    <tr><td  id="t">密码：*</td>
        <td> <input type="password" name="userpassword"></td>
        <td id="i">设置登录密码，至少6位！</td>
    </tr>
    <tr><td  id="t">确认密码：*</td>
        <td> <input type="paaword" name="userpassword1"></td>
        <td id="i">请再输入一次你的密码！</td>
    </tr>
    <tr><td  id="t">性别：*</td>
        <td> <input type="radio" name="usersex" value="男" checked>男    <!--这里把这两个性别写在一列里面-->
             <input type="radio" name="usersex" value="女">女</td>
        <td id="i">请选择你的性别！</td>
    </tr>
    <tr> <td  id="t">邮箱地址：*</td>
         <td> <input type="text" name="useremail" ></td>
         <td id="i"> 请填写你的常用邮箱，可以用次此邮箱找回密码！</td>
    </tr>
    <tr><td  valign="top" id="t">基本情况：*</td>
        <td colspan="2">
            <textarea name="userbasicinfo" rows="5" cols="50"></textarea></td>
    </tr>
    <tr><td colspan="3" align="center" height="40">
        <input type="checkbox" name="accept" value="yes">
                        我已仔细阅读并同意接受用户使用协议</td>
    </tr>
    <tr><td colspan="3" align="center" height="40">
        <input type="submit" value="确认">&nbsp;
        <input type="reset" value="取消">
        </td>
    </tr>
        </table>
    </form>
  </body>
</html>

修饰后的页面：

这里的界面，“用户名：*”这些信息分行了，因此我把<table border="0" align="center" width="600">修改为<table border="0" align="center" width="700">。

修改后界面：

这里的问题是“填写注册信息”这里的颜色没显示出来，反复确认css代码没问题。百度也没能找到解决的问题，不知道有没有人知道这是怎么回事呢？

 

wqw_pakchoi
关注
  • 1
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
C语言经典例题100.rar_C语言：经典例题_c语言100例题_c语言例子_c语言例题_代码实现
09-22
C语言经典例题100道，包含题目及C语言代码实现。
N_Queen.zip_n后问题例题_queen
09-14
关于C语言典型例题八皇后问题的实现，用到了栈的知识，将代码稍微改动可以变成N皇后的解。
利用C语言实现“百马百担”问题方法示例
08-28
百马百担是道经典的算法题，下面这篇文章主要给大家介绍了利用C语言实现“百马百担”问题的相关资料，文中通过示例代码介绍的非常详细，需要的朋友可以参考借鉴，下面随着小编来一起学习学习吧。
1+X Web前端开发例题 实操题2
04-30
内容为1+X Web前端开发例题 题目类型为实操题 包含11题(与我的其他资源有一二重复例题) 内容不含答案解析(答案可以来我的博客找喔，有题目分析 https://blog.csdn.net/weixin_53231455?spm=1011.2124.3001.5343 题目类型都是前端开发的知识点
js css 实现的登录注册页面
08-13
js css 实现的登录注册页面（达内老师写的）
基于HTML5+css+JS的精美登陆注册界面
03-18
基于HTML5+css+JS的精美登陆注册界面
Java Web 2.2.3 案例——利用CSS对注册页面实现修饰（2）
Boyka1046的博客
09-23 437
【实现2】设计CSS样式表文档 #title{color:#DD7B0B;font-size:20px;font-weight:bod;} #i{width:350px;height:15px;color:blue;font-size:12px;} table{text-align:left;} #t{text-align:right;} 【实现3】利用CSS对页面实现修
利用CSS对注册页面实现修饰
weixin_34119545的博客
10-04 234
无修饰： 【代码】 <!-- 程序 ch02_8_1_register.html--><html> <head> <title>注册页面</title> </head> <body> <form action=""> <table border="0" align="c...
案例---利用CSS对注册页面实现修饰
qq_40956679的博客
09-24 1481
设计如图1所示的注册页面，该页面没有修饰，不够美观，采用CSS修饰页面，重新设计页面，如图2所示。 图一： 一、原页面代码：ch02_8_1_register.html &lt;!--程序 ch02_8_1_register.html--&gt; &lt;!DOCTYPE html&gt; &lt;html&gt; &lt;head&gt;&lt;meta charset="UTF-8"...
Java Web 2.2.3 案例——利用CSS对注册页面实现修饰
Boyka1046的博客
09-20 669
【例2-8】2-9的注册页面，没有修饰，，不够美观，采用CSS修饰页面，重新设计页面。 【分析】采用三步逐步实现，完善设计 第一步：按所给出的原始界面，设计HTML文档：2_8_register.html。 第二步：设计CSS文档：2_8_Css.css，在该文档中包含所需要的格式控制，从而形成修饰后的页面。 第三步：利用2_8_Css.css中定义的样式，重新设计2_8_register
精选有限单元法平面问题例题讲义共37页.pdf
10-27
精选有限单元法平面问题例题讲义共37页.pdf
在编写工程注册页面中的体会和遇到的问题
weixin_30778805的博客
04-10 81
在用notepad++编写注册界面的过程中对于将标题与注册框之间的间距不要太大，将body和head的盒子模型的外边距和内边距均设为0，代码如下： <style type="text/css">head{margin:0px;padding:0px;}body{margin:0px;padding:0px;text-align:center;} </style> 但是...
java连接数据库新增操作报错：java.util.Date cannot be cast to java.sql.Date的解决办法
热门推荐
wqw_pakchoi的博客
11-08 1万+
首先附上我实现新增数据的方法：   pstmt.setDate(4,(java.sql.Date) new Date(new java.util.Date().getTime()));这个语句就是错误的关键。 因为页面接受的Date是java.util.Date,而在数据库里面就需要用java.sql.Date,所以就要进行转换。但是直接转换是不对的。 但是，我一开始写的是pstmt....
HTML页面引用JS的时候，浏览器的alert弹出框中文显示乱码问题解决（图文）
wqw_pakchoi的博客
11-11 3521
写好了注册界面，用JavaScript 实现输入验证的时候，弹出框显示乱码，如图：   解决： 方法1.将编码都设置成一致的： 在我的程序里面，我都将编码设置成一致的了，但是还是没用。   方法2. 将js页面的内容全部复制，电脑桌面新建一个文本文件，将内容粘贴到文本文件里面。 选择文件，选择另存为： 保存类型选择所有文件： 编码选择UTF-8： ...
使用SAX解析XML文件出现中文乱码问题（dom4j）
wqw_pakchoi的博客
03-24 2272
乱码问题很多都是跟编码有关，结合我的系统的功能，先将数据从内存存入xml文件中，再从xml中解析出来，这一个过程中，会遇到3次编码的过程。 第一，数据从在myeclipse写着的时候的编码。 第二，数据存入磁盘xml文件的编码。 第三，数据从磁盘文件中解析到内存显示在控制台的编码。 只要这三个过程的编码一致（好像范围大的变成范围小的也没问题?总之最好全用UTF-8，那最大），那么就不会出现...
登录页面的简单实现（不涉及数据库）
wqw_pakchoi的博客
09-18 1813
题目描述：第一个页面：登录页面，可输入用户名，密码然后提交或者重置。                   第二个页面：处理页面，处理判断用户名是否为123，密码是否为123456，然后决定跳转的页面。                   第三个页面：欢迎页面。                   第四个页面：错误页面。可重新返回登录页面。 具体实现： login.jsp &lt;bod...
关于radio单选按钮和checkbox复选框的name！！！
wqw_pakchoi的博客
05-23 1764
网上很多对这两个的说法，还都不太一样。 所以，我也来说瞎说两句，哈哈哈。 radio的name必须是要一致的这个是毋庸置疑的了，书上说是为了将它们组成一组，设置相同的name，确保只能有一个选项被选中。所以，如果你的name不一样，那么radio单选框也可以多选了。不信的话可以去试试。 那么问题来了，checkbox可以多选，所以是不是name就要设置成不一样的，好让服务器知道我们都选了...
使用vc6.0调试程序的过程中出现find source的问题
wqw_pakchoi的博客
11-04 1482
使用vc6.0调试程序的过程中出现find source这个问题主要是因为程序中出现了printf语句，只要屏蔽掉那些输出语句就可以正常调试了。
启动tomcat出现java.net.BindException异常
wqw_pakchoi的博客
09-17 1462
问题描述：启动tomcat出现java.net.BindException:Address already in use:JVM_Bind异常信息。 解决方法：遇到这个问题的可能情况有以下两种。 （1）当前端口已经有别的程序占用着，所以要么把占用这个端口的程序关闭，要么重新换一个端口。修改tomcat默认端口的方法是，打开tomcat安装目录下的conf文件夹中的sever.xml文件，在se...
利用tcp首部格式实现滑动窗口的相关例题及解答
最新发布
09-25
### 回答1： TCP首部格式可以实现滑动窗口的...这个例题展示了如何利用TCP首部格式实现滑动窗口的基本过程。在实际的应用中，滑动窗口的大小和其他参数可能会根据具体情况而有所调整，但基本的原理和机制是相同的。

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

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

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值