软件测试体系学习及构建（9）-HTML之布局、表单、框架、颜色

（9）-HTML之布局、表单、框架、颜色、颜色名、颜色值

1 html布局
- 1.1 使用div块元素
- - 1.1.1 举例
- 1.2 使用表格
- - 1.2.1 举例
2 表单
- 2.1 表单说明
- 2.2 表单标签
- 2.3 输入元素-文本域
- 2.4 输入元素-密码字段
- 2.5 输入元素-单选按钮
- 2.6 输入元素-复选框
- 2.7 输入元素-提交按钮
3 框架
- 3.1 语法
- 3.2 设置iframe宽高
- 3.3 iframe边框移除
4 颜色
- 4.1 颜色名
- 4.2 颜色值
- 4.3 颜色举例

1 html布局 1.1 使用div块元素

元素是用于分组 HTML 元素的块级元素；

1.1.1 举例





    
    布局学习



    
        
            NoamaNelson的博客
                
                    专注测试领域的测试技术研究，测试理论、测试方法、测试管理等测试知识分享
                    
                
            

        
        

        
            1000    1000     1000     100万    10

            原创    周排名    总排名    访问    等级

            

            5000    1000     6000     10万    8000

            积分     粉丝      获赞       评论     收藏

        
        
            内容在这里内容在这里内容在这里

            内容在这里内容在这里内容在这里

            内容在这里内容在这里内容在这里

            内容在这里内容在这里内容在这里

            内容在这里内容在这里内容在这里


        

        
            热门文章
            
                Visual Studio2019安装闪退（不弹出
下载界面）等问题解决方法 
                Visual Studio2019安装闪退（不弹出
下载界面）等问题解决方法 
                Visual Studio2019安装闪退（不弹出
下载界面）等问题解决方法 
            
        
        
            文章分类
            
                Visual Studio2019安装闪退（不弹出
下载界面）等问题解决方法 
                Visual Studio2019安装闪退（不弹出
下载界面）等问题解决方法 
                Visual Studio2019安装闪退（不弹出
下载界面）等问题解决方法

1.2 使用表格

可以使用 HTML 标签创建布局； 1.2.1 举例




 
     
    布局学习

NoamaNelson的博客
文章分类 Python C++ JAVA PHP	文章内容
版权信息

2 表单 2.1 表单说明

表单是一个包含表单元素的区域；
表单元素是允许用户在表单中输入内容；
表单使用表单标签
来设置；
格式：


内容部分

2.2 表单标签

标签	说明
	供用户输入的表单
	输入域
</td><td>文本域 (一个多行的输入控件)</td></tr><tr><td><label></td><td><input> 元素的标签，一般为输入标题</td></tr><tr><td><fieldset></td><td>一组相关的表单元素，并使用外框包含起来</td></tr><tr><td><legend></td><td><fieldset> 元素的标题</td></tr><tr><td><select></td><td>下拉选项列表</td></tr><tr><td><optgroup></td><td>选项组</td></tr><tr><td><option></td><td>下拉列表中的选项</td></tr><tr><td><button></td><td>一个点击按钮</td></tr><tr><td><datalist></td><td>一个预先定义的输入控件选项列表</td></tr><tr><td><keygen></td><td>表单的密钥对生成器字段</td></tr><tr><td><output></td><td>一个计算结果</td></tr></tbody></table> 2.3 输入元素-文本域 <ul><li>通过<input type="text"> 标签来设定；</li><li>使用场景：比如用户在表单中输入字母、数字等字符；</li><li>默认宽度为20个字符；</li><li>举例：</li></ul> <pre class='brush:php;toolbar:false'><!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>表单学习</title> </head> <body> <h2>1、输入元素：文本域</h2> <form> please input height: <input type="text" height="height"><br> please input weight: <input type="text" weight="weight"><br> </form> </body> </html> </pre> <p></p> 2.4 输入元素-密码字段 <ul><li>通过标签<input type="password"> 来定义；</li><li>输入的密码不显示，以星号或圆点代替；</li><li>举例：</li></ul> <pre class='brush:php;toolbar:false'><!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>表单学习</title> </head> <body> <h2>1、输入元素：文本域</h2> <form> please input height: <input type="text" height="height"><br> please input weight: <input type="text" weight="weight"><br> </form> <h2>2、输入元素：密码字段</h2> <form> please input password: <input type="password" name="pwd"><br> please input password again: <input type="password" name="pwd"><br> </form> </body> </html> </pre> <p></p> 2.5 输入元素-单选按钮 <ul><li>通过标签<input type="radio"> 定义;</li><li>举例：</li></ul> <pre class='brush:php;toolbar:false'><!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>表单学习</title> </head> <body> <h2>1、输入元素：文本域</h2> <form> please input height: <input type="text" height="height"><br> please input weight: <input type="text" weight="weight"><br> </form> <h2>2、输入元素：密码字段</h2> <form> please input password: <input type="password" name="pwd"><br> please input password again: <input type="password" name="pwd"><br> </form> <h2>3、输入元素：单选按钮</h2> <form> please select: <input type="radio" value="是">是<br> please select: <input type="radio" value="否">否<br> </form> </body> </html> </pre> <p></p> 2.6 输入元素-复选框 <ul><li>通过标签<input type="checkbox"> 定义；</li><li>举例：</li></ul> <pre class='brush:php;toolbar:false'><!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>表单学习</title> </head> <body> <h2>1、输入元素：文本域</h2> <form> please input height: <input type="text" height="height"><br> please input weight: <input type="text" weight="weight"><br> </form> <h2>2、输入元素：密码字段</h2> <form> please input password: <input type="password" name="pwd"><br> please input password again: <input type="password" name="pwd"><br> </form> <h2>3、输入元素：单选按钮</h2> <form> please select: <input type="radio" value="是">是<br> please select: <input type="radio" value="否">否<br> </form> <h2>4、输入元素：复选框</h2> <form> 你都在哪个网站写博客，请选择：<br> <input type="checkbox" name="boke" value="CSDN">CSDN<br> <input type="checkbox" name="boke" value="博客园">博客园<br> <input type="checkbox" name="boke" value="开源中国">开源中国<br> <input type="checkbox" name="boke" value="简书">简书<br> <input type="checkbox" name="boke" value="掘金">掘金<br> <input type="checkbox" name="boke" value="思否">思否<br> <input type="checkbox" name="boke" value="GitHub">GitHub<br> <input type="checkbox" name="boke" value="个人网站">个人网站<br> </form> </body> </html> </pre> <p></p> 2.7 输入元素-提交按钮 <ul><li>通过标签<input type="submit"> 定义；</li><li>单击确认按钮时，表单的内容会被传送到另一个文件；</li><li>表单的动作属性定义了目的文件的文件名；</li><li>举例：</li></ul> <pre class='brush:php;toolbar:false'><!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>表单学习</title> </head> <body> <h2>1、输入元素：文本域</h2> <form> please input height: <input type="text" height="height"><br> please input weight: <input type="text" weight="weight"><br> </form> <h2>2、输入元素：密码字段</h2> <form> please input password: <input type="password" name="pwd"><br> please input password again: <input type="password" name="pwd"><br> </form> <h2>3、输入元素：单选按钮</h2> <form> please select: <input type="radio" value="是">是<br> please select: <input type="radio" value="否">否<br> </form> <h2>4、输入元素：复选框</h2> <form> 你都在哪个网站写博客，请选择：<br> <input type="checkbox" name="boke" value="CSDN">CSDN<br> <input type="checkbox" name="boke" value="博客园">博客园<br> <input type="checkbox" name="boke" value="开源中国">开源中国<br> <input type="checkbox" name="boke" value="简书">简书<br> <input type="checkbox" name="boke" value="掘金">掘金<br> <input type="checkbox" name="boke" value="思否">思否<br> <input type="checkbox" name="boke" value="GitHub">GitHub<br> <input type="checkbox" name="boke" value="个人网站">个人网站<br> </form> <h2>5、输入元素：提交按钮</h2> <form name="input" action="xxx.py" method="GET"> 用户名: <input type="text" name="name"><br> 密码: <input type="password" name="pwd"><br> <input style=background-color:yellow; type="submit" value="submit"><br> </form> </body> </html> </pre> <p></p> 3 框架 3.1 语法 <ul><li>使用标签<iframe>定义；</li><li>作用是：通过框架可以在一个窗口中可以显示多个页面；</li><li>语法：</li></ul> <pre class='brush:php;toolbar:false'><iframe src="url"></iframe> </pre> 3.2 设置iframe宽高 <ul><li>使用height 和 width 属性用来定义iframe标签的高度与宽度；</li><li>默认为像素单位，也可使用比例；</li><li>举例：</li></ul> <pre class='brush:php;toolbar:false'><!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>框架学习</title> </head> <body> <iframe name="csdn" src="https://blog.csdn.net/NoamaNelson" width="300" height="300"></iframe> <iframe name="csdn" src="https://blog.csdn.net/NoamaNelson" width="300" height="300"></iframe> <iframe name="csdn" src="https://blog.csdn.net/NoamaNelson" width="300" height="300"></iframe> <br> <iframe name="csdn" src="https://blog.csdn.net/NoamaNelson" width="300" height="300"></iframe> <iframe name="csdn" src="https://blog.csdn.net/NoamaNelson" width="300" height="300"></iframe> <iframe name="csdn" src="https://blog.csdn.net/NoamaNelson" width="300" height="300"></iframe> <br> </body> </html> </pre> <p></p> 3.3 iframe边框移除 <ul><li>使用frameborder 属性定义iframe边框；</li><li>属性值为0，则表示移除边框；</li><li>举例：</li></ul> <pre class='brush:php;toolbar:false'><!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>框架学习</title> </head> <body> <iframe name="csdn" src="https://blog.csdn.net/NoamaNelson" frameborder="0" width="300" height="300"></iframe> <iframe name="csdn" src="https://blog.csdn.net/NoamaNelson" width="300" height="300"></iframe> </body> </html> </pre> <p></p> <ul><li>另外还有三个值的含义如下：</li></ul> <blockquote> <p>DENY：该网站页面不允许被嵌套；<br /> SAMEORIGIN：该页面可以在相同域名页面中被嵌套；<br /> ALLOW-FROM uri：该页面可以在指定来源页面中进行嵌套。</p> </blockquote> 4 颜色 <ul><li>HTML 颜色由红色、绿色、蓝色混合而成；</li></ul> 4.1 颜色名 <ul><li>HTML和CSS颜色规范定义有141个颜色名称（其中17个标准颜色）；</li><li>17标准颜色：黑色，蓝色，水，紫红色，灰色，绿色，石灰，栗色，海军，橄榄，橙，紫，红，白，银，蓝绿色，黄色；</li><li>比如颜色名：Bule、Black等等；</li></ul> 4.2 颜色值 <ul><li>颜色值由十六进制来表示红、绿、蓝（RGB）；</li><li>每个颜色的最低值为 0(十六进制为 00)，最高值为 255(十六进制为FF)；</li><li>十六进制值的写法为 # 号后跟三个或六个十六进制字符。</li></ul> 4.3 颜色举例 <pre class='brush:php;toolbar:false'><!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>颜色学习</title> </head> <body> <p style=background-color:yellow; >会当凌绝顶，</p> <p style=background-color:rgb(82,82,218); >一览众山小。</p> <p style=background-color:#FF0000>前两句是啥？。</p> </body> </html> </pre> <p></p> <hr /> <p align="center"><font color="#827717">『全栈测试技术，分享，共勉，共进，提升』</font></p> <hr /></div> </div> <div style="clear: both;"></div> <div class="author-info fl"> <div><span class="gray">转载请注明：</span>文章转载自 <a href="https://www.mshxw.com/" class="blue">www.mshxw.com</a></div> <div><span class="gray">本文地址：</span><a href="https://www.mshxw.com/it/307763.html" class="blue">https://www.mshxw.com/it/307763.html</a></div> </div> <div class="prev fl"> <p> <a style='text-align:left;' class='center-block text-center glyphicon glyphicon-collapse-down' href="https://www.mshxw.com/it/308093.html">上一篇 PHP给指定字符串前后添加指定字符方法</a> </p> <p> <a style='text-align:left;' class='center-block text-center glyphicon glyphicon-collapse-down' href="https://www.mshxw.com/it/307768.html">下一篇软件工程作业-方舟编译器学习笔记01-认识phase</a> </p> </div> <div class="new_tag fl"> </div> </div> <div class="new_r fr" style="border-radius:10px;"> <div class="tui fl"> <h3>Python相关栏目本月热门文章</h3> <ul> <li><span>1</span><a href="https://www.mshxw.com/it/1041277.html" title="【Linux驱动开发】设备树详解（二）设备树语法详解">【Linux驱动开发】设备树详解（二）设备树语法详解</a></li> <li><span>2</span><a href="https://www.mshxw.com/it/1041273.html" title="别跟客户扯细节">别跟客户扯细节</a></li> <li><span>3</span><a href="https://www.mshxw.com/it/1041266.html" title="Springboot+RabbitMQ+ACK机制(生产方确认(全局、局部)、消费方确认)、知识盲区">Springboot+RabbitMQ+ACK机制(生产方确认(全局、局部)、消费方确认)、知识盲区</a></li> <li><span>4</span><a href="https://www.mshxw.com/it/1041261.html" title="【Java】对象处理流（ObjectOutputStream和ObjectInputStream）">【Java】对象处理流（ObjectOutputStream和ObjectInputStream）</a></li> <li><span>5</span><a href="https://www.mshxw.com/it/1041256.html" title="【分页】常见两种SpringBoot项目中分页技巧">【分页】常见两种SpringBoot项目中分页技巧</a></li> <li><span>6</span><a href="https://www.mshxw.com/it/1041299.html" title="一文带你搞懂OAuth2.0">一文带你搞懂OAuth2.0</a></li> <li><span>7</span><a href="https://www.mshxw.com/it/1041297.html" title="我要写整个中文互联网界最牛逼的JVM系列教程 \| 「JVM与Java体系架构」章节：虚拟机与Java虚拟机介绍">我要写整个中文互联网界最牛逼的JVM系列教程 \| 「JVM与Java体系架构」章节：虚拟机与Java虚拟机介绍</a></li> <li><span>8</span><a href="https://www.mshxw.com/it/1041296.html" title="【Spring Cloud】新闻头条微服务项目：FreeMarker模板引擎实现文章静态页面生成">【Spring Cloud】新闻头条微服务项目：FreeMarker模板引擎实现文章静态页面生成</a></li> <li><span>9</span><a href="https://www.mshxw.com/it/1041294.html" title="JavaSE - 封装、static成员和内部类">JavaSE - 封装、static成员和内部类</a></li> <li><span>10</span><a href="https://www.mshxw.com/it/1041291.html" title="树莓派mjpg-streamer实现监控及拍照功能调试">树莓派mjpg-streamer实现监控及拍照功能调试</a></li> <li><span>11</span><a href="https://www.mshxw.com/it/1041289.html" title="用c++写一个蓝屏代码">用c++写一个蓝屏代码</a></li> <li><span>12</span><a href="https://www.mshxw.com/it/1041285.html" title="从JDK8源码中看ArrayList和LinkedList的区别">从JDK8源码中看ArrayList和LinkedList的区别</a></li> <li><span>13</span><a href="https://www.mshxw.com/it/1041281.html" title="idea 1、报错java: 找不到符号符号: 变量 log 2、转换成Maven项目">idea 1、报错java: 找不到符号符号: 变量 log 2、转换成Maven项目</a></li> <li><span>14</span><a href="https://www.mshxw.com/it/1041282.html" title="在openwrt使用C语言增加ubus接口（包含C uci操作）">在openwrt使用C语言增加ubus接口（包含C uci操作）</a></li> <li><span>15</span><a href="https://www.mshxw.com/it/1041278.html" title="Spring 解决循环依赖">Spring 解决循环依赖</a></li> <li><span>16</span><a href="https://www.mshxw.com/it/1041275.html" title="SpringMVC——基于MVC架构的Spring框架">SpringMVC——基于MVC架构的Spring框架</a></li> <li><span>17</span><a href="https://www.mshxw.com/it/1041272.html" title="Andy‘s First Dictionary C++ STL set应用">Andy‘s First Dictionary C++ STL set应用</a></li> <li><span>18</span><a href="https://www.mshxw.com/it/1041271.html" title="动态内存管理">动态内存管理</a></li> <li><span>19</span><a href="https://www.mshxw.com/it/1041270.html" title="我的创作纪念日">我的创作纪念日</a></li> <li><span>20</span><a href="https://www.mshxw.com/it/1041269.html" title="Docker自定义镜像-Dockerfile">Docker自定义镜像-Dockerfile</a></li> </ul> </div> </div> </div> <!-- 公共尾部 --> <div class="link main"> <div class="link_tit"> <span class="on">热门相关搜索</span> </div> <div class="link_tab"> <div class="link_con"> <a href="http://www.mshxw.com/TAG_1/luyouqishezhi.html">路由器设置</a> <a href="http://www.mshxw.com/TAG_1/mutuopan.html">木托盘</a> <a href="http://www.mshxw.com/TAG_1/baotamianban.html">宝塔面板</a> <a href="http://www.mshxw.com/TAG_1/shaoerpython.html">儿童python教程</a> <a href="http://www.mshxw.com/TAG_1/xinqingdiluo.html">心情低落</a> <a href="http://www.mshxw.com/TAG_1/pengyouquan.html">朋友圈</a> <a href="http://www.mshxw.com/TAG_1/vim.html">vim</a> <a href="http://www.mshxw.com/TAG_1/shuangyiliuxueke.html">双一流学科</a> <a href="http://www.mshxw.com/TAG_1/zhuanshengben.html">专升本</a> <a href="http://www.mshxw.com/TAG_1/wodexuexiao.html">我的学校</a> <a href="http://www.mshxw.com/TAG_1/rijixuexiao.html">日记学校</a> <a href="http://www.mshxw.com/TAG_1/xidianpeixunxuexiao.html">西点培训学校</a> <a href="http://www.mshxw.com/TAG_1/qixiuxuexiao.html">汽修学校</a> <a href="http://www.mshxw.com/TAG_1/qingshu.html">情书</a> <a href="http://www.mshxw.com/TAG_1/huazhuangxuexiao.html">化妆学校</a> <a href="http://www.mshxw.com/TAG_1/tagouwuxiao.html">塔沟武校</a> <a href="http://www.mshxw.com/TAG_1/yixingmuban.html">异形模板</a> <a href="http://www.mshxw.com/TAG_1/xinandaxuepaiming.html">西南大学排名</a> <a href="http://www.mshxw.com/TAG_1/zuijingpirenshengduanju.html">最精辟人生短句</a> <a href="http://www.mshxw.com/TAG_1/6bujiaonizhuihuibeipian.html">6步教你追回被骗的钱</a> <a href="http://www.mshxw.com/TAG_1/nanchangdaxue985.html">南昌大学排名</a> <a href="http://www.mshxw.com/TAG_1/qingchaoshierdi.html">清朝十二帝</a> <a href="http://www.mshxw.com/TAG_1/beijingyinshuaxueyuanpaiming.html">北京印刷学院排名</a> <a href="http://www.mshxw.com/TAG_1/beifanggongyedaxuepaiming.html">北方工业大学排名</a> <a href="http://www.mshxw.com/TAG_1/beijinghangkonghangtiandaxuepaiming.html">北京航空航天大学排名</a> <a href="http://www.mshxw.com/TAG_1/shoudoujingjimaoyidaxuepaiming.html">首都经济贸易大学排名</a> <a href="http://www.mshxw.com/TAG_1/zhongguochuanmeidaxuepaiming.html">中国传媒大学排名</a> <a href="http://www.mshxw.com/TAG_1/shoudoushifandaxuepaiming.html">首都师范大学排名</a> <a href="http://www.mshxw.com/TAG_1/zhongguodezhidaxue(beijing)paiming.html">中国地质大学(北京)排名</a> <a href="http://www.mshxw.com/TAG_1/beijingxinxikejidaxuepaiming.html">北京信息科技大学排名</a> <a href="http://www.mshxw.com/TAG_1/zhongyangminzudaxuepaiming.html">中央民族大学排名</a> <a href="http://www.mshxw.com/TAG_1/beijingwudaoxueyuanpaiming.html">北京舞蹈学院排名</a> <a href="http://www.mshxw.com/TAG_1/beijingdianyingxueyuanpaiming.html">北京电影学院排名</a> <a href="http://www.mshxw.com/TAG_1/zhongguohuquxueyuanpaiming.html">中国戏曲学院排名</a> <a href="http://www.mshxw.com/TAG_1/hebeizhengfazhiyexueyuanpaiming.html">河北政法职业学院排名</a> <a href="http://www.mshxw.com/TAG_1/hebeijingmaodaxuepaiming.html">河北经贸大学排名</a> <a href="http://www.mshxw.com/TAG_1/tianjinzhongdeyingyongjishudaxuepaiming.html">天津中德应用技术大学排名</a> <a href="http://www.mshxw.com/TAG_1/tianjinyixuegaodengzhuankexuejiaopaiming.html">天津医学高等专科学校排名</a> <a href="http://www.mshxw.com/TAG_1/tianjinmeishuxueyuanpaiming.html">天津美术学院排名</a> <a href="http://www.mshxw.com/TAG_1/tianjinyinlexueyuanpaiming.html">天津音乐学院排名</a> <a href="http://www.mshxw.com/TAG_1/tianjingongyedaxuepaiming.html">天津工业大学排名</a> <a href="http://www.mshxw.com/TAG_1/beijinggongyedaxuegengdanxueyuanpaiming.html">北京工业大学耿丹学院排名</a> <a href="http://www.mshxw.com/TAG_1/beijingjingchaxueyuanpaiming.html">北京警察学院排名</a> <a href="http://www.mshxw.com/TAG_1/tianjinkejidaxuepaiming.html">天津科技大学排名</a> <a href="http://www.mshxw.com/TAG_1/beijingyoudiandaxue(hongfujiaoou)paiming.html">北京邮电大学(宏福校区)排名</a> <a href="http://www.mshxw.com/TAG_1/beijingwanglaozhiyexueyuanpaiming.html">北京网络职业学院排名</a> <a href="http://www.mshxw.com/TAG_1/beijingdaxueyixuebupaiming.html">北京大学医学部排名</a> <a href="http://www.mshxw.com/TAG_1/hebeikejidaxuepaiming.html">河北科技大学排名</a> <a href="http://www.mshxw.com/TAG_1/hebeidezhidaxuepaiming.html">河北地质大学排名</a> <a href="http://www.mshxw.com/TAG_1/hebeitiyoxueyuanpaiming.html">河北体育学院排名</a> </div> </div> </div> <div class="footer"> <div class="dl_con"> <div class="width1200"> <dl> <dt>学习工具</dt> <dd><a href="https://www.mshxw.com/tools/algebra/" title="代数计算器">代数计算器</a></dd> <dd><a href="https://www.mshxw.com/tools/trigonometry/" title="三角函数计算器">三角函数</a></dd> <dd><a href="https://www.mshxw.com/tools/analytical/" title="解析几何">解析几何</a></dd> <dd><a href="https://www.mshxw.com/tools/solidgeometry/" title="立体几何">立体几何</a></dd> </dl> <dl> <dt>知识解答</dt> <dd><a href="https://www.mshxw.com/ask/1033/" title="教育知识">教育知识</a></dd> <dd><a href="https://www.mshxw.com/ask/1180/" title="百科知识">百科知识</a></dd> <dd><a href="https://www.mshxw.com/ask/1155/" title="生活知识">生活知识</a></dd> <dd><a class="https://www.mshxw.com/ask/1199/" title="常识知识">常识知识</a></dd> </dl> <dl> <dt>写作必备</dt> <dd><a href="https://www.mshxw.com/zuowen/1128/" title="作文大全">作文大全</a></dd> <dd><a href="https://www.mshxw.com/zuowen/1130/" title="作文素材">作文素材</a></dd> <dd><a href="https://www.mshxw.com/zuowen/1132/" title="句子大全">句子大全</a></dd> <dd><a href="https://www.mshxw.com/zuowen/1154/" title="实用范文">实用范文</a></dd> </dl> <dl class="mr0"> <dt>关于我们</dt> <dd><a href="https://www.mshxw.com/about/index.html" title="关于我们" rel="nofollow">关于我们</a></dd> <dd><a href="https://www.mshxw.com/about/contact.html" title="联系我们" rel="nofollow">联系我们</a></dd> <dd><a href="https://www.mshxw.com/sitemap/" title="网站地图">网站地图</a></dd> </dl> <div class="dl_ewm"> <div class="wx"> <img src="https://www.mshxw.com/skin/sinaskin//kaotop/picture/gzh.jpg" alt="交流群"> <p>名师互学网交流群</p> </div> <div class="wx"><img src="https://www.mshxw.com/skin/sinaskin//kaotop/picture/weixin.jpg" alt="名师互学网客服"> <p>名师互学网客服</p> </div> </div> </div> </div> <div class="copyright"> <p>名师互学网版权所有 (c)2021-2022 ICP备案号：<a href="https://beian.miit.gov.cn" rel="nofollow">晋ICP备2021003244-6号</a> </p> </div> </div> <!-- 手机端 --> <div class="m_foot_top"> <img src="https://www.mshxw.com/foot.gif" width="192" height="27" alt="我们一直用心在做"><br/> <a href="https://www.mshxw.com/about/index.html">关于我们</a> <a href="https://www.mshxw.com/archiver/">文章归档</a> <a href="https://www.mshxw.com/sitemap">网站地图</a> <a href="https://www.mshxw.com/about/contact.html">联系我们</a> <p>版权所有 (c)2021-2022 MSHXW.COM</p> <p>ICP备案号：<a href="https://beian.miit.gov.cn/" rel="nofollow">晋ICP备2021003244-6号</a></p> </div> <div class="to_top" style="display:none;"><img src="https://www.mshxw.com/skin/sinaskin//kaotop/picture/to_top.png"></div> <!--广告!--> <script type="text/javascript" src="https://www.mshxw.com/skin/sinaskin//kaotop/js/top.js"></script> <script src="https://www.mshxw.com/skin/sinaskin//kaotop/js/fixed.js" type="text/javascript"></script> <!--头条搜索!--> <script> (function(){ var el = document.createElement("script"); el.src = "https://lf1-cdn-tos.bytegoofy.com/goofy/ttzz/push.js?018f42187355ee18d1bfcee0487fc91a76ac6319beb05b7dc943033ed22c446d3d72cd14f8a76432df3935ab77ec54f830517b3cb210f7fd334f50ccb772134a"; el.id = "ttzz"; var s = document.getElementsByTagName("script")[0]; s.parentNode.insertBefore(el, s); })(window) </script> <!--头条搜索结束!--> <script> var _hmt = _hmt \|\| []; (function() { var hm = document.createElement("script"); hm.src = "https://hm.baidu.com/hm.js?e05fec1c87ee5ca07f1ce57d093866c4"; var s = document.getElementsByTagName("script")[0]; s.parentNode.insertBefore(hm, s); })(); </script> </div> </div> <script type="text/javascript"> $(".alert_kf").click(function() { mantis.requestChat(); }); </script> <script type="text/javascript"> var mySwiper_weixin = new Swiper('.pc_swiper_weixin', { autoplay: 3000, //可选选项，自动滑动 loop: true, speed: 1000, pagination: '.swiper-pagination', paginationClickable: true, }) </script> <script type="text/javascript"> $(function() { $(window).scroll(function() { if ($(window).scrollTop() > 100) { $(".to_top").fadeIn(1000); } else { $(".to_top").fadeOut(1000); } }); $(".to_top").click(function() { if ($('html').scrollTop()) { $('html').animate({ scrollTop: 0 }, 300); return false; } $('body').animate({ scrollTop: 0 }, 300); return false; }); }); </script> </body> </html>

软件测试体系学习及构建（9）-HTML之布局、表单、框架、颜色

NoamaNelson的博客 专注测试领域的测试技术研究，测试理论、测试方法、测试管理等测试知识分享

热门文章

文章分类

NoamaNelson的博客

NoamaNelson的博客
专注测试领域的测试技术研究，测试理论、测试方法、测试管理等测试知识分享