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

最新推荐文章于 2023-04-22 18:29:42 发布
最新推荐文章于 2023-04-22 18:29:42 发布
阅读量205 收藏 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
    评论
专栏目录
Java Web 2.2.3 案例——利用CSS对注册页面实现修饰
Boyka1046的博客
09-20 680
【例2-8】2-9的注册页面，没有修饰，，不够美观，采用CSS修饰页面，重新设计页面。 【分析】采用三步逐步实现，完善设计 第一步：按所给出的原始界面，设计HTML文档：2_8_register.html。 第二步：设计CSS文档：2_8_Css.css，在该文档中包含所需要的格式控制，从而形成修饰后的页面。 第三步：利用2_8_Css.css中定义的样式，重新设计2_8_register
Java Web 2.2.3 案例——利用CSS对注册页面实现修饰（2）
Boyka1046的博客
09-23 446
【实现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_64313535的博客
04-22 5126
用CSS和HTML做的一个用户登录页面（附全部代码）
案例---利用CSS对注册页面实现修饰
qq_40956679的博客
09-24 1593
设计如图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"...
js css 实现的登录注册页面
08-13
js css 实现的登录注册页面（达内老师写的）
N_Queen.zip_n后问题例题_queen
09-14
关于C语言典型例题八皇后问题的实现，用到了栈的知识，将代码稍微改动可以变成N皇后的解。
精选有限单元法平面问题例题讲义共37页.pdf
10-27
精选有限单元法平面问题例题讲义共37页.pdf
C语言经典例题100.rar_C语言：经典例题_c语言100例题_c语言例子_c语言例题_代码实现
09-22
《C语言经典例题100》是一份珍贵的学习资源，包含了100个精心挑选的C语言编程问题，旨在帮助学习者深入理解和熟练运用C语言。这些例题覆盖了C语言的基础语法、数据类型、控制结构、函数、指针、数组、结构体等核心...
Python利用神经网络解决非线性回归问题实例详解
09-19
主要介绍了Python利用神经网络解决非线性回归问题,结合实例形式详细分析了Python使用神经网络解决非线性回归问题的相关原理与实现技巧,需要的朋友可以参考下
1+X Web前端开发例题 实操题1
03-30
内容为1+X Web前端开发例题 实操题6题 内容不含答案解析(答案可以来我的博客找喔，有题目分析 https://blog.csdn.net/weixin_53231455?spm=1019.2139.3001.5343 题目类型都是前端的知识点
基于HTML5+css+JS的精美登陆注册界面
03-18
基于HTML5+css+JS的精美登陆注册界面
html&css实现简单的注册页面
weixin_30768175的博客
08-05 380
使用HTML实现注册页面 HTML <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>注册页面</title> </head> <body> <form ac...
html+css+js实现简单登陆注册界面
热门推荐
caoxu12457的博客
01-16 1万+
前辈们请跳过 前端入门学习第二天，对照W3C的文档写了简单的登录注册实现。 html和css,js分别负责网页的界面、样式、动作。其中html提供的标签配合CSS实现界面美化的功能，CSS3中加入了新的样式，HTML5中也加入了更加方便的控件选择。例如本次页面中的输入框中提示就是用新加入的placeholder实现。谷歌、火狐等浏览器都可以正常解析。 login.html:...
清爽登录界面html,基于css3实现扁平简洁清爽的登录注册页面代码
weixin_29475313的博客
06-07 482
今天给大家分享一款基于css3实现扁平简洁清爽的登录注册页面代码，使用浅色设计，兼容移动设备，加入了基本的表单验证，适合大部分网站。代码很简单有css样式，index.html两部分代码。感兴趣的朋友可以查看效果演示，也可以下载源码,此段代码适用于任何浏览器：搜狗、360、FireFox(建议)、Chrome、Safari、Opera、傲游、世界之窗，是一款不错的的特效源码！首先是登录界面，我命名...
写代码中遇到的各种问题
u013345082的博客
10-24 2161
1、DreamWear2019版本新建html5模板在新版的火狐浏览器70.0（64位）打开后查看控制台提示 （XML 解析错误：语法位置错误：http://127.0.0.1:52377/previewapp/localurl 行 1，列 1）。 原因：。 解决方法：待解决。 ...
HTML中插入CSS修饰的三种方法
花花的果子的博客
08-31 4410
在HTML中插入CSS修饰的三种方法 内联插入 <div style="width: 300px; height: 300px;background-color: aqua;display: block; border-color: red ; border-width: 1px; border-style: solid;" ></div> 第二种方式 第三种方式 ...
html css实现登录注册页面,基于HTML5+css+JS_的精美登陆注册界面
weixin_34178408的博客
06-03 2093
【实例简介】基于HTML5+css+JS的精美登陆注册界面-------------------------------【实例截图】【核心代码】login4├── index.html├── resources│ ├── images│ │ ├── arrow.png│ │ ├── arrow-p.png│ │ ├── bg.png│ │ ├── btn.png...
CSS注册页面实现
weixin_43521197的博客
10-26 440
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>注册页面</title> <style> body{ background: url("img/register_bg.jpg") no-repeat; ba...
利用tcp首部格式实现滑动窗口的相关例题及解答
最新发布
09-25
### 回答1： TCP首部格式可以实现滑动窗口的原理是，TCP首部格式的控制部分中有一个叫做窗口大小的字段，它代表着接收方可以接收的数据量，当接收方接收到数据之后，会将窗口大小的字段减去接收的数据量，从而实现滑动窗口的功能。一个具体的例题为：假设A发送方发送了1000字节的数据，B接收方的窗口大小字段为500字节，那么B接收方只会接收到500字节的数据，其余的500字节的数据会被暂时存储起来，等待B接收方更新窗口大小信息之后再继续发送。 ### 回答2： 在使用TCP协议进行数据传输时，可以利用TCP首部格式中的滑动窗口来实现流量控制和错误恢复。下面是一个相关的例题及解答： 例题：假设发送方发送的数据使用滑动窗口协议进行传输，发送方窗口大小为4，初始时发送方窗口中有4个未被确认的数据包，分别为1234。接收方一共收到了9个数据包，但其中的顺序可能有些被交换或丢失了。假设接收到的数据包顺序为213564987（数字表示数据包）。请问接收方应该返回给发送方的确认序列号是什么？发送方应该做出什么操作？ 解答：接收方应该返回确认序列号为5，表示接收方已经成功接收到序号为5的包以前的所有数据。发送方收到确认序列号5后，将窗口向后滑动一位，窗口中的数据包序列号变为2345。然后，发送方应该重新发送序号为1和2的数据包，因为接收方未成功接收这两个数据包。同时，发送方可以选择等待一段时间来确认接收方是否会发送重复确认序列号5的确认信息，以此来判断是否需要重新发送序号为3和4的数据包。发送方重传数据包后，继续等待接收方的确认信息，进行下一轮的数据传输。如果在等待一段时间后没有收到确认信息，发送方会超时重传数据包，直到数据包成功被接收方确认。通过不断地进行滑动窗口的操作，发送方和接收方可以完成可靠的数据传输和错误恢复。 ### 回答3： 滑动窗口是一种流量控制和拥塞控制机制，可以优化数据传输的效率和可靠性。TCP协议中的首部格式提供了实现滑动窗口的基础。 下面是一个简单的滑动窗口例题及解答： 假设发送方(Sender)和接收方(Receiver)之间建立了一个TCP连接，并且Sender希望发送10个数据包给Receiver。滑动窗口的大小为3个数据包。在开始时，Sender处于初始状态，滑动窗口的起始序号和终止序号分别为1和4。 1. Sender发送第1个数据包到Receiver，并将滑动窗口的终止序号更新为4。 2. Receiver收到第1个数据包，并向Sender发送一个确认(ACK)。注意，ACK的序号为4，表示Receiver期望接收的下一个数据包的序号为4。 3. Sender收到ACK4后，判断接收方已经正确接收了第1个数据包。于是，Sender向滑动窗口中插入第2个数据包，滑动窗口的起始序号和终止序号分别为2和5，然后发送第2个数据包。 4. Receiver收到第2个数据包后，向Sender发送ACK5，表示期望接收下一个数据包的序号为5。 5. Sender收到ACK5后，判断接收方已经正确接收了第2个数据包。于是，Sender向滑动窗口中插入第3个数据包，滑动窗口的起始序号和终止序号分别为3和6，然后发送第3个数据包。 6. Receiver收到第3个数据包后，向Sender发送ACK6，表示期望接收下一个数据包的序号为6。 7. Sender收到ACK6后，判断接收方已经正确接收了第3个数据包。此时，滑动窗口的起始序号和终止序号分别为4和7。 8. Sender可以继续向滑动窗口中插入第4个数据包，并发送给Receiver。 通过以上步骤，Sender可以持续地向滑动窗口中插入新的数据包，并在确认收到ACK后继续插入更多的数据包。而Receiver则可以通过发送ACK给Sender来告知可以接收数据包的序号范围。 这个例题展示了如何利用TCP首部格式实现滑动窗口的基本过程。在实际的应用中，滑动窗口的大小和其他参数可能会根据具体情况而有所调整，但基本的原理和机制是相同的。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值