HTML教程--网页教程与代码 - 图文(6)

2019-05-26 17:04

用checked表示缺省已选的选项。

演示示例

表单控件(Form Control)：单选框(input type=\使用单选框，让用户在一组选项里只能选择一个。示例代码：

演示示例

用checked表示缺省已选的选项。

演示示例

表单控件(Form Control)：下拉框(select)

下拉框(Select)既可以用做单选，也可以用做复选。单选例句如下：

演示示例

用户还可以用size属性来改变下拉框(Select)的大小。演示示例

表单控件(Form Control)：多行输入框(textarea)

多行输入框(textarea)主要用于输入较长的文本信息。例句如下：

<p>其中cols表示textarea的宽度，rows表示textarea的高度。演示示例 </p><p> </p><p>表单控件(Form Control)：密码输入框(input type=\</p><p>密码输入框(input type=\主要用于一些保密信息的输入，比如密码。因为用户输入的时候，显示的不是输入的内容，而是黑点符号。。例句如下： </p><p><input type=\</p><p>演示示例 </p><p> </p><p>表单控件(Form Control)：提交(input type=\</p><p>通过提交(input type=submit)可以将表单(Form)里的信息提交给表单里action所指向的文件。例句如下： </p><p><input type=\提交\</p><p>演示示例 </p><p> </p><p>表单控件(Form Control)：图片提交(input type=\</p><p>input type=image 相当于 input type=submit，不同的是，input type=image 以一个图片作为表单的提交按钮，其中 src 属性表示图片的路径。 </p><p><input type=\images/icons/go.gif\alt = \提交\</p><p>演示示例 </p><p> </p><p> </p><p>HTML图片(Images) </p><p>用 <img> 这个 Tag 可以在HTML里面插入图片。最基本的语法如下： </p><p><img src=\</p><p>url表示图片的路径和文件名。比如 url 可以是 images/logo/blabla_logo01.gif，也可以是个相对路径 \。示例 </p><p> </p><p>图片alt属性 </p><p><img>中有一个alt属性，英文叫alternate text。例句如下： </p><p><img src = \</p><p>假使浏览器没有载入图片的功能，浏览器就会转而显示Alt属性的值。 </p><p>其实，现在大多数浏览器都支持图片载入。在此介绍Alt属性，是因为它的另外一个重要功能。目前搜索引擎抓取工具无法识别图像中所含的文字，所以用ALT属性写上图片的说明，便于搜索引擎抓取你网页的内容。示例 </p><p> </p><p>图片align属性 </p><p>用align属性，可以改变图片的垂直(居上、居中、居下)对齐方式和水平对齐方式(居左、居中、居右)。示例 </p><p> </p><p>图片的大小 </p><p>在缺省状况下，图片显示原有的大小。你可以用height和width属性改变图片的大小。不过图片的大小一旦被改变，图片会相应放大或缩小，显示出来的结果可能会很难看。示例 </p><p></p> <br /> <p><script type="text/javascript">s("content-m");</script></p> </div> <div class="m-pages"><li><a>共8页: </a></li><li><a href='639760_5.html'>上一页</a></li><li><a href='639760.html'>1</a></li><li><a href='639760_2.html'>2</a></li><li><a href='639760_3.html'>3</a></li><li><a href='639760_4.html'>4</a></li><li><a href='639760_5.html'>5</a></li><li class="thisclass"><a href='#'>6</a></li><li><a href='639760_7.html'>7</a></li><li><a href='639760_8.html'>8</a></li><li><a href='639760_7.html'>下一页</a></li></div> <div class="down-word"> <div class="word-ico"></div> <div class="word-tit"> <span class="docx">HTML教程--网页教程与代码 - 图文(6).doc</span> <span>将本文的Word文档下载到电脑</span> <span>下载失败或者文档不完整，请联系客服人员解决！ </span> </div> <div class="word-pic"><a href="javascript:;">下载这篇word文档</a></div> </div> </article> <div class="art-prenext"> <p>下一篇：<a href="/wenku/zonghe/639759.html">山东省第二十四届运动会竞赛规程总则（草案）分解</a></p> </div> <script type="text/javascript">s("like-m");</script> <div class="main-tab"><a class="on" href="javascript:;">相关阅读</a></div> <div class="tab-box"> <ul class="main-new on clearfix"> <li><a href="/wenku/zonghe/1263351.html" title="石油大学《化工原理二》2021期末考试答案">石油大学《化工原理二》2021期末考试答案</a></li> <li><a href="/wenku/zonghe/1157609.html" title="建筑节能检测习题集（84页）">建筑节能检测习题集（84页）</a></li> <li><a href="/wenku/zonghe/215568.html" title="高考物理(考点解读命题热点突破)专题06 机械">高考物理(考点解读命题热点突破)专题06 机械</a></li> <li><a href="/wenku/zonghe/215769.html" title="1 2014.10.23第一次财务会计理论与实务课堂笔">1 2014.10.23第一次财务会计理论与实务课堂笔</a></li> <li><a href="/wenku/zonghe/215778.html" title="通信资源管理系统介绍(GIS)">通信资源管理系统介绍(GIS)</a></li> <li><a href="/wenku/zonghe/215564.html" title="年产60万吨PTA项目环境影响报告书">年产60万吨PTA项目环境影响报告书</a></li> <li><a href="/wenku/zonghe/215563.html" title="2016小学生读书笔记范文">2016小学生读书笔记范文</a></li> <li><a href="/wenku/zonghe/215562.html" title="Dhlrwk谈中学生英语学习策略">Dhlrwk谈中学生英语学习策略</a></li> <li><a href="/wenku/zonghe/215560.html" title="数电课程设计报告洗衣机自动控制电路">数电课程设计报告洗衣机自动控制电路</a></li> <li><a href="/wenku/zonghe/215558.html" title="2018年最新湖南省长沙市长郡中学2018届上学">2018年最新湖南省长沙市长郡中学2018届上学</a></li> </ul> </div> <div class="main-tab"><a class="on" href="javascript:;">本类排行</a></div> <div class="tab-box"> <ul class="main-new on clearfix"> <li><a href="/wenku/zonghe/175782.html" title="云客服基础考试">云客服基础考试</a></li> <li><a href="/wenku/zonghe/158762.html" title="《红星照耀中国--》名著阅读练习题及答案">《红星照耀中国--》名著阅读练习题及答案</a></li> <li><a href="/wenku/zonghe/176003.html" title="红星照耀中国练习题及答案">红星照耀中国练习题及答案</a></li> <li><a href="/wenku/zonghe/171844.html" title="《红星照耀中国》练习题">《红星照耀中国》练习题</a></li> <li><a href="/wenku/zonghe/159778.html" title="人教部编版2018-2019学年八年级语文上册第一">人教部编版2018-2019学年八年级语文上册第一</a></li> <li><a href="/wenku/zonghe/183326.html" title="化工导论试题">化工导论试题</a></li> <li><a href="/wenku/zonghe/182252.html" title="八年级上册名著导读练习——《红星照耀中国》">八年级上册名著导读练习——《红星照耀中国》</a></li> <li><a href="/wenku/zonghe/162180.html" title="人教版语文八(上)名著导读《红星照耀中国》练">人教版语文八(上)名著导读《红星照耀中国》练</a></li> <li><a href="/wenku/zonghe/185266.html" title="2018年江苏省第八届就业创业知识竞赛题库(全7">2018年江苏省第八届就业创业知识竞赛题库(全7</a></li> <li><a href="/wenku/zonghe/168880.html" title="《红星照耀中国》导读及练习题附答案">《红星照耀中国》导读及练习题附答案</a></li> </ul> </div> </div> <footer class="footer"> <p class="bt-links"><a href="https://m.77cn.com.cn">手机版</a><span class="v-line">|</span><a href="https://www.77cn.com.cn">PC版</a><span class="v-line">|</span><a href="https://m.77cn.com.cn/fww">范文大全</a></p> <p>Copyright © 2019-2022 免费范文网版权所有<br/> 声明 :本网站尊重并保护知识产权，根据《信息网络传播权保护条例》，如果我们转载的作品侵犯了您的权利,请在一个月内通知我们，我们会及时删除。<br/>客服QQ：邮箱：tiandhx2@hotmail.com<br/> <a href="https://beian.miit.gov.cn/" target="_blank" rel="nofollow">苏ICP备16052595号-18</a> </p> <div style="display:none;"> <script> var _hmt = _hmt || []; (function() { var hm = document.createElement("script"); hm.src = "https://hm.baidu.com/hm.js?6e245478384fea490ec3a2317ee103ab"; var s = document.getElementsByTagName("script")[0]; s.parentNode.insertBefore(hm, s); })(); </script> <script> (function(){ var bp = document.createElement('script'); var curProtocol = window.location.protocol.split(':')[0]; if (curProtocol === 'https') { bp.src = 'https://zz.bdstatic.com/linksubmit/push.js'; } else { bp.src = 'http://push.zhanzhang.baidu.com/push.js'; } var s = document.getElementsByTagName("script")[0]; s.parentNode.insertBefore(bp, s); })(); </script> </div> </footer> <div class="theme-popover"> <div class="theme-poptit"> <a href="javascript:;" title="关闭" class="close">×</a> <b>注册会员免费下载</b>（下载后可以自由复制和排版） </div> <div class="theme-popbod dform">        <p class='wxpay'><a href='https://www.77cn.com.cn/user/index.php'>马上注册会员</a></p> <p class="downtxt">注：下载文档有可能“只有目录或者内容不全”等情况，请下载之前注意辨别，如果您已付费且无法下载或内容有问题，请联系我们协助你处理。<br>微信： QQ：</p> </div> </div> <div class="theme-popover-mask"></div> <script> //menu $(".header .menu").on("click", function(){ $("body").append("<div class=\"mask-bg menu-mask-bg\"></div>"); $(".menu-slide").show(); $("html,body").css({height:$(window).innerHeight(), overflow:"hidden"}); setTimeout(function(){ $(".menu-slide").css({transform:"translateX(-50px)"}); },50) }); $("body").on("click", ".menu-mask-bg", function(){ $(".menu-slide").css({transform:"translateX(-100%)"}); $(".menu-mask-bg").remove(); $("html,body").removeAttr("style"); setTimeout(function(){ $(".menu-slide").hide(); },300) }); //search $(".header .search").click(function(){ if($(".search-box").is(":hidden")){ $(this).children("i").removeClass("search-icon").addClass("close-icon"); $(".search-box").fadeIn("fast"); }else{ $(this).children("i").removeClass("close-icon").addClass("search-icon"); $(".search-box").fadeOut("fast"); } }); //nav if($(".nav").length > 0) { var nav = new Swiper(".nav",{ slidesPerView: "auto" }); } </script> <script> $(".pay1 img").click(function () { $(".wxpay").css("display", "block"); $(".alipay").css("display", "none"); $(".pay1 img").addClass("over"); $(".pay2 img").removeClass("over"); }); $(".pay2 img").click(function () { $(".wxpay").css("display", "none"); $(".alipay").css("display", "block"); $(".pay1 img").removeClass("over"); $(".pay2 img").addClass("over"); }); </script> <script type="text/javascript"> jQuery(document).ready(function($) { $('.word-pic a').click(function(){ $('.theme-popover-mask').fadeIn(100); $('.theme-popover').slideDown(200); $(".vip-up").hide(); $(".vip-pay").hide(); var downid = '639760' $('.wxpay a').click(function(){ var payurl = 'https://www.77cn.com.cn/hupipay/payment_pay_tz.php?payway=wx&aid='; payurl = payurl.replace('payment', 'youke'); var gotourl = payurl + downid location.href = gotourl; }); $('.alipay a').click(function(){ var payurl = 'https://www.77cn.com.cn/hupipay/payment_pay_tz.php?payway=ali&aid='; payurl = payurl.replace('payment', 'youke'); var gotourl = payurl + downid location.href = gotourl; }); }) $('.theme-poptit .close').click(function(){ $('.theme-popover-mask').fadeOut(100); $('.theme-popover').slideUp(200); }) }) </script> <script src="/js/gobacktop.js" type="text/javascript"></script> </body> </html>