weixin_30730053

网络安全攻击与防护--HTML学习

第一节、 HTML基本语法（文末有对该文视频讲解）

HTML的官方介绍什么的我就不说了，打字也挺累的，只简单介绍一下吧，其他的懂不懂都没关系。
　　HTML全称为Hypertext Markup Language,中文解释为超文本标记语言。
　　在HTML语言中，所有的标记都必须用尖括号(即大于号“<”和小于号“>”)括起来，一般情况下，每个标记单独占一行，

例1：(1.html)

 1 <html>
 2 <head>
 3 <title>百度红客吧title>
 4 head>
 5 <body>
 6 这是一个简单的<br>
 7 用HTML语言写的网页。
 8 
 9 body>
10 html>

　　我们来看上面的代码，可以发现，所有的标记都是被包含在尖括号之间的，大部分的标记是成对出现的，

　　比如和，和，我想朋友们应该可以看出来，这些标记有的只是单纯的英文字母，有的在这些相应的英文字母前加了一个斜杠“/”，我们称这些没有带有斜杠的标记为开始标记，带斜杠的标记为结束标记。

　　开始标记和结束标记的唯一差别就是带不带斜杠。

　　我们继续看上面的代码，发现其中的
标记只有一个，那么这个
标记，就是一个不是成对出现的标记，在后面的课程中，我们会介绍这个标记的用途的，如果你把上面的代码复制到了一个TXT文本里并把后缀名改为了.html，那么我想，你可能会明白这个
标记是什么意思了。
另外，需要说明的一点是，在HTML中，标记字母是不区分大小写的，即和是没有分别的，浏览器都认识。
还有一点，就是几乎所有的标记都有其对应的属性，如果将每个标记都比喻成一个美女的话，那么这些属性就是美女身上的衣服，起的都是点缀作用，但在实际应用中必不可少，就像美女的衣服同样必不可少一样。
这些标记的属性，都是放在对应标记的尖括号内的，比如:

这行代码为我们的网页指定了一个背景颜色，至于这个颜色到底是什么颜色，请看红客吧的上传页面，那里我写的就是这个颜色。
记好，标记的属性一定要放在尖括号中才有用，就像美女的衣服一定要穿到身上才有用一样。
其实，我强烈反对浮躁的人去跟代码打交道，因为他们在写代码的时候通常会很急躁，急躁的脾性在编程界是走不通的。
但是，作为红客吧的吧主，肩负着振兴红客吧的使命，我会尽量把我的文章写的更简单一点，更容易理解一点，对于正在看这篇文章的朋友，嫖客谢谢你的支持。

第二节、HTML的基本结构

　　我们再来看一下在第一节里写的那几行代码（1-1.html），不难发现，我在代码的开头，用了一个标记，在代码的结尾，用了一个标记，我把这对标记成为超文本文档标记，写这对标记的意思就是告诉浏览器，“你现在解析的是一个网页”。
这个标记，不是必须的，也就是说，可以省略掉，你在写网页的时候可以不写这对代码，一般情况下，浏览器照样可以正常解析，但是，为了保持你的代码的完整性，也为了让我们养成良好的编程习惯，最好是不要省略掉这对标记的。

　　其中，标记是一个网页代码的开始标记，即一般地，每个HTML网页都是以开始的，在网页的最后，以结束。
我们在学习HTML时，我提醒一下朋友们，当你写完一个网页的全部代码后，执行时却发现代码出错，但是又一直找不到错误，那么，你可以查看一下你是否把人家成对的标记给搞离婚了…

继续看代码，第二行和第四行代码，分别是标记的开始标记和结束标记，这对标记被我们成为首部标记，在我们的这些课程中，对首部标记的使用不是很充分，在我们学了VBScript或Javascript以后,或者做SEO优化时可能会用到的多一些。
下面看第三行代码，我把标记的开始代码和结束代码放到了一行，主要是这行代码很短，可以放到一行里来，而对浏览器的解析没有影响。 　　这个<title>标记，被我们称为标题标记，即每个网页的标题，就是在IE的标题栏显示的文字。 　　下面看第五行和第九行，分别是<body>标记的开始标记和结束标记，我们称这对标记为正文标记，即在这对标记之间的内容，将显示到网页正文中。 　　继续往下看，看到了第六行，这里前面是在网页中显示的文字，后边跟了一个 标记，而下一行，仍旧是文字，这里 的意思就是强制断行的意思，就是不论你是不是一句话，只要这个标记出现，必定断行。 　　看第八行，是一个标记，在HTML中，这个标记代表的是注释的意思，就是这个标记里边的东西是为了让别人更容易理解你的代码而写的，这些内容不会被浏览器显示到页面中。 　　OK，在电脑前坐了近2个小时，终于写了2节，呵呵，不着急，慢慢来。把第一节的代码分析完了，下面我们来看一下上边的代码的执行效果，为了方便起见，我把代码在我的虚拟机里执行的，看图: 　　OK，本节课结束，从下节课开始，我开始给朋友们介绍常用的各种标记。 第三节、设置文本格式 　　从这节课开始，我会给朋友们介绍一些常用的标记，并对它们的用法做一些举例，所以牵扯到了不少代码，请朋友们切莫浮躁，切莫心急，学编程，急不得。 　　OK，开始。 　　我们知道，在很多时候，我们从网页上获取信息都是从文字里获得的，那么我们现在就来学习一下如何来控制我们的网页上的文字，让它更好的为我们服务。 　　本节课比起前2节课可能会有些长，希望朋友们不要心急，慢慢来。 在HTML中，我们可以对网页中的文本设置以下格式： <div class="cnblogs_code"> <pre>1. 分段与换行 2. 设置段落对齐方式 3. 设置字体 4. 设置字号 5. 设置文本颜色 6. 设置字符样式</pre> </div> 下面我一条一条的来说，不着急，呵呵，反正我今天把这一节课写完就算完成任务了，呵呵，你看的时候看完这一节就先停下来吧，别着急着看下一节课，先把这节课消化消化。 1. 分段和换行 分段标记为和，换行标记为 看好了，分段标记是一对，换行标记是单身！ 位于分段标记和之间的内容，被浏览器认为是一个段落，从而加以区别显示，而 标记则强行规定了当前行的中断，我们知道，在WORD里打字的时候，如果这一行写不下了，它会自动换行，其实在网页里也是这个道理，浏览器会自动换行，只是有些时候我们为了段落或主题的的清晰要求，需要把一段文本分成2行，而如果让浏览器自己做这件事的话，它不明白你的意思，所以并没有给你分行，这样就不对了，是吧？显然，没有达到我们想要的效果，那么我们就可以在你需要换行的地方放一个 标记，那么 标记前的内容和 标记后的内容就会被浏览器解析为不同的2行。 哎呀，说理论总是很抽象的，下面我们来看代码，对着代码说容易理解一些。 例2：(2.html) <div class="cnblogs_code"> <pre> 1 <html> 2 <head> 3 <title> ----使用分段标记和换行标记</title> 4 </head> 5 <body> 6 <p>百度红客吧</p> 7 <p>欢迎你！</p> 8 我是不是嫖客，<br>红客吧期待你的加入！ 9 </body> 10 </html></pre> </div> OK，我们来看一下代码的执行效果： 朋友们可以把代码复制下来，自己执行一遍看看，不难发现分段标记和换行标记的区别： 　　分段标记分开的段落之间空隔很大，而用换行标记分开的两句话之间的空隙不大。 　　另外，我要告诉朋友们的是，我们在写代码时一行一行的写只是为了以后修改方便，也为了使别人能看懂我们的代码，但是我们也可以不一行一行分开写的，可以全部打乱，但只要各标记不变，那么执行效果就不会变，比如，下面两种代码的执行效果是一样的： 　　可以看到，下面的这张图里的代码显得很乱，但是，它是不影响执行效果的，但是我们在写代码的时候尽量养成整齐的好习惯吧。 OK，第三节课结束，嫖客谢谢你的支持！ 第四节、设置文本格式 1．设置段落对齐方式 　　上面我们已经学习了段落标记和，那么这里说的就是给这个美女披件衣服了，对，我们使用的就是和的众多属性中的一个属性：ALIGN属性。 　　我们知道，在WORD中，文字排版有左对齐、右对齐、居中、两边对齐4种对齐方式，那么在网页中也是这样的，他们对应的英文依次为：Left、Right、Center、Justify 　　这几个英文即为标记对的ALIGN属性的取值。 　　另外，需要说明的一点是，这个ALIGN属性是很多标记都有的一个属性，比如水平线标记<hr>、图像标记<img>都有这个属性，用处很大，对网页的排版起到了很大的作用，它的用法大致是一样的. 　　但是需要强调的是，我们知道，在WORD里，默认的对齐方式是两边对齐的，那么在网页里，对于不同的标记，ALIGN属性的默认值是不同的，比如： 　　对于分段标记对和来说，ALIGN属性的默认值为Left，对于水平线标记<hr>来说，ALIGN属性的默认值为Center，但是，这一点也不用太担心，因为我们只要养成使用一个标记后立即给它加上相应的属性的好习惯就可以了，也就是等于强制声明吧，这样，不论它原本的默认属性是怎样的，浏览器都会按照我们的设定来显示。 好，下面我们来看一段代码： 例3:（3.html） <div class="cnblogs_code"> <pre> 1 <html> 2 <head> 3 <title> ----设置段落对齐方式</title> 4 </head> 5 <body> 6  7 <p align="left">这一行为左对齐，align属性的值为left。</p> 8 <p align="center">这一行为居中对齐，align属性的值为center。</p> 9 <p align="right">这一行为右对齐，align属性的值为right。</p> 10 <p align="justify">这一行为两边对齐，align属性的值为justify。</p> 11 </body> 12 </html></pre> </div> 　　我们来看一下执行效果： 　　OK，设置段落对齐方式就先说到这里，下节课再说一点就没有了。 第五节、设置文本格式 　　这节课继续说段落对齐方式，这节课的主要任务是让朋友们认识两个在设置段落对齐方式时很实用的标记----节标记对<div></div>和居中对齐标记对<center></center>。 这节课很简单，我们来看一段代码就OK了。 例4：(4-1.html) <div class="cnblogs_code"> <pre> 1 <html> 2 <head> 3 <title> ----认识div标记和center标记</title> 4 </head> 5 <body> 6 <center> 7 春夜喜雨 8 </center> 9  10 <div align="center"> 11 <p>好雨知时节，当春乃发生。</p> 12 <p>随风潜入夜，润物细无声。</p> 13 </div> 14  15 </body> 16 </html></pre> </div> 我们来看一下执行效果： OK，本节课的任务完成了，再扩展一下吧，就是<div align="center">和直接用<center>的效果是一样的，比如我们也可以把上面的代码改一下，全部用<center>标记， 实验一下，改后的代码如下：(4-2.html) <div class="cnblogs_code"> <pre> 1 <html> 2 <head> 3 <title> ----认识div标记和center标记</title> 4 </head> 5 <body> 6 <center> 7 春夜喜雨 8 <p>好雨知时节，当春乃发生。</p> 9 <p>随风潜入夜，润物细无声。</p> 10 </center> 11 </body> 12 </html></pre> </div> 我们再来看一下执行效果： 　　看到了吧？ 　　效果是一样的。 　　另外，我再稍稍的提一下<div>标记，这个标记没有<body>大，但比大，也就是它必须被包含在<body>内，但它可以包含，就是处在这么一个不上不下的位置吧，反正我自己感觉是用着挺方便的。 　　也许不少朋友都说，现在都用DreamWeaver做网页了，谁还这么老土的用代码实现呢？ ，这个问题问得好，但是，如果你要做IT、安全的话，我还是非常建议你学学的，毕竟你如果不学HTML的话，那以后想学脚本如VBS、JS、ASP、PHP等语言基本不太可能。 　　但是，我也不建议你花太多的时间和精力在HTML上，因为它只是基础，你只需要达到基本掌握的水平就可以了，时间上，1个月，足够让你把HTML学的差不多了。 　　另外，再说一句很多前辈都说过的话，学编程，就要坚持天天跟代码打交道，每天你都写点东西出来，它是一个循环渐进的过程，没有哪个人能一下子就成了高手。 OK，第五节课完美结束，嫖客谢谢你的支持！ 第六节、设置文本格式 　　我们这节课的任务也不多，再来认识两个标记----标题标记<hn>和水平线标记<hr> 　　首先说下标题标记，<hn>,这个尖括号里的n的值可以是1-6之间的任何数字，包括1和6，分别定义了网页上的特定格式和大小的文本,<h1>定义的文本最大，<h6>定义的文本最小,我们称<h1>定义的文本为一级标题， 　　以此类推。 　　另外的水平线标记就没有什么好说的了，就是在网页中插入一条水平线。 OK，我们还是来看段代码吧，看完你就明白了。 例5：(5.html) <div class="cnblogs_code"> <pre> 1 <html> 2 <head> 3 <title> ----认识hn标记</title> 4 </head> 5 <body> 6 <div align="center"> 7 <p><h1>这是一级标题</h1></p> 8 <p><h2>这是二级标题</h2></p> 9 <p><h3>这是三级标题</h3></p> 10 <p><h4>这是四级标题</h4></p> 11 <p><h5>这是五级标题</h5></p> 12 <p><h6>这是六级标题</h6></p> 13 <p>这是普通文字</p> 14 </div> 15 </body> 16 </html></pre> </div> 我们来看一下执行效果： OK，标题标记就说到这里，下面再说一下水平线标记<hr>。 先介绍一下<hr>标记的相关属性： <div class="cnblogs_Highlighter"> <pre><code class="language-python">1. align属性 2. color属性 3. noshade属性 4. size属性 5. width属性 </code></pre> </div> 　　 　　关于align属性，我就不多说了，不懂的朋友请看第四节课。 　　下面是color属性，这个应该也很好理解吧？颜色嘛，这个属性指定我们的水平线的颜色。 　　再下面是size属性，这个属性是指定水平线的宽度，以像素为单位。 　　最后是width属性，这个属性指定水平线的长度，单位可以是像素或百分比。 这里的百分比是说这条水平线占总页面的多少来算的，是一个相对值，不是绝对值。 　　OK，介绍完了，我们再来看一段代码吧： 例6：(6.html) <div class="cnblogs_code"> <pre>1 <html> 2 <head> 3 <title> ----认识hr标记</title> 4 </head> 5 <body></pre> </div> 以下是默认的水平线：  <hr> <div class="cnblogs_code"> <pre> 1 以下是宽度为6，长度为300的水平线： 2 <hr size="6" width="300"> 3 以下是宽度为1，长度为80%的实线水平线： 4 <hr size="1" width="80%" noshade> 5 以下是长度为90%的浅蓝色水平线： 6 <hr width="90%" color="teal"> 7 以下是长度为90%的对齐方式为左对齐的浅蓝色水平线： 8 <hr align="left" width="90%" color="teal"> 9  10 </body> 11 </html></pre> </div> 下面我们来看一下代码执行效果： OK，本节课任务基本完成，下面呢，我再来说一点吧，老担心我讲的不够详细，担心新人看不懂，，就是我们在使用标记的各种属性时，无须计较这些属性的先后顺序，只要出现就可以了。 比如下面这两句代码的效果是一样的： <div class="cnblogs_code"> <pre>1 <hr align="left" width="90%" color="teal"> 2 3 <hr color="teal" width="90%" align="left"></pre> </div> OK，第六节课完美结束，，嫖客谢谢你的支持！不懂的随时到吧里问！随时待命向你解释！ 第七节、设置字体、字号和颜色 今天的任务不多，只说一个标记，即字体标记---- 上节课我们说了标题标记<hn>，不过相对来说，还是标记对用的多一些，标记有几个属性： <div class="cnblogs_code"> <pre>1. face属性 2. size属性 3. color属性</pre> </div> 　　其中face属性用来指定标记对内的文字的字体，size属性用来指定标记对内的文字的大小，color属性用来指定文字颜色。 　　需要注意的是，我们在使用face属性时，可以为这个属性赋一个或多个值，即可以为网页指定多种字体，这时，浏览器会按你赋值的顺序来读取，并尽量用你为标记指定的字体来显示，如果赋的第一个值，即第一种字体本地没有安装，那么浏览器再看指定的第二种字体是否安装，如果有，则以这种字体显示，如果没有，就看第三个，以此类推，如果这里指定的字体全部没有，则按照浏览器的默认字体来显示。 　　在使用标记的size属性时，其值的大小为1-7，包括1和7，默认值为3，值越大，显示的文字就越大，注意啊，这里跟<hn>标记的大小排序不同，对<hn>标记来说，值为1时最大，而对于标记的size属性来说，值越大字体越大。 另外，对于标记的size属性，不仅可以使用绝对值，即直接给它指定一个具体的数字，还可以使用相对值，使用相对值不使用纯数字，在数字前面加的还有加号“+”和减号“-”，表示这一行的size值为上一行size值的增加或者减少。比如： <div class="cnblogs_code"> <pre><font size="4">百度红客吧</font> <font size="+2">欢迎你！</font></pre> </div> 　　这里的第一句代码使用的绝对值，第二句代码就是用的相对值。 　　这上面的东西虽然说的不少，但是都是很简单的，现在看不懂也没关系，待会看看代码你就明白了。 　　还有一个color属性没说，这个属性指定了标记对内的文字的颜色，颜色值可以用颜色名称表示，也可以用十六进制RGB格式表示。OK，下面，也是每节课的最后一个环节，看代码。 例7：(7.html) <div class="cnblogs_code"> <pre><html> <head> <title> ----认识font标记</title> </head> <body> <p><font>默认文字：百度红客吧</font></p> <p><font face="黑体">face属性为“黑体”的文字：百度红客吧 <p><font size="6">size属性为6的文字：百度红客吧</font></p> <p><font color="teal">color为浅蓝色的文字：百度红客吧</font></p> <p><font face="黑体,楷体_gb2312,仿宋_gb2312" size="4" color="teal">face属性为黑体,楷体_gb2312,仿宋_gb2312 ，size属性为4，color属性为浅蓝色的文字：百度红客吧 </body> </html></pre> </div> 我们来看一下代码的执行效果： 　　可以明显的看出来差别的。 　　OK，本节课结束，不懂的先自己思考思考，实在不懂就到吧里问吧。 　　这样有助于你的学习。 　　好了，嫖客谢谢你的关注，谢谢！ 第八节、设置字符样式与插入特殊字符 　　这节课更简单，只介绍几个超简单的标记和一点网页制作中的技巧。 　　今天要介绍的标记全部为设置字符格式的标记，看表：（杯具的发现，不支持表格，没办法，凑合着看吧） 标记描述标记描述 <div class="cnblogs_code"> <pre><b>…</b> 粗体 <strike>…</strike> 删除线 <big>…</big> 大字体 <sup>…</sup> 上标 <i>…</i> 斜体 <sub>…</sub> 下标 <s>…</s> 删除线 <tt>…</tt> 固定宽度字体 <small>…</small> 小字体 <u>…</u> 下划线</pre> </div> 别看这张表里的标记挺多的，但是，都挺容易的，如果你玩过WORD的话，这些标记都是很好理解的。 不多说了，看代码: 例8：(8.html) <div class="cnblogs_code"> <pre> 1 <html> 2 <head> 3 <title> ----设置字符格式</title> 4 </head> 5 <body> 6 <p><font>默认文字：百度红客吧</font></p> 7 <p><b>粗体字：百度红客吧</b></p> 8 <p><big>大字体：百度红客吧</big></p> 9 <p><i>斜体字：百度红客吧</i></p> 10 <p><s>删除线：百度红客吧</s></p> 11 <p><small>小字体：百度红客吧</small></p> 12 <p><strike>删除线：百度红客吧</strike></p> 13 <p>上标示例：a<sup>2</sup>+b<sup>2</sup>=c<sup>2</sup></p> 14 <p>下标示例：H<sub>2</sub>so<sub>4</sub></p> 15 <p><tt>固定宽度字体：百度红客吧</tt></p> 16 <p><u>下划线：百度红客吧</u></p> 17 </body> 18 </html></pre> </div> 我们来看一下代码的执行效果： 怎么样？ 　　不难吧？，OK，设置字符格式就说到这里，下面说一点网页制作中的技巧。 设计网页的时候（不论是用DW做还是手工写），都难免会需要插入一些空格，这在WORD里很简单，没什么难的，但在HTML里不一样，即使我们在代码里按了很多个空格，但浏览器解析的时候仍然显示的只有一个空格，这是因为浏览器自动把那些多余的空格过滤掉了，这时我们就用到了一些特殊的方法： 　　使用字符实体名称或数字表示方式。 　　比如我们想在网页中插入1个空格，我们可以输入来实现，插入2个空格就可以输入来实现，这个就是空格的实体名称。 　　还有一个是数字表示方式，即空格我们也可以表示为，这个表示方式也可以达到连续空格的效果。 关于很多字符的实体名称和它们的数字表示方式，我这里提供一个常用符号的对应列表： <div class="cnblogs_code"> <pre>1 字符说明实体名数字表示 2 无断行空格 &nbsp; &#160; 3 ? 注册符号 &reg; &#174; 4 ? 版权符号 &copy; &#169; 5 & And符号 &amp; &#38; 6 ￥元符号 &yen; &#165;</pre> </div> 　　其他的资料我这暂时还没有，如果朋友们需要的话可以去网上搜索一下，应该有的。 　　OK，今天的课程完美结束，嫖客再次感谢你的关注。 第九节、使用列表格式 　　今天我们一起来创建几个列表，就是类似于WORD之类的这样的列表在网页上的实现： 上面的这个就是我们说的列表，我们可以看到，在每个列表项的前边都有一个数字，代表这些列表项的顺序，像这样的有数字或字母为列表项排序的列表我们称之为有序列表，反之，像下图这种没有明显的顺序标记的我们称之为无序列表： 　　那么，我们在这节课里就说一下这两种列表在网页中的实现方法。 　　首先，介绍一下创建有序列表和无序列表的标记:------<ol>…</ol>和<ul>…</ul> 　　先说创建有序列表，说完有序列表无序列表说不说都可以了。 　　我们使用有序列表标记<ol>…</ol>和列表项标记<li>来创建有序列表， 比如： <div class="cnblogs_code"> <pre>1 <ol> 2 <li>列表项1 3 <li>列表项2 4 <li>列表项3 5 <li>列表项4 6 <li>列表项5 7 <li>列表项n 8 </ol></pre> </div> 这样就创建了一个在列表项前显示默认的排序符号的列表，而HTML中默认是以数字排列的。 稍后我们依然用实例来说明情况。 <div class="cnblogs_code"> <pre>1 <ol>标记有两个常用属性：start和type 2 Start属性用于定义数字序列的起始值，type用于定义设置序列符号样式，其取值范围如下： 3 ● 1：表示以阿拉伯数字1、2、3…为列表符号 4 ● A:表示以大写字母A、B、C…为列表符号 5 ● a:表示以小写字母a、b、c…为列表符号 6 ● I：表示以大写罗马字母I、II、III、IV…作为列表符号 7 ● I：表示以小写字母i、ii、iii、iv…作为列表符号</pre> </div> 　　在<ol>标记对内的<li>标记具有两个常用属性：type和value 这里的Type属性和上面的type属性是一个概念，只不过针对的标记不同罢了。 而这里的value属性，指定一个新的数字序列起始值，这样我们可以把整个列表分开，从而获得一个不连续的列表。 下面开始看代码： 例9：(9-1.html) <div class="cnblogs_code"> <pre> 1 <html> 2 <head> 3 <title> ----创建列表</title> 4 </head> 5 <body> 6 <ol> 7 <li>列表项一：百度红客吧 8 <li>列表项二：百度红客吧 9 <li>列表项三：百度红客吧 10 </ol> 11 </body> 12 </html></pre> </div> 我们来看看代码的执行效果： 上边这个效果就是使用的默认的顺序符号创建的列表。 我们把上面那段代码修改一下，换一种符号看看： 例10：(9-2.html) <div class="cnblogs_code"> <pre> 1 <html> 2 <head> 3 <title> ----创建列表</title> 4 </head> 5 <body> 6 <ol type="A"> 7 <li>列表项一：百度红客吧 8 <li>列表项二：百度红客吧 9 <li>列表项三：百度红客吧 10 </ol> 11 </body> 12 </html></pre> </div> 这里我用<ol>标记的type属性指定了顺序符号为大写英文字母，我们来看看效果： 下面我们再来改一下，我们试试<ol>属性的start属性： 例11：（9-3.html） <div class="cnblogs_code"> <pre> 1 <html> 2 <head> 3 <title> ----创建列表</title> 4 </head> 5 <body> 6 <ol start="6"> 7 <li>列表项一：百度红客吧 8 <li>列表项二：百度红客吧 9 <li>列表项三：百度红客吧 10 </ol> 11 </body> 12 </html></pre> </div> 这里可以看到，我在指定<ol>的属性的时候，没有为它指定type属性，因为它默认的type属性是数字，所以我这里不指定也是可以的。 注意，只有在列表符号是数字的情况下start属性才有效。 比如：这行代码中的start属性是无效的： <ol type="a" start="6"> OK,说完这个，我们来看代码的执行效果： 下面我们再来说一下<li>标记的两个属性，直接看代码吧： 例12：（9-4.html） <div class="cnblogs_code"> <pre> 1 <html> 2 <head> 3 <title> ----创建列表</title> 4 </head> 5 <body> 6 <ol> 7 <li>列表项一：百度红客吧 8 <li>列表项二：百度红客吧 9 <li>列表项三：百度红客吧 10 <li value="5">列表项五：百度红客吧 11 <li>列表项六：百度红客吧 12 <li>列表项七：百度红客吧 13 <li value="11">列表项十一：百度红客吧 14 <li>列表项十二：百度红客吧 15 <li>列表项十三：百度红客吧 16 </ol> 17 </body> 18 </html></pre> </div> 　　我在列表的第四行使从第四行的顺序符号从“5”开始，这样下面的列表和上面的列表就断开了，从而获得了不连续的列表。 看看执行效果： 　　好了，创建有序列表我们就说到这里吧，这几天一直在打字，电脑桌子不舒服，太高，打得胳膊痛… 　　下面再说一下创建无序列表，这个跟创建有序列表的区别不大，只是无序列表标记为<ul>…</ul> <div class="cnblogs_code"> <pre>1 <ul>标记也有type属性，它的type属性用于指定列表符号，不过这里的符号跟有序列表的符号不同，type属性可以取下列值： 2 disc :使用实心圆作为列表符号 3 circle ：使用空心圆作为列表符号 4 square ：使用方块作为列表符号 5 需要注意的是，在IE中，type属性的值是区分大小写的。</pre> </div> 下面还是看代码： 例13：（9-5.html） <div class="cnblogs_code"> <pre> 1 <html> 2 <head> 3 <title> ----创建列表</title> 4 </head> 5 <body> 6 下面是无属性无序列表： 7 <ul> 8 <li>列表项：百度红客吧 9 <li>列表项：百度红客吧 10 <li>列表项：百度红客吧 11 </ul> 12 下面是type值为circle的无序列表： 13 <ul type="circle"> 14 <li>列表项：百度红客吧 15 <li>列表项：百度红客吧 16 <li>列表项：百度红客吧 17 </ul> 18 下面是type值为square的无序列表： 19 <ul type="square"> 20 <li>列表项：百度红客吧 21 <li>列表项：百度红客吧 22 <li>列表项：百度红客吧 23 </ul> 24 </body> 25 </html></pre> </div> 看看执行效果： 第十节、使用图像 　　在HEML中，我们用IMG标记在网页内插入图像，并通过该标记的属性对图片内容进行控制，最常用的两个属性为src属性和alt属性，分别用于设置图像的位置和替换文本，这个图像的位置实际上就是图像的地址，比如：www.haomoons.com/haomoons.jpg，这就是一个图片的地址，这个地址可以是绝对地址，也可以是相对地址。 　　而alt属性，作用很大，多使用它可以增加搜索引擎的收录，因为搜索引擎是不能抓取图像的内容的，而这个alt属性指定的替换文字就是对该图片的说明，而搜索引擎是认识这个替换文字的。 　　其实，这个alt属性最初设计出来，是针对那些不能显示图片的情况而设计的，就是一旦遇到种种原因图像显示不出来，那么这个替换文字可以起到一定的提示作用。 　　这个img标记还有两个属性，分别为width和height属性，这两个属性用于控制网页中图片显示的宽度和高度，单位为像素或百分值。 还有一些其他的不太常用的属性，我们也来学习一下吧： 1. hspace和vspace属性 这两个属性用于图文混排的情况下使用，hspace用于指定图像的左右边距，vspace用于指定图像的上下边距，这个边距即是文字和图像之间相隔的距离，单位为像素。 2. border属性 这个属性用于设置图像的边框，其取值只能为正整数，单位为像素。 3. align属性 这个属性用于在图文混排的情况下设置图像与文本的对齐方式，分两种情况： <div class="cnblogs_code"> <pre>1 ● 在垂直方向 2 这时，align的取值可以为 3 ▲ top:图像与文本顶部对齐 4 ▲ middle:图像与文本中央对齐 5 ▲ bottom:图像与文本底部对齐 6 ● 在水平方向 7 ▲ left：图像居左，文本居右 8 ▲ right:图像居右，文本居左</pre> </div> 另外，使用换行标记br的clear属性，可以将换行后的文本移到图像的下边。 下面我们来写一个实例，看代码： 例14：（10.html） <div class="cnblogs_code"> <pre> 1 <html> 2 <head> 3 <title> ----使用图像</title> 4 </head> 5 <body> 6 <center> 7 <p> 8 <img src="ad-1.jpg" alt="百度红客吧宣传图" align="left" border="1" height="200" width="200"> 9 <font face="宋体" color="teal">这里是百度贴吧红客吧，我们一直在努力做的更好，我们欢迎你的到来！<br>这里是百度贴吧红客吧，我们 10 一直在努力做的更好，我们欢迎你的到来！<br>这里是百度贴吧红客吧，我们一直在努力做的更好，我们欢迎你的到来！<br>这里是百度贴吧 11 红客吧，我们一直在努力做的更好，我们欢迎你的到来！<br>这里是百度贴吧红客吧，我们一直在努力做的更好，我们欢迎你的到来！<br>这里是百度贴吧红客吧，我们一直在努力做的更好，我们欢迎你的到来！<br>这里是百度贴吧红客吧，我们一直在努力做的更好，我们欢迎你的到来！<br>这里是百度贴吧红客吧，我们一直在努力做的更好，我们欢迎你的到来！<br>这里是百度贴吧红客吧，我们一直在努力做的更好，我们欢迎你的到来！<br>这里是百度贴吧红客吧，我们一直在努力做的更好，我们欢迎你的到来！<br>这里是百度贴吧红客吧，我们一直在努力做的更好，我们欢迎你的到来！<br>这里是百度贴吧红客吧，我们一直在努力做的更好，我们欢迎你的到来！ 12 </font> 13 </p> 14 <p> 15 <img src="ad-2.gif" alt="2010年，依然不是嫖客..." align="right" border="1"> 16 <font face="楷体_gb2312" color="red"> 17 我是不是嫖客，这里由我来给大家讲解一下HTML语言，嫖客多谢朋友们的支持！<br>我是不是嫖客，这里由我来给大家讲解一下HTML语言，嫖客多谢朋友们的支持！<br>我是不是嫖客，这里由我来给大家讲解一下HTML语言，嫖客多谢朋友们的支持！<br>我是不是嫖客，这里由我来给大家解一下HTML语言，嫖客多谢朋友们的支持！<br>我是不是嫖客，这里由我来给大家讲解一下HTML语言，嫖客多谢朋友们的支持！ 18 </font> 19 </p> 20 </center> 21 </body> 22 </html></pre> </div> 我们来看一下执行效果： 　　由于图像太大，所以有些模糊，不过还是能看出效果的。 　　OK,第十节课完美结束，朋友们看完课程以后多实践，自己琢磨着多写点代码出来，写写你就会了，不然记得不牢靠的。 朋友们，再见。 第十一节、使用多媒体文件 这几天有些不舒服，所以废话就不多说了，上节课我们使用img标记在网页中插入了图片，其实用这个标记还可以在网页中插入多媒体文件（就是视频）。 在用img属性播放视频文件时，需要用到以下属性： <div class="cnblogs_code"> <pre>1. controls:使用这个选项后，如果有多媒体文件，则在网页中显示一套视频控件，即视频控制按钮。 2. dynsrc：用它来指定视频文件的地址。 3. start：指定何时开始播放文件，它的取值可以是fileopen（页面打开即播放），还可以是mouseover（鼠标置于上方播放） 4. loop：指定视频文件的播放次数，若想让其循环播放，则应将该属性值指定为infinite。 5. loopdelay：指定两次播放之间的间隔时间，以毫秒为单位</pre> </div> 　　另外需要说明的一点是，在这里也可以使用src属性，就是说dynsrc和src可以同时使用，这样做的意思是若计算机没有多媒体功能，则显示该图像，若有多媒体功能，不显示图像。 　　从上边可以看出，虽然src和dynsrc可以同时使用，但它们之间存在一个优先级的问题，明显的，dynsrc的优先级高于src。 下面我们还是来看代码吧： 例15：（11.html） <div class="cnblogs_code"> <pre> 1 <html> 2 <head> 3 <title> ----使用多媒体文件</title> 4 </head> 5 <body> 6 <font face="楷体_gb2312" color="teal"> 7 <center> 8 使用多媒体文件示例 9 </center> 10 </font> 11 <hr size="2" width="80%" color="teal" noshade> 12  13 <p align="center"> 14 <img dynsrc="clock.avi" controls loop="infinite" loopdelay="1000" start="mouseover"> 15  16 </p> 17 </body> 18 </html></pre> </div> 　　我这里指定的是当鼠标放上去的时候播放，我们来看一下执行效果： 　　播放前： 　　我把鼠标放上去： 　　OK，鼠标放上去即开始播放。 　　今天就说到这了，朋友们明天见 第十二节、使用字幕和背景音乐 今天我们来说一下在HTML中插入滚动字幕和在网页中使用背景音乐。 我们使用marquee标记来显示滚动文本，该标记具有下列属性： <div class="cnblogs_code"> <pre>1. align属性：指定字幕与周围文本的对齐方式，其取值可以是top（上对齐）、middle（中间对齐）、buttom（底部对齐） 2. behavior属性：指定文本动画的类型，其取值可以是scroll、side、alternate 3. bgcolor属性：指定文本动画的背景颜色 4. direction属性：指定文本动画的移动方向，其取值可以是down、up、left、right，默认值为left，即由右向左移动。 5. height属性：指定文本动画的高度，单位为像素或百分比 6. hspace属性：指定字幕外部边缘与浏览器窗口之间的左右距离，以像素为单位，其值为整数。 7. vspace属性：指定字幕外边缘与浏览器上下边缘的距离，单位为像素 8. loop属性：指定字幕滚动的次数，这个属性的取值与上节课我们讲视频时那个loop属性相同。 9. scrollamount属性：指定字幕每次移动的距离，以像素为单位，其值为整数 10. scrolldealy属性：指定前后两次播放的间隔时间，值为整数，单位为像素</pre> </div> OK,这些就是字幕标记marquee的全部属性了，下面我们先别着急着看代码，我们再来说一下如何在网页中使用背景音乐，就是在网页打开的时候即播放音乐。 用的标记为bgsound标记，需要注意的是，该标记只能放在我们的代码的head部分，bgsound属性具有下列属性： <div class="cnblogs_code"> <pre>1. balance属性：指定如何将声音分成左声道和右声道，取值为-10000~+10000，默认值为0 2. loop属性：指定声音播放的次数，若值为0，则播放一次，若为-1，则循环播放，知道页面被卸载。 3. src属性：指定声音文件的位置 4. volume属性：指定声音高低，其取值为-10000~0，默认值为0</pre> </div> 好了，我们把marquee标记的标记和bgsound标记的标记全部说完了，下面我们来写一段代码，既播放字幕又配合着背景音乐。 例16：（12.html） <div class="cnblogs_code"> <pre> 1 <html> 2 <head> 3 <title> ----使用字幕和背景音乐</title> 4 <bgsound src="honker.mid" loop="-1"> 5 </head> 6 <body> 7 <div align="center"> 8 <P> 9 <marquee loop="infinite" behavior="scroll" bgcolor="black" direction="left" 10 scrollamount="2"> 11 <font face="黑体" color="red"> 12 <big> 13 这里是百度红客吧，欢迎你的到来！ 14 </big> 15 </font> 16 </marquee> 17 </p> 18 <p> 19 <marquee loop="infinite" behavior="slide" bgcolor="black" direction="right" 20 scrollamount="2"> 21 <font face="黑体" color="red"> 22 <big> 23 我们在努力做的更好！ 24 </big> 25 </font> 26 </marquee> 27 </p> 28 </div> 29 </body> 30 </html></pre> </div> 　　我们来看一下执行效果： 　　而在网页加载完的时候，我们指定的背景音乐已经开始播放了。 　　好了，前面基础的终于说的差不多了，今天就说到这里吧，明天开始说表格的应用，朋友们，明天见。 第十三节、创建基本表格 　　从今天开始，我们将一起接触到在HTML中很重要的一部分—表格的应用，因为几乎每个网页的布局都离不开表格的支持，所以，关于表格的内容异常重要，朋友们一定要多加练习才是。 　　一个表格由表头、行、单元格组成，这些元素分别用不同的标记来定义，表格通过table定义，表头（即表格的标题）由caption来定义，行由tr来定义，单元格由td定义。 今天我们就来创建一个基本的表格，看代码： 例17：（13-1.html） <div class="cnblogs_code"> <pre> 1 <html> 2 <head> 3 <title> ----创建一个基本表格</title> 4 </head> 5 <body> 6 <center> 7 <table> 8 <caption>表头：百度红客吧</caption> 9 <tr> 10 <td>第一列标题</td> 11 <td>第二列标题</td> 12 <td>第三列标题</td> 13 </tr> 14 <tr> 15 <td>百度红客吧</td> 16 <td>百度红客吧</td> 17 <td>百度红客吧</td> 18 </tr> 19 <tr> 20 <td>不是嫖客</td> 21 <td>不是嫖客</td> 22 <td>不是嫖客</td> 23 </tr> 24  25 </table> 26 </center> 27 </body> 28 </html></pre> </div> 我们来看一下执行效果： 　　可以看到，页面中并没有一般表格都有的边框，但可以看出来，页面显示的内容是按照表格的布局来显示的，下面我来给table标记加上一个属性，即border属性，这个属性指定表格的边框粗细。 　　即将上面的第7行代码修改为： 　　<table border="1"> 　　修改后我们再来看一下执行效果： 例18：（13-2.html） 　　OK,这里已经可以非常明显的看出，这是一个表格了，大家看代码的时候对着我讲的那些标记一个一个对照，慢慢的你就会了，不要着急。 　　好了，今天这节课就结束了，我是不是嫖客，朋友们明天再见。 第十四节、设置表格的属性 　　昨天我们初步接触了表格，今天我们就来学习一下表格标记table的各个属性，从而使我们获得对表格的更多控制，下面是table标记的属性： <div class="cnblogs_code"> <pre>1. align属性：指定表格的对齐方式，取值可以为left（左对齐）、center（中间对齐）、right（右对齐） 2. background属性：指定用作表格背景的图像位置。 3. bgcolor属性：指定表格的背景颜色 4. border属性：这个属性我们在昨天已经接触过了，我们用它来指定表格的边框粗细 5. width属性：指定表格的宽度，单位为像素或百分比 6. bordercolor属性：指定表格边框的颜色，如果没有指定边框的粗细，则不应该使用该属性 7. bordercolordark属性：指定3D边框的阴影大小，如果没有指定边框的粗细，则不应该使用该属性 8. bordercolorlight属性：指定3D边框的高亮显示颜色，如果没有指定边框的粗细，则不应该使用该属性 9. cellpadding属性：指定单元格内数据与单元格边框之间的距离，单位为像素 10. cellspacing属性：指定单元格之间的间距，单位为像素</pre> </div> 总共10个属性，其实很多都是不常用的，从第6个往后的属性都不怎么常用（至少对我来说，） 下面我们来写一段代码： 例19：（14.html） <div class="cnblogs_code"> <pre> 1 <html> 2 <head> 3 <title> ----设置表格的属性</title> 4 </head> 5 <body> 6 <table align="center" width="80%" border="1" bgcolor="white" 7 bodercolordark="gray" bordercolorlight="green"> 8  10 <tr> 11 <th>第一列标题</th> 12 <th>第二列标题</th> 13 <th>第三列标题</th> 14  15 </tr> 16 <tr> 17 <td>百度红客吧</td> 18 <td>不是嫖客</td> 19 <td>欢迎你的到来！</td> 20 </tr> 21 <tr> 22 <td>红客吧原创教程</td> 23 <td>你的关注</td> 24 <td>是我最大的动力</td> 25 </tr> 26 <tr> 27 <td>2010年，我相信</td> 28 <td>你我的红客吧</td> 29 <td>一定会发展</td> 30 </tr> 31 </table> 32 </body> 33 </html></pre> </div> 　　下面我们来看一下执行效果： 　　OK，朋友们一定要对照着课程把代码仔细的看看，然后一个字母一个字母的自己敲出来，不担心学不会。 　　今天这节课结束，咱们明天见。 第十五节、设置表格中行的属性 　　上一节我们说的是设置表格的属性，那么今天我们就来学习一下设置表格中行的属性，我们知道行的标记为tr，那么下面就是这个标记的属性： <div class="cnblogs_code"> <pre>1. align属性：指定行中单元格的水平对齐方式，取值与我们前面讲的相同。 2. valign属性：指定行中单元格的垂直对齐方式，取值为top（顶端对齐）、middle（中间对齐）、bottom（底部对齐）、baseline（基线对齐） 3. background属性：指定行的背景图像 4. bgcolor属性:指定行的背景颜色 5. bordercolordark属性：指定行的3D边框阴影颜色 6. bordercolorlight属性：指定行的3D边框的高亮颜色</pre> </div> 下面我们来创建一个表格，使不同行具有不同的背景颜色： 例20：（15.html） <div class="cnblogs_code"> <pre> 1 <html> 2 <head> 3 <title> ----设置表格中行的属性</title> 4 </head> 5 <body> 6 <table align="center" border="1" width="80%"> 7 <caption>设置行的属性示例</caption> 8  9 <tr align="left" bgcolor="red"> 10 <th>第一列标题</th> 11 <th>第二列标题</th> 12 <th>第三列标题</th> 13 </tr> 14 <tr align="center" bgcolor="yellow"> 15 <td>百度红客吧</td> 16 <td>百度红客吧</td> 17 <td>百度红客吧</td> 18 </tr> 19 <tr align="right" bgcolor="teal"> 20 <td>不是嫖客</td> 21 <td>不是嫖客</td> 22 <td>不是嫖客</td> 23 </tr> 24 </table> 25 </body> 26 </html></pre> </div> 我们来看一下代码的执行效果： 　　OK，达到了我们想要的效果，本节课结束。 　　嫖客谢谢你的支持！ 第十六节、设置单元格的属性 　　上节课我们说的是设置行的属性，那么这节课我们就来说一下在表格中最小的组成单位—-单元格的属性设置。 单元格td的属性有以下几种： <div class="cnblogs_code"> <pre>1. align属性：指定单元格内文本的对齐方式 2. background属性：指定单元格的背景图像 3. bordercolor属性：指定单元格的边框颜色，这个属性必须在table标记的border已设置并且其值非零时可用，这个想想就明白了，如果人家设置的表格都没有边框那这个属性当然没用了。 4. bordercolordark属性：指定单元格的3D边框阴影颜色 5. bordercolorlight属性：指定单元格的3D边框的高亮颜色 6. colspan属性：指定合并单元格时一个单元格跨越的表格的列数 7. rowspan属性：指定合并单元格时一个单元格跨越的行数 8. nowrap属性：若指定该属性，则避免浏览器将单元格中的文字换行 9. valign属性：指定单元格中文本的垂直方向对齐方式，其取值可以为top、middle、buttom、baseline，默认值为middle</pre> </div> 下面我们来为16个单元格设置16种不同的背景颜色： 例21：（16.html） <div class="cnblogs_code"> <pre> 1 <html> 2 <head> 3 <title> ----设置单元格的属性</title> 4 </head> 5 <body> 6 <table align="center" border="1" width="80%"> 7 <caption>设置单元格的属性示例</caption> 8 <tr> 9 <th bgcolor="aqua">第一列标题</th> 10 <th bgcolor="black"><font 11 color="white">第二列标题</font></th> 13 <th bgcolor="blue"><font color="white">第三列标题</font></th> 14 <th bgcolor="fuchsia">第四列标题</th> 15 </tr> 16 <tr> 17 <td bgcolor="gray">百度红客吧</td> 18 <td bgcolor="green">百度红客吧</td> 19 <td bgcolor="lime">百度红客吧</td> 20 <td bgcolor="maroon"><font color="white">百度红客吧</font></td> 21 </tr> 22 <tr> 23 <td bgcolor="navy"><font color="white">不是嫖客</font></td> 24 <td bgcolor="olive">不是嫖客</td> 25 <td bgcolor="purplr"><font color="white">不是嫖客</font></td> 26 <td bgcolor="red">不是嫖客</td> 27 </tr> 28 <tr> 29 <td bgcolor="silver">期待关注</td> 30 <td bgcolor="teal">期待关注</td> 31 <td bgcolor="white">期待关注</td> 32 <td bgcolor="yellow">期待关注</td> 33 </tr> 34 </table> 35 </body> 36 </html></pre> </div> 　　我们来看一下代码的执行效果： 　　OK，本节课就说这么多了，至此为止，关于表格的内容就介绍这么多了，下一节课开始我们开始讲框架。朋友们再见。 第十七课、设置框架集的属性 　　今天我们来介绍一下HTML中应用同样很广泛的一样知识：框架。 我来简单的介绍一下什么是框架： 　　使用框架可以将浏览器窗口分为多个窗格，在每个窗格中都可以显示一个网页，从而实现在一个网页中显示多个不同页面的效果。 我们需要理解的是，框架与框架之间是各自独立的，在每个框架中可以显示任意网页，这些框架就等于是一个单独的新的页面，只不过框架是把这些不同的页面给它们组合到一起放到一个页面里了，这样我们在表面上看来，效果跟一个网页一样，表面看不出分别。 　　框架网页通过一个或多个frameset和frame标记来定义，需要注意的是，在使用了框架的网页里，我们使用framrset标记取代原body的位置，就是在head标记结束后，直接跟上frameset标记，而不再使用body标记。 另外，还有一点需要我们了解，就是有的低版本浏览器不支持框架，这时，我们可以使用noframes标记来指定当浏览器不支持框架时要显示的内容。 　　还有就是，frameset标记是定义框架集的标记，frame标记定义框架，frame总是被包含在frameset标记中的，就像表格中的行和单元格总被包含在表格中一样。 其中，frameset标记具有下列属性： <div class="cnblogs_code"> <pre>1. cols属性：创建纵向分隔框架时使用该属性指定各个框架的列宽，其取值有三种形式：像素、百分比（%）、相对尺寸（*）。比如说，如果我们想将浏览器窗口分为三列，第一列占浏览器窗口宽度的30%，第二列宽度为200像素，第三列为浏览器的剩余宽度，则我们可以将frameset属性的cols属性的值设为“30%,200,*”，如果将cols属性的值设为“*,*,*”，则将浏览器窗口分为等宽的三个窗格，如果将其值设为“*,2*,3*”，则表示中间的窗格的宽度为左边窗格宽度的2倍，右边窗格的宽度为左边窗格宽度的3倍。 2. rows属性：创建横向分隔框架时使用该属性指定各个框架的行高，取值方式与cols相同，但，需要注意的是，cols属性和rows属性不可同时使用，若要创建同时包含横向分隔框架和纵向分隔框架，则应使用嵌套框架。 3. frameborder属性：指定框架周围是否显示三维边框，其取值为1（显示）、0（不显示），该属性的默认值为1 4. framespacing属性：指定框架之间的间隔，单位为像素，如果我们不指定该属性，则框架之间没有间隔。</pre> </div> 下面我们来写一段代码，看看代码很多问题稍微琢磨一下就明白了： 例22：（17.html） <div class="cnblogs_code"> <pre> 1 <html> 2 <head> 3 <title> ----设置框架集的属性</title> 4 </head> 5 <frameset rows="60,*,60">  6 <frame>  7 <frameset cols="100,*">  8 <frame>  9 <frame>  10 </frameset>  11 <frame>  12  13 <noframes> 14 <body> 15 <center> 16 <font size="6" color="teal"> 17 抱歉，您的浏览器不支持框架！ 18 </font> 19 </center> 20 </body> 21 </noframes> 22 </html></pre> </div> 　　这里我没有指定frameset标记的frameborder属性的值，即该属性为默认值1，即显示三维边框。 我们来看一下执行效果： 　　那么，我们接下来把frameborder属性的值设为0，即不让浏览器显示三维边框，我们将上边代码的第五行代码改为： <frameset rows="60,*,60" frameborder="0"> 　　改完后我们再来看一下执行效果： 　　可以看到，这是一个跟空白页面一模一样的页面，所以说效果是相同的，只是这个页面确实包含了4个框架。 OK，今天就说到这吧，明天详细讲框架属性的设置。 嫖客谢谢你的支持。 第18节、使用框架 　　上节课我们说了设置框架集的属性及创建嵌套框架的方法，今天我们来介绍一下设置框架的属性，再举个实例出来看看在框架中显示网页的效果。 通过上节课的学习，我们应该已经知道，表示框架的标记为frame，那么我们再来说一下这个标记的几个属性及这些属性的作用： <div class="cnblogs_code"> <pre>1. frameborder属性：指定是否显示三维边框，这个属性上节课讲过。 2. marginheight属性：指定框架的高度，单位为像素 3. marginwidth属性：指定框架的宽度，单位为像素 4. name属性：指定框架的名称 5. nosize属性：若指定了该属性，则不能调整框架的大小 6. scrolling属性：指定框架是否可以滚动，其取值可以为yes（允许滚动）、no（禁止滚动）、auto（在需要时滚动）。 7. src：指定要在框架里显示的页面的地址</pre> </div> 下面我们来创建一个框架页，并在每个框架里分别显示不同的网页，然后来看看效果： 例23：（18-main.html） <div class="cnblogs_code"> <pre> 1 <html> 2  3 <head> 4 <title> ----使用框架</title> 5 </head> 6 <frameset rows="100,*"> 7 <frame name="frame-top" src="23-top.html"> 8 <frameset cols="100,*"> 9 <frame name="frame-left" src="23-left.html"> 10 <frame name="frame-right" src="23-right.html"> 11 </frameset> 12 <noframe> 13 <body> 14 <font color="teal"> 15 抱歉，该网页使用了框架，但您的浏览器不支持框架！ 16 </font> 17 </body> 18 </noframe> 19 </frameset> 20 </html> 21 下面是18-top.html的代码： 22 <html> 23  24 <head> 25 <title>头部网页</title> 26 </head> 27 <body> 28 <center> 29 <h2>这个是头部网页。</h2> 30 </center> 31 </body> 32 </html></pre> </div> 下面是18-left.html的代码： <div class="cnblogs_code"> <pre> 1 <html> 2  3 <head> 4 <title>左侧网页</title> 5 </head> 6 <body> 7 <h2>这个是左侧网页。</h2> 8 </body> 9 </html> 10 下面是18-right.html的代码： 11 <html> 12  13 <head> 14 <title>右侧网页</title> 15 </head> 16 <body> 17 <h2>这个是右侧网页，我们在制作网页时常将这个框架作为正文页面。</h2> 18 </body> 19 </html></pre> </div> 好了，代码我们已经全部写完了，下面我们来看一下执行效果吧： 好了，效果出来了，这就是框架，这就是在一个浏览器窗口里显示多个不同页面的方法，我们再来改一下代码， 把18-main.html的第6行，改为: <frameset rows="100,*" frameborder="0"> 这样就取消了三维边框的显示，再来执行一下看看： 　　这样在表面看起来，就真的跟一个普通页面差不多了吧？ 　　OK，今天就说这么多吧，朋友们多看看代码，一定要把代码弄懂了才好。 　　今天这节课结束，咱们的关于框架的课程就没有了，下节课开始讲不同种类超链接的创建。 第十九节、了解超链接和路径的概念 　　朋友应该知道什么是超链接吧？就是当你把鼠标放上去的时候鼠标会变成手型，点击即可实现跳转，用书面解释，超链接就是由源端点到目标端点的一种跳转，源端点可以是一段文本、一副图像、等对象，目标端点可以是任意类型的网络资源，如一个网页、一副图像、一首歌曲、一段视频、一个程序等，按照目标端点的不同，也就是按照链接指向的文件的不同， 　　可以将超链接分成以下几种形式： 1. 文件链接：这种链接是我们最常用的链接，这个指向的文件如果是一个网页，那么即实现的是从一个网页向另一个网页跳转，如果指向的文件是一个rar压缩包或其他文件，则实现的是这些资源的下载。这里需要提一下的是，当浏览器遇到它不能解析的文件时，它会提示你是否下载该文件，比如当你的浏览器遇到一个链接指向一个.exe文件，它是肯定无法解析的，那么它就会弹出一个对话框，提示你让你下载，这就是我们平时使用的“目标另存为”，但是，如果浏览器遇到了音频文件或视频文件的话，它可能会自己调用系统自带的播放器去播放这个文件，这样就实现了在线听音乐。 2. 锚点链接：这种链接的目标端点是网页中的一个确定的位置，这个位置可以是位于当前页内的，也可以是位于其他页面内的，这种链接在遇到长文档时有用，能让人迅速获得自己所需要的信息，而不必花费很多时间将整篇文档全部读完。 3. E-mail链接：通过这种链接可以启动电子邮件客户端程序（如Outlook或Foxmail等），从而实现直接为该链接指定的人写信的效果。这里看不懂没关系，稍后我们写段代码你就明白了。 　　下面我们再来介绍一点知识，就是路径的问题，可能有些朋友说，不理解什么是相对路径，不理解所谓的绝对路径是什么，那么我们在这里就来介绍一下。 1. 绝对路径：也称为绝对URL，这种路径的特点是给出目标文件的完整URL地址，包含传输协议在内，如：http://www.baidu.com/hongkeba.html，这个例子中，前面的http://是传输协议，www.baidu.com/hongkeba.html是文件的路径。如果我们需要链接的文件位于外部服务器上的时候，是必须，是必须要使用绝对路径的。 2. 相对路径：也称为相对URL，是指以当前文档所在的位置为起点到目标文档所经过的路径，比如<frame src="xiangdui.html">,这句代码指定的xiangdui.html这个文件就是位于当前目录下的，也就是说，如果以我当前这个框架页来看，我指定的这个文件与我在同一个目录下，那么这就是以我这个框架页的角度来看的，再比如： <frame src="lujing/xiangdui.html"> 这句代码指定要显示的文件的位置是当前目录下的lujing子目录下的xiangdui.html文件。 再比如： <frame src="../lujing/xiangdui.html"> 这句代码指定的文件在当前文件所在目录的上一级目录下的lujing目录下。其中，两个点“..”表示上一级目录。 3. 根相对路径：这种路径是指从站点根目录到被链接文件的路径，使用这种路径是指定站点内文档链接的最好方式。 好了，这节课我们就先介绍这些吧，下节课我们开始介绍创建链接的方法。 嫖客多谢朋友们的支持。 第20节、创建文件链接 　　不知不觉，已经写到20节了，到这里，我们的HTML课程也就快结束了，后面还有一个表单没讲，讲完就没有了，呵呵，虽然我的技术不怎么样，但是能为新人朋友们做点事情就做点事情吧，还希望朋友们多多支持红客吧，多多支持嫖客，谢谢。 下面开始说正事，今天我们来说如何创建文件链接。 　　在HTML里，我们使用a标记来创建超链接，基本语法为： <div class="cnblogs_code"> <pre><a href="字符串" target="字符串" title="字符串">文本</a></pre> </div> 下面我们再来学习一下a标记的各个属性： <div class="cnblogs_code"> <pre>1. href属性：这个属性是必选项，用于指定目标端点的地址。 2. target属性：该属性是可选项，用于指定一个窗口或框架来显示我们链接指向的页面，我们在实例中使用框架时，一般地都会给框架指定一个名字，如：frame-top之类的名字，那么这里的target属性就是让链接指向的网页显示在指定的框架或页面时用的。如果没有指定该属性，则链接指向的文档将会取代当前页面从而占据浏览器窗口，另外，target属性的取值可以是框架或窗口的属性，也可以是下列4个保留字中的一个： ☆ _blank：表示将链接的目标文件加载到未命名的新浏览器窗口中 ☆ _parent：指定将链接的目标文件加载到包含链接的父框架或窗口中，如果包含链接的框架不是嵌套的，则加载到整个浏览器窗口中。 ☆ ?_self:指定链接指向的目标文件加载到同一框架或窗口中 ☆ _top：指定将目标文件加载到整个浏览器窗口中并删除所有框架 3. title属性：指定鼠标指向链接时所显示的提示文字</pre> </div> 下面我们来写一个实例： 例24：（20.html） <div class="cnblogs_code"> <pre> 1 <html> 2 <head> 3 <title> ----创建文件链接</title> 4 </head> 5 <body> 6  7 <p> 8 <font color="teal" size="5">创建文件链接示例</font><br> 9 <hr color="red"> 10 </p> 11  12 <p> 13 <a href="16.html" title="打开第16课">设置单元格的属性</a> 14 </p> 15  16 <p> 17 <a href="ad-2.gif" title="2010年，依然不是嫖客">不是嫖客的签名档</a> 18 </p> 19 <p> 20 <a href="http://freetank.xvip6.xdff.cn" title="百度红客吧上传页面"> 21 <img src="banner-1.jpg"></a> 22 </p> 23 </body> 24 </html></pre> </div> OK,我们来看一下执行效果： 成功了。 今天的课程就结束了，我们明天来介绍创建锚点链接的方法，朋友们明天见。 第21节、创建锚点链接 　　上节课我们说了创建文件链接的方法，那么今天我们就来说一下三种链接种类中的第二种：锚（mao）点链接 这种链接，可以实现网页内一个具体位置的跳转，就是我们提前在一个需要跳转的地方放上一个标记，然后在以后的文档中直接将链接的目标文件设置为这个标记即可。 　　而提前放的这个标记用到了a标记的name属性，即通过a标记的name属性为这个标记指定一个名称，以便以后引用，但需要注意的是，在<a>和</a>之间不要输入任何内容，例如，我们在网页test.html中创建一个名为top的锚标记： <div class="cnblogs_code"> <pre><p><a name="top"></a></p></pre> </div> 创建了锚点标记以后，我们再来引用一下： <div class="cnblogs_code"> <pre><p><a href="#top">返回顶部</a></p></pre> </div> OK,基本语法我们说完了，就这么简单，下面我们来写一个实例： 例25（20.html）： 这个网页的代码有点长… <div class="cnblogs_code"> <pre> 1 <html> 2 <head> 3 <title> ----创建锚点链接</title> 4 </head> 5 <body> 6 <div align="right"><a href="#top"></a><a href="#middle">翻到中部</a> <a href="#end">翻到底部</a></div><br> 7 华为是个创造神话的企业，从注册资金２万元的飞速膨胀、3Ｇ、高科技、高速成长、全民持股和民营企业……目前华为一但在国内是电信第一大供商货商，而且海外市场越来越火红，目前已正在蚕食网络商老大CISCO的本土--美国。 8 <p>第一次知道“华为”是1999年，我从学校出来一年，当时对华为没有太多的了解，只知道华为是目前国内IT业中工资最高和大多数IT人梦寐以求的企业。当然，对于我这个中专生，她是远远遥不可及的……</p> 9 10 <p>99年中，我进入了广州一家小公司，默默的干着，我想我没有太多的先天优势，我唯一的就是钻劲、上进心、能吃苦。</p> 11 12 <p>3年后，我很幸运进入广州最大的IT公司---广州新太科技，成为了一名技术工程师，外派到上海常驻，负责金融类的呼叫中心建设。到上海不到2个月，居然收到了华为公司人事部让我去深圳面试的邀请。当时这个消息对于我来说不能说不突然，简直是太突然了，当然，我当时谢绝了，因为进入新太不到3个月，再说对面试华为，毫无把握。后来才知道他们是在人才网站上面查到了我的简历。原来，华为的人事部门，经常在业务相类似的公司挖墙角。</p> 13 14 <p>我在新太一直默默地干着……慢慢，从技术工程师做成独挡一面的工程项目经理。连续三年公司优秀员工。</p> 15 16 <p>再3年半后，由于公司的一些问题，我不得不离开新太。说来惭愧，从学校毕业快7年，本人还是正宗一名“中专生”。在高校扩招，“本科生到处都是、硕士生满街走，只有博士还能抖一抖”的今天，走在路上，我什么都不怕丢，就是怕丢了这个中专毕业证。被人看到了，丢人！更何况我现在人在经济领跑全国的大上海！真可谓人才济济，我只不过是大海里的一滴水。</p> 17 18 <p>但是，我有斗志，我有自信！我相信自己的能力。我又一次投了华为公司“技术支持”岗位的的简历，虽然华为的招聘广告霍然写着“大学本科以上学历，英语4级”。当然，我现在已经对华为公司有了很深的理解。</p> 19 20 <p>2周后，果然，深圳人事部再次通知了我，让我参加上海华为3月26、27号的专场招聘会。当人事部的小姐打电话给我的时候，我说明了我的学历只有中专，但愿推荐让我去招聘会试一试，她说我们也非常重视能力。说实话，在这段时间里，我曾被中兴通讯(国内另一家著名通讯企业)因学历问题拒绝过。华为这位人事小姐的的电话，真的让我领略到华为的魄力。</p> 21 22 23 24 25 26 <p>经过几天的等待，27号的早上，我换上平时难得穿一次的西装，系上领带，向华为上海分公司进发。</p> 27 28 <p>华为上海公司坐落于上海浦东最高档同时也是“中华XXXX楼”陆家嘴金融区金贸大厦14层。金贸大厦，无数次坐车经过这里，但从来没有进去过，今天走进去，真的感觉有些不同。大堂很华丽，铭牌在用中、英、日文写明了本座一些入驻公司的名称，旁边是安全检查系统，像我们这种临时出入者，必须办借用一张磁卡，凭磁卡过闸机(类似地铁)才能进入电梯区。电梯区，我看到的差不多都有五、六十部，总体感觉比广州的中信广场要强。在电梯里面我已经隐隐约约能感觉有不少“竞争者”了，因为里面有好多人都是到14层。一出电梯，就看到华为大大的标志“HUIWEI 华为技术”，前台有3名负责招聘的工作人员，走进大堂，里面密密麻麻的全是人。我看到了立在旁边的招聘广告牌，上面写清楚了招聘职位和招聘程序。华为招聘的岗位分四大类：研发、全球技术支持、营销、行政。其中研发和技术支持是招聘岗位最多的。</p> 29 30 <p>我首先在前台填报到表，工作人员问我是否有预约过，我答是深圳人事部门通知我过来的，他们问我姓甚名谁，我答不出来(接电话的时候没有仔细问)。接过报道表格，是一个较简单一人一行信息的表格，我先看了看别人的信息：<br>“XX 学历：本科毕业学校：南开最近就职单位：上海西门子……”<br>“XX 学历：硕士毕业学校：上海交大最近就职单位：ALCATEL”<br>“XX 学历：硕士毕业学校：巴黎大学最近就职单位：(应届)”<br> 31 <div align="right"> 32 <a href="#top">返回顶部</a> <a href="#end">翻到底部</a> 33 <a name="middle"></a> 34 </div></p> 35 36 <p>一个个全部是精英啊，我当时都有傻了眼的感觉，我这学历，怎么拿出写手哦？不管三七二十一，我写了毕业学校：武汉大学，其它的填写真实情况。填完报到表，从工作人员手中拿到一份面试人员覆历登记表：首页是让你慎重选则工作地点：A可派至外球各艰苦地区 B可派至海外地区 C可派到全国各地 D只限于在某些城市工作。其实我早了解到：华为目前在非州地区业务迅猛，其中A选项就是指非洲了。由于个人原因，我选择了B、C两项。第二页分别是是个人基本情况如：姓名、出生、政治面貌、兴趣爱好、家庭成员等，稍特别两点的是：一说明你是否有亲友在华为工作，是何职位二，您是否在申请其它国国籍。第三页是填写个人工作经历，从事工作内容，及获得荣誉等。第四页就是期望待遇、和确认签名。在期望待遇一栏上，我写的是8000月薪。因为我目前的目标是年薪十万的工作。我慎重的填完表演格，交给工作人员，同时提交了打印版的个人简历。工作人员看到我的简历后，“您是中专学历？”全场有一些其它的应聘者都惊奇地看着我，“是的，我是”。工作人员答到“我们不招中专生的”，我说：“是深圳人事部那边让我过来参加你们的招聘会的”，“您的简历上有写是中专吗？”“是的”我说。她看一看我的简历，我简历一开始是写的本科，可是在简历最后有明确的说明。“您能提供是深圳那边谁让您过来面试的呢？”“对不起，我实在是记不清了，当时没有注意记。”显然，这位工作人员十分纳闷：中专都可以应聘华为，这不成了菜园子门了吗？她问了我一些简单的问题，然后叫我稍等。她拿着我的简历走开了，后来，她让我先到1407会议室先等着。</p> 37 38 2010-3-26 12:39 回复 39 中国结 40 不是嫖客 41 259位粉丝 42 5楼 43 44 <p>我来到1407会议室，里面大约已经有超过60应聘者在等待考官的面试，男女1：4的比例，这里面有人在拿着专业英语背单词，有的人在看《华为人》的内部报纸，有的人在看华为的宣传资料，还有一些在窃窃私语。我旁边坐着一位大约二十七、八的MM，当她打开自己的手提包时，我偶然瞟了一眼：里面放着英语六级证书和上海贝尔的工作牌。呵呵，感觉全屋子里面都是精英，就是我一个人显得这么渺小。大约20分钟后，终于有主考官拿着履历表和简历，叫我的名字面试了。我的心砰砰直跳，跟着主考官在后，隐约看到我的表格上面有一份黄色的小纸条上面写道“中专学历，现在就职于广州新太”。我们来到一个更大的会议室坐下，里面全部是考官、应聘者。一进门的位置，就是国际营销部门的“语言测试”，那里有两个人在用英语流利的对话。我随主考官坐下，旁边还有一位考官司，其中一位问了问我的基本情况，然后问了我现在从事的工作等等，我一一做答。当谈到学历问题时，我答道：“我的确是中专学历，当年吴士宏也没有上过大学，是从IBM的勤杂工做到Microsoft的中国总经理，她的成功对于我来说是一种鼓励！”，考官微笑的点头。“那做一下测试题吧”，我说“我很喜欢做题，即使做不出来，也会知道自己有哪些欠缺”，考官说道：“是的，在我们这里面试的人，有一些从简历上看是很历害，一考试，什么也不会！”，我答道“考试是一个好方法，不过大家同样是装修工，但如果用水电工的题目去考木工，可能不太合适！”“呵呵，在我们华为不会，我这里有好多套题目，你可以根据自己的特长选择，OS和数据库是必考”。OS是NT、UNIX、Solaris，数据库是：SQL Server、SyBase、Oracle、DB2。你是项目经理，我这里也有题目，不过可能比较难，我们这里是基于PMP的。我心里默想了一下：这几种数据库我都用过，不过Oracle和SQL Server熟悉一些。最终我选择了SQL Server、NT和网络三份试题，当然还有一份英译汉的翻译。我大约花了40分钟做完全部试题。SQL Server自己做对了85%，NT由于多年没有碰过，感觉做对了70%左右，英译汉不是基于计算机和通讯的，而是翻译一段新闻，大约400个单词，有两句话没有看懂，网络有点难，只对60%左右。在我做题目的过程中，我看到刚刚在会议室做在我旁边的MM正在进行“语言测试”呢！好流利！牛啊！</p> 45 46 <p>我做好试题，把答案交给主考官，两位考官看过后，原来一直没有发言的另一位考官司开始说话了：“你样新太好多人都很熟悉，XXX你应该认识吧，就是我招进来的”，我答道：“认识，我们是同事”，他又说“年前我还和你们开发中心的头XXX在一起喝咖啡，当时他……”我说“公司的确发生了一些不该发生的事情，否则我不会离开新太”，我们又一起聊了很多，原来这位考官真的对我们公司情况很熟悉，认识好多人，他记忆力非常好。最后，“我们坦诚的谈一下：你的能力非常强，作为中专生，做到这一步非常不容易！但是华为必定有自己的一套规钜，否则公司2万多人，都可以把自己的亲戚推荐过来，如果招你进深圳华为，一是学历可能很难通过，二是我们现在招聘的技术支持全部是要派往国外的，你英语可能一定的障碍。”，我说：“我很遗憾，但我可以理解”他接着说道：“你是人才，我们也不想错过，这样，我先推荐你到我们的合资公司，山东华为，做的事情和深圳华为是一样的，也可以学很多东西，我们推荐过去的人，他们一般都会要的，如果进去了，你在那里边先锻炼锻炼，另外再想办法提高自己的学历，几年后你还可以来找我！”……</p> 47 48 <p>总体来说，面试过程并不像传说中那么复杂，也许是深圳总部的招聘会更复杂和严格一些吧。</p> 49 50 我走出金茂大厦，我在想，我今天面试是成功了，还是失败了。<br> 51 <div align="right"> 52 <a name="end"></a><a href="#middle">返回中部</a> <a href="#top">返回顶部</a> 53 </div> 54 55 <p>我想不管怎么样，我今天在这里和这么多所谓精英，这么多名牌硕士、本科共同较量，我已经是赢了。</p> 56 </body> 57 </html></pre> </div> 我们来看一下代码的执行效果： 就是这样的，点击翻到中部，网页就会跳转到我们设定的对应锚点处，如： 可以看到，地址栏里的地址变了… 还有一点就是，我们创建的这个锚点，也可以在其他的页面中对其引用，引用方式为： <div class="cnblogs_code"> <pre><a href="test.html#top">跳转到test.html页面的顶部</a></pre> </div> 这个我就不举例了，这节课就这些了，我们下节课再见。 第22节、创建邮件链接 　　这里的href属性跟前面的两种链接的href属性不同，这里的href属性由三部分组成，第一部分是电子邮件协议名称mailto，第二部分是电子邮件地址，第三部分是可选属性，为邮件属性，形式为“subject="主题"”其中第一部分与第二部分之间用冒号“：”分开，第二部分与第三部分之间用问号“?”分开。 这节课内容不多，可以说是非常简单，下面我们来写一个实例网页，看看效果： 例26（21.html）: <div class="cnblogs_code"> <pre> 1 <html> 2 <head> 3 <title> ----创建邮件链接</title> 4 </head> 5 <body> 6 <center> 7 <h1>创建邮件链接示例</h1> 8 <hr color="teal"> 9 </center> 10 <P align="center"> 11 <a href="mailto:673116767@qq.com?subject=在HTML学习的过程中我有点问题需要问你">点击这里给我 12 写信</a> 13 </p> 14 </body> 15 </html></pre> </div> 代码很简单，我就不解释了，看一下执行效果吧，这是网页初打开时的状态： 下面这个是我点击这个链接后出现的画面： 这样就达到了创建邮件链接的目的，好了，我们今天的任务结束，下节课开始讲表单，朋友们再见。 第23节、使用表单 今天继续，开始说表单的实现，先说一下什么是表单，来看个图吧： 我这个图是截的free258的注册页面的图，这就是一个表单，我们在表单里输入相关的信息，然后点击最下面的“注册”按钮，这样我们所填写的信息就通过post或get方式传送给了网站的数据库，这样网站的管理人员就有了我们的注册资料。 那么，表单就是一种用来收集站点访问者信息的一种手段，当我们填完表单后，我们点击“注册”或“提交”按钮，这样我们所填的信息就被送出了，这时候，网站管理人员事先设定好的处理我们提交的信息的程序就会启动，以各种不同的方式处理这些数据。 那么，在HTML中，表单标记为form，基本语法格式如下： <div class="cnblogs_code"> <pre><form name="字符串" method="get|post" action="字符串"> ... ... </form></pre> </div> 我们来介绍一下form标记的属性： <div class="cnblogs_code"> <pre>1. name属性：我们使用这个属性指定表单的名字，以便在后面使用脚本的时候调用该表单，不然没有名字的话，脚本不认识它。 2. method属性：指定传送数据的方式，该属性可以有两个值，get和post，其中get的意思是直接将表单数据附加到请求该页的URL后，从而传送到服务器上，post的意思是在HTTP请求中嵌入表单数据，再传送。需要注意的是，使用get方式时应保证表单的数据不超过8192个字节，若超过了8192个字节，那么表单中的数据将被截断，从而造成数据处理失败，另外，如果表单中传送的是用户名和密码等重要信息的话，不要使用get方法，而应该使用更安全的post方法，所以，当我们指定表单数据的传送方式时，最好用post方法。 3. action属性：指定将要接收表单数据的服务器端程序或该程序的URL地址。 4. onsubmit属性：指定提交表单时要调用的事件处理程序 5. onreset属性：指定重置表单时要调用的事件处理程序 6. target属性：指定一个目标窗口，其取值如下： ☆ _blank：在未命名的窗口中打开目标文档 ☆ _parent：在显示当前文档的窗口的父窗口中打开目标文档 ☆ _self：在提交表单所使用的窗口中打开目标文档 ☆ _top：在当前窗口中打开目标文档，并确保目标文档占用整个窗口</pre> </div> 在一个网页中可以包含多个表单，在每个表单里都可以包含各种控件、文本框、复选框、下拉选单、按钮等内容，但，需要记住的是，表单是不能嵌套的。 OK，下面我们先来说如何使用输入型表单控件： 在HTML中，我们使用input标记来创建各种输入型表单控件，通过将input标记的type属性设置为不同的值，可以创建不同类型的输入型表单控件，包括单行文本框、密码框、复选框、单选按钮、文件域、按钮等。 下面我们来说一下使用单行文本框的方法。 将input的type属性设为text，即在网页中插入了一个单行文本输入框。 基本语法为： <div class="cnblogs_code"> <pre><input type="text" name="txt-1" value="字符串" size="整数" maxlength="整数"></pre> </div> 其中，name属性指定该单行文本框的名字，指定名字是为了我们以后使用脚本处理表单中的数据的时候用，value属性指定单行文本框的初始值，即在用户未输入任何内容时文本框里显示的内容，size属性指定单行文本框的宽度，maclength属性指定单行文本框内可输入的最大字符数。 OK，这东西不难的，那么下面我们就再来说一个，使用密码输入框。 朋友们应该有过体会，就是我们在注册账户或登录账户的时候，我们输进去的密码显示的是星号（*）或者实心圆点（●），我们现在就来讨论一下这些技术的实现方法： 使用密码输入框的方法跟使用单行文本框的方法差不多，只是input的type值由text变成了password，即基本语法为： <div class="cnblogs_code"> <pre><input type="password" name="pass-1" value="字符串" size="整数" maxlength="整数"></pre> </div> 这里name属性与单行文本框的名字的作用一样，value和size、maxlength都一样。 好，密码输入框我们也说过了，不要着急，上面两个输入框使用的方法大致上是一样的，那么，我们就再来说一个不同的，不过这个不同也只是一点点的不同罢了，那就是----使用按钮。 我们在注册或者登录的时候经常会用到各种各样的按钮，比如确定、重写、提交、注册等等按钮，这些按钮的实现方法就是将input的type属性设置为不同值来实现的。 在HTML里，我们可以使用input的type值设为submit（提交按钮），reset（重置按钮）和button（自定义按钮）。 创建按钮的基本语法为： <div class="cnblogs_code"> <pre><input type="submit|reset|button" name="字符串" value="字符串" onclick="过程"</pre> </div> 其中type可取的值有： 1. submit：创建一个提交按钮，当用户将表单中的需要填的东西填完了之后，点击此按钮提交填写好的数据，当我们点击了提交按钮之后，表单中的（包括提交按钮的名字和值）以ASCII文本格式传送给由表单中指定的表单处理程序来处理。 一般情况下，每个表单都是有提交按钮的。 2. reset：创建一个重置按钮，在输入表单时如果我们输入错误的地方有很多或者填完以后发现没有表达自己的意思的话，我们可以使用重置按钮，这个按钮的作用就是清空表单中已被填写或选择的项目，将表单还原到初始状态。 3. button：创建一个自定义按钮，这样的按钮被创建以后，我们必须为其指定一个专门的按钮处理程序，也就是必须为其指定一个处理脚本。 4. name：指定按钮的名称，注意，这个是按钮的名字，不是在按钮上显示的文字。 5. value：指定在按钮上显示的文字，比如设为“提交”。 另外，值得一提的是，除了上述属性之外，按钮控件还支持onclick事件，onclick事件就是鼠标单击事件，就是当我们单击了这个按钮的时候按钮可以作出相应的反应。 OK,下面我们来写一段代码，使用我们上边学习的内容来创建一个简单的表单。 例27（22.html）: <div class="cnblogs_code"> <pre> 1 <html> 2 <head> 3 <title> ----创建一个基本表单</title> 4 </head> 5 <body> 6 <form> 7 <table align="center" width="368"> 8 <tr bgcolor="teal"> 9 <th colspan="2" align="center"> 10 <font color="white"> 11 登录表单 12 </font> 13 </th> 14 </tr> 15 <tr> 16 <td align="right" width="113" height="50"> 17 用户名： 18 </td> 19 <td width="241" height="50"> 20 <input type="text" name="t-1" size="20" maxlength="12"> 21 </td> 22 </tr> 23 <tr> 24 <td align="right" width="113" height="50"> 25 密码： 26 </td> 27 <td width="241" height="50"> 28 <input type="password" name="pwd-1" size="20" 29 </td> 30 </tr> 31 <tr align="center"> 32 <td width="110" align="right" height="50"> 33 <input type="submit" name="sub-1" value="确定"> 34 </td> 35 <td width="241" height="50"> 36 <input type="reset" name="reset-1" value="重写"> 37 </td> 38 </tr> 39 </table> 40 </form> 41 </body> 42 </html></pre> </div> 　　我们来看一下执行效果吧： 　　这是网页刚打开的时候： 　　这是我填写了一些内容之后： 　　可以看到，在密码的输入栏里显示的是星号，这样安全系数就进一步增强了。 　　点击重写按钮则清空所有已填写的内容，恢复表单的初始状态，当然，在这里我点击确定也是没有用的，因为我没有对<form>标记指定处理它提交的内容的程序，我们会在接下来的课程中一步一步讲到。 　　好了，今天就说这么多吧，我们明天见！ 第24节、在表单中使用图形化按钮、单选按钮和复选按钮 　　上节课我们说的是，在表单中使用单行文本框以及密码框、提交按钮、重置按钮等，今天我们来学习一下使用图形化按钮和单选按钮和复选按钮。 　　先说使用图形化按钮，意思就是使用一张图片作为一个按钮来使用，这样看起来更美观，它的基本语法是这样的： <div class="cnblogs_code"> <pre><input type="image" src="图像的位置" name="字符串" value="字符串"></pre> </div> 其中，type的值为image，这意思就是说，我现在使用的是一个图形按钮，而后面的src属性则指定了我们使用的图像按钮的位置，再后面，是name属性和value属性，我们在写代码的时候，这两个属性随便用一个就好，不必两个都用，因为它们在这里的作用是一样的-----都是指定的图像的替换文字，也就是当图像显示不出来时的替换文字。 使用图形化的按钮就说完了，下面是使用单选按钮，首先，我们来了解一下什么是单选按钮，所谓单选按钮，顾名思义，就是在一组选项中，我们一次只能选择一个，实现方法是将type的属性设置为radio，基本语法是这样的： <div class="cnblogs_code"> <pre><input type="radio" name="字符串" value="字符串" checked></pre> </div> 其中，name属性指定单选按钮的名称，若干个名称相同的单选按钮构成一个单选选项组，我们一次在这个组中只能选择一个选项。 Value属性指定提交时的值，就是每个单选选项对应的编号。 还有一个checked属性，这个属性是可选属性，它是用来指定单选框的默认选择的，就是如果使用了这个属性，则这个选框在初始状态时是被默认选中的。 单选也说完了，还有一个复选，这个也不难，使用复选框 下面我们来写一段代码， 例28（23.html）： <div class="cnblogs_code"> <pre> 1 <html> 2 <head> 3 <title> ----创建基本表单</title> 4 </head> 5 <body> 6 <form> 7 <table align="center" width="368"> 8 <tr bgcolor="teal"> 9 <th colspan="2"> 10 <font color="white">用户资料</font> 11 </th> 12 </tr> 13 <tr> 14 <td width="106" align="right" height="50">姓名： 15 </td> 16 <td width="248" height="50"> 17 <input type="text" name="txt-name" size="20"> 18 </td> 19 </tr> 20 <tr> 21 <td width="106" align="right" height="50">性别： 22 </td> 23 <td width="248" height="50"> 24 <input type="radio" name="radio-usersex" value="男" checked>男 <input 25 type="radio" name="radio-1" value="女">女</td> 26 </tr> 27 <tr> 28 <td width="106" align="right" height="36">兴趣： 29 </td> 30 <td width="248" height="36"> 31 <input type="checkbox" name="chk-interest1" value="听音乐">听音乐 32 <input type="checkbox" name="chk-interest2" value="看小说">看小说 33 <input type="checkbox" name="chk-interest-3" value="上网">上网 34 </td> 35 </tr> 36 <tr> 37 <td align="right" width="106" height="36"> 38 <input type="submit" name="btn-submit" value="提交"> 39 </td> 40 <td width="248" height="36" align="center"> 41 <input type="reset" name="btn-reset" value="全部重写"> 42 </td> 43 </tr> 44 </table> 45 </form> 46 </body> 47 </html></pre> </div> 　　OK,我们来看一下代码的执行效果： 　　好了，这个表单里用到了单元格的合并，单行文本框，单选框，复选框，提交按钮和重置按钮，可以看到在单选框里，“男”是默认被选中的，这就是我们使用了checked属性的效果。 　　今天就说到这里吧，关键还是要多多练习，那样才会有效果。 　　下节课再见，我是不是嫖客，再见。 第25节、在表单中插入文件域 　　上节课我们说了使用单选按钮和复选按钮还有图形化的按钮，我们举的例子有单选按钮和复选按钮，但没有举图形化的按钮的例子，那么这节课我们就来演示一下，在演示之前呢，我们还需要学习一点知识，那就是学学在表单中插入文件域。 　　首先，说明一下什么是文件域，我们来看个图吧： 　　这里是红吧上传页面的一部分，这里就是一个文件域，可以看出，一个文件域由一个文本框和一个“浏览”按钮组成，我们可以直接在文本框中输入文件的路径，也可以点击浏览，然后选择需要上传的文件。 　　我们将input标记的type属性设为file，即可在网页中插入文件域。 　　语法格式为： <div class="cnblogs_code"> <pre><input type="file" name="字符串" size="字符串" value="字符串"></pre> </div> 其中，name属性指定文件域的名字标识，value属性指定初始文件名，size属性指定文件名输入框的宽度。 下面我们来写一段实例，对着实例看看你就明白怎么用了。 例29（24.html）： <div class="cnblogs_code"> <pre> 1 <html> 2 <head> 3 <title> ----使用文件域</title> 4 </head> 5 <body> 6 <form name="form-1"> 7 <table name="tab-1" align="center" width="388"> 8 <tr> 9 <th colspan="2" bgcolor="teal"> 10 <font color="white">文件域</font> 11 </th> 12 </tr> 13 <tr height="52"> 14 <td align="right">请选择文件：</td> 15 <td align="left"> 16 <input type="file" name="file-1" value="tank.txt" size="20"></td> 17 </tr> 18 <tr height="60"> 19 <td align="right"> 20 <input type="submit" name="btn-sub" value="开始上传"> 21 </td> 22 <td align="center"> 23 <input type="reset" name="btn-reset" value="重新选择"> 24 </td> 25 </tr> 26 </table> 27 </form> 28 </body> 29 </html></pre> </div> 来看一下代码的执行效果吧： 虚拟机坏了，只好在本地打开了，呵呵： OK，这节课就说这么多吧。 第26节、使用其他类型的表单控件 这节课，应该是HTML课程的最后一节课了，呵呵，苦难的日子终于要结束了，把这事做完我就得给吧里再规划一下了。 废话不多说了，今天的内容可能有些多，但都不难，我们一个一个的来看。 一、在表单中使用滚动文本框 我们在前面讲过使用单行文本框，即将input的type属性值设为text，这里的多行文本框的实现方法可不一样了，我们直接在<form>和</form>标记对之间使用textarea标记来创建多行文本框（即滚动文本框），其基本语法为： <div class="cnblogs_code"> <pre><textarea name=”字符串” rows=”整数” cols=”整数” [readonly]>…</textarea></pre> </div> 其中的name属性指定滚动文本框控件的名称，rows属性指定该控件的高度（以行为单位），cols属性指定该控件的宽度（以字符为单位），readonly属性是可选的，这个单词朋友们应该可以看懂吧，是只读的意思，即指定该属性后该控件内的内容不可被浏览者修改。 而<textarea>和</textarea>之间的内容将作为这个滚动文本框的初始值。 二、在表单中使用下拉菜单控件 我想朋友们应该知道什么是下拉菜单吧，我们可以从列表或选单中选择一项或多项。 我们在<form>和</form>标记之间使用select标记来创建下拉菜单，并使用option标记将每个选项列出来，其基本语法为： <div class="cnblogs_code"> <pre><select name=”字符串” size=”整数” [multiple]> <option [selected] value=”字符串”>选项1</option> <option [selected] value=”字符串”>选项2</option> …… </select></pre> </div> 同样的，name属性指定该控件的名称，size属性指定在列表中一次可以看到的选项数目，multiple属性是一个布尔属性，它指定该控件是否允许选择多项，即加上该属性时，允许多选，不加则不允许多选，selected属性指定该项的初始状态为选中状态。 三、给控件分组 我们前面介绍的都是使用单个控件的例子，但如果我们需要在一个页面里使用多个表单控件的话，给他们分组是一个不错的选择。 在HTML里，使用fieldset标记对表单控件进行分组，该标记必须以legend标记开头，以指定控件组的标题，在legend之后是该组内的控件，也可以使用嵌套的fieldset。 其基本语法格式为： <div class="cnblogs_code"> <pre><fieldset> <legend>控件组标题</legend> 该组内的控件 </fieldset></pre> </div> 　　好了，我们上面把今天的内容大致说了一下，下面又到写代码的环节了，最后一节课，我们尽量多用前面学习的知识吧，下面来一起创建一个表单： 例30（25.html）： <div class="cnblogs_code"> <pre> 1 <html> 2 <head> 3 <title>使用其他表单控件</title> 4 </head> 5 <body> 6 <form> 7 <fieldset> 8 <legend> 9 <b>个人资料</b> 10 </legend> 11 <table bgcolor="teal" width="300" align="center"> 12 <tr> 13 <td>姓名：</td> 14 <td> 15 <input type="text" name="txt_name" size="20"> 16 </td> 17 </tr> 18 <tr> 19 <td>性别：</td> 20 <td> 21 <input type="radio" name="rad_sex" value="男" checked>男 22 </td> 23 <td> 24 <input type="radio" name="rad_sex" value="女">女 25 </td> 26 </tr> 27 <tr> 28 <td> 29 出生日期： 30 </td> 31 <td> 32 <input type="text" name="txt_birthdate" size="20"> 33 </td> 34 </tr> 35 <tr> 36 <td> 37 个人特长： 38 39 40 41 42 </td> 43 <td> 44 <textarea name="text_techang" rows="3" cols="20"> 45 </textarea> 46 </td> 47 </tr> 48 </table> 49 </fieldset> 50 <br> 51 <fieldset> 52 <legend><b>专业与课程</b></legend> 53 <table name="tab_2" align="center" width="300" bgcolor="teal"> 54 <tr> 55 <td> 56 所学专业： 57 </td> 58 <td> 59 <select name="sel_zhuanye" size="1"> 60 <option selected>计算机应用</option> 61 <option>计算机网络技术</option> 62 <option>计算机软件技术</option> 63 </select> 64 </td> 65 </tr> 66 <tr> 67 <td valign="top"> 68 所学课程： 69 </td> 70 <td> 71 <select name="sel_kecheng" size="3" multiple> 72 <option selected>计算机应用基础</option> 73 <option>办公软件</option> 74 <option>数据库应用基础</option> 75 <option>ASP动态网页设计</option> 76 </select> 77 </td> 78 </tr> 79 <tr> 80 <td> 81 <input type="submit" name="btn_submit" value="提交"> 82 </td> 83 <td> 84 <input type="reset" name="btn_reset" value="重置"> 85 </td> 86 </tr> 87 </table> 88 </fieldset> 89 </form> 90 </body> 91 </html></pre> </div> 　　OK，我们来看代码的执行效果： 　　这就是控件分组的效果，还是不错的。 　　那么到这里为止，我们的表单就已经基本结束了，最后再介绍一点，即我们创建了表单以后设计到的表单的提交和处理问题，当用户填写完表单后，点击提交按钮即可将表单数据提交给服务器上指定的表单处理程序。 　　提交信息表单处理程序的方法由form标记的method属性来确定， 　　提交表单的方法有两种： 　　　　get方法和post方法， <div class="cnblogs_code"> <pre>1 get方法将表单的名称/值对进行程序编码，并将该信息赋予给一个叫QUERY_STRING的服务器变量； 2 3 post方法则直接将名称/值对传送至表单处理程序作为该程序的输入</pre> </div> 　　表单处理程序的URL地址由form标记的action属性来决定，当然，如果要处理我们自己创建的表单数据的话，我们需要在服务器端为其编写脚本(asp、php等)作为该表单的处理程序，说到这里可能有的朋友已经想到注入了，呵呵，这个貌似跟注入还是有那么一点点关系的，呵呵 　　好了，我们表单的学习正式结束，到这里，我们的HTML课程也就结束了，历时26节课，我写了有一个多月，每天坚持着写一篇，虽然很简单，但也算是为吧里做了点贡献吧，呵呵 　　其实编程这东西还是需要很大毅力的，我看书的时候，第一遍看不懂，我觉得很正常，那我会继续看第二遍，还不懂，继续第三遍，呵呵，最终我学会了。 扫一扫，回复“html”获取视频解答： <a href="http://img.e-com-net.com/image/info8/388b14edd99f414e9e012ac8cec5645e.jpg" target="_blank"><img style="margin-left:auto;;border:1px solid black;" src="http://img.e-com-net.com/image/info8/388b14edd99f414e9e012ac8cec5645e.jpg" alt="网络安全攻击与防护--HTML学习_第1张图片" width="258" height="258"></a> 感谢各位支持观看，有什么需要修改后台留言，会及时更新 </div> 转载于:https://www.cnblogs.com/chenqiwei/p/RunWsh_html.html </div> </div> </div> </div> </div>  <div id="SOHUCS" sid="1304568875127443456"></div> <script type="text/javascript" src="/views/front/js/chanyan.js"></script>  <div class="youdao-fixed-ad" id="detail_ad_bottom"></div> </div> <div class="col-md-3"> <div class="row" id="ad">  <div id="right-1" class="col-lg-12 col-md-12 col-sm-4 col-xs-4 ad"> <div class="youdao-fixed-ad" id="detail_ad_1"> </div> </div>  <div id="right-2" class="col-lg-12 col-md-12 col-sm-4 col-xs-4 ad"> <div class="youdao-fixed-ad" id="detail_ad_2"></div> </div>  <div id="right-3" class="col-lg-12 col-md-12 col-sm-4 col-xs-4 ad"> <div class="youdao-fixed-ad" id="detail_ad_3"></div> </div> </div> </div> </div> </div> </div> <div class="container"> <h4 class="pt20 mb15 mt0 border-top">你可能感兴趣的:(网络安全攻击与防护--HTML学习)</h4> <div id="paradigm-article-related"> <div class="recommend-post mb30"> <ul class="widget-links"> <li><a href="/article/1835514462770130944.htm" title="斤斤计较的婚姻到底有多难？" target="_blank">斤斤计较的婚姻到底有多难？</a> 白心之岂必有为 <div>很多人私聊我会问到在哪个人群当中斤斤计较的人最多？我都会回答他，一般婚姻出现问题的斤斤计较的人士会非常多，以我多年经验，在婚姻落的一塌糊涂的人当中，斤斤计较的人数占比在20～30%以上，也就是说10个婚姻出现问题的斤斤计较的人有2-3个有多不减。在婚姻出问题当中，有大量的心理不平衡的、尖酸刻薄的怨妇。在婚姻中仅斤斤计较有两种类型：第一种是物质上的，另一种是精神上的。在物质与精神上抠门已经严重的影响</div> </li> <li><a href="/article/1835514307744460800.htm" title="QQ群采集助手，精准引流必备神器" target="_blank">QQ群采集助手，精准引流必备神器</a> 2401_87347160 <a class="tag" taget="_blank" href="/search/%E5%85%B6%E4%BB%96/1.htm">其他</a><a class="tag" taget="_blank" href="/search/%E7%BB%8F%E9%AA%8C%E5%88%86%E4%BA%AB/1.htm">经验分享</a> <div>功能概述微信群查找与筛选工具是一款专为微信用户设计的辅助工具，它通过关键词搜索功能，帮助用户快速找到相关的微信群，并提供筛选是否需要验证的群组的功能。主要功能关键词搜索：用户可以输入关键词，工具将自动查找包含该关键词的微信群。筛选功能：工具提供筛选机制，用户可以选择是否只显示需要验证或不需要验证的群组。精准引流：通过上述功能，用户可以更精准地找到目标群组，进行有效的引流操作。3.设备需求该工具可以</div> </li> <li><a href="/article/1835513803861749760.htm" title="机器学习与深度学习间关系与区别" target="_blank">机器学习与深度学习间关系与区别</a> ℒℴѵℯ心·动ꦿ໊ོ꫞ <a class="tag" taget="_blank" href="/search/%E4%BA%BA%E5%B7%A5%E6%99%BA%E8%83%BD/1.htm">人工智能</a><a class="tag" taget="_blank" href="/search/%E5%AD%A6%E4%B9%A0/1.htm">学习</a><a class="tag" taget="_blank" href="/search/%E6%B7%B1%E5%BA%A6%E5%AD%A6%E4%B9%A0/1.htm">深度学习</a><a class="tag" taget="_blank" href="/search/python/1.htm">python</a> <div>一、机器学习概述定义机器学习（MachineLearning,ML）是一种通过数据驱动的方法，利用统计学和计算算法来训练模型，使计算机能够从数据中学习并自动进行预测或决策。机器学习通过分析大量数据样本，识别其中的模式和规律，从而对新的数据进行判断。其核心在于通过训练过程，让模型不断优化和提升其预测准确性。主要类型1.监督学习（SupervisedLearning）监督学习是指在训练数据集中包含输入</div> </li> <li><a href="/article/1835513568917811200.htm" title="随笔 | 仙一般的灵气" target="_blank">随笔 | 仙一般的灵气</a> 海思沧海 <div>仙岛今天，我看了你全部，似乎已经进入你的世界我不知道，这是否是梦幻，还是你仙一般的灵气吸引了我也许每一个人都要有一份属于自己的追求，这样才能够符合人生的梦想，生活才能够充满着阳光与快乐我不知道，我为什么会这样的感叹，是在感叹自己的人生，还是感叹自己一直没有孜孜不倦的追求只感觉虚度了光阴，每天活在自己的梦中，活在一个不真实的世界是在逃避自己，还是在逃避周围的一切有时候我嘲笑自己，嘲笑自己如此的虚无，</div> </li> <li><a href="/article/1835513440525971456.htm" title="一百九十四章. 自相矛盾" target="_blank">一百九十四章. 自相矛盾</a> 巨木擎天 <div>唉！就这么一夜，林子感觉就像过了很多天似的，先是回了阳间家里，遇到了那么多不可思议的事情儿。特别是小伙伴们，第二次与自己见面时，僵硬的表情和恐怖的气氛，让自己如坐针毡，打从心眼里难受！还有东子，他现在还好吗？有没有被人欺负？护城河里的小鱼小虾们，还都在吗？水不会真的干枯了吧？那对相亲相爱漂亮的太平鸟儿，还好吧！春天了，到了做窝、下蛋、喂养小鸟宝宝的时候了，希望它们都能够平安啊！虽然没有看见家人，也</div> </li> <li><a href="/article/1835511912192897024.htm" title="微服务下功能权限与数据权限的设计与实现" target="_blank">微服务下功能权限与数据权限的设计与实现</a> nbsaas-boot <a class="tag" taget="_blank" href="/search/%E5%BE%AE%E6%9C%8D%E5%8A%A1/1.htm">微服务</a><a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/%E6%9E%B6%E6%9E%84/1.htm">架构</a> <div>在微服务架构下，系统的功能权限和数据权限控制显得尤为重要。随着系统规模的扩大和微服务数量的增加，如何保证不同用户和服务之间的访问权限准确、细粒度地控制，成为设计安全策略的关键。本文将讨论如何在微服务体系中设计和实现功能权限与数据权限控制。1.功能权限与数据权限的定义功能权限：指用户或系统角色对特定功能的访问权限。通常是某个用户角色能否执行某个操作，比如查看订单、创建订单、修改用户资料等。数据权限：</div> </li> <li><a href="/article/1835511542284644352.htm" title="学点心理知识，呵护孩子健康" target="_blank">学点心理知识，呵护孩子健康</a> 静候花开_7090 <div>昨天听了华中师范大学教育管理学系副教授张玲老师的《哪里才是学生心理健康的最后庇护所，超越教育与技术的思考》的讲座。今天又重新学习了一遍，收获匪浅。张玲博士也注意到了当今社会上的孩子由于心理问题导致的自残、自杀及伤害他人等恶性事件。她向我们普及了一个重要的命题，她说心理健康的一些基本命题，我们与我们通常的一些教育命题是不同的，她还举了几个例子，让我们明白我们原来以为的健康并非心理学上的健康。比如如果</div> </li> <li><a href="/article/1835510025561403392.htm" title="《投行人生》读书笔记" target="_blank">《投行人生》读书笔记</a> 小蘑菇的树洞 <div>《投行人生》----作者詹姆斯-A-朗德摩根斯坦利副主席40年的职业洞见-很短小精悍的篇幅，比较适合初入职场的新人。第一部分成功的职业生涯需要规划1.情商归为适应能力分享与协作同理心适应能力，更多的是自我意识，你有能力识别自己的情并分辨这些情绪如何影响你的思想和行为。2.对于初入职场的人的建议，细节，截止日期和数据很重要截止日期，一种有效的方法是请老板为你所有的任务进行优先级排序。和老板喝咖啡的好</div> </li> <li><a href="/article/1835509897106649088.htm" title="Long类型前后端数据不一致" target="_blank">Long类型前后端数据不一致</a> igotyback <a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a> <div>响应给前端的数据浏览器控制台中response中看到的Long类型的数据是正常的到前端数据不一致前后端数据类型不匹配是一个常见问题，尤其是当后端使用Java的Long类型（64位）与前端JavaScript的Number类型（最大安全整数为2^53-1，即16位）进行数据交互时，很容易出现精度丢失的问题。这是因为JavaScript中的Number类型无法安全地表示超过16位的整数。为了解决这个问</div> </li> <li><a href="/article/1835508761310097408.htm" title="店群合一模式下的社区团购新发展——结合链动 2+1 模式、AI 智能名片与 S2B2C 商城小程序源码" target="_blank">店群合一模式下的社区团购新发展——结合链动 2+1 模式、AI 智能名片与 S2B2C 商城小程序源码</a> 说私域 <a class="tag" taget="_blank" href="/search/%E4%BA%BA%E5%B7%A5%E6%99%BA%E8%83%BD/1.htm">人工智能</a><a class="tag" taget="_blank" href="/search/%E5%B0%8F%E7%A8%8B%E5%BA%8F/1.htm">小程序</a> <div>摘要：本文探讨了店群合一的社区团购平台在当今商业环境中的重要性和优势。通过分析店群合一模式如何将互联网社群与线下终端紧密结合，阐述了链动2+1模式、AI智能名片和S2B2C商城小程序源码在这一模式中的应用价值。这些创新元素的结合为社区团购带来了新的机遇，提升了用户信任感、拓展了营销渠道，并实现了线上线下的完美融合。一、引言随着互联网技术的不断发展，社区团购作为一种新兴的商业模式，在满足消费者日常需</div> </li> <li><a href="/article/1835508376604340224.htm" title="2021-08-26" target="_blank">2021-08-26</a> 影幽 <div>在生活中，女人与男人的感悟往往有所不同。人生最大的舞台就是生活，大幕随时都可能拉开，关键是你愿不愿意表演都无法躲避。在生活中，遇事不要急躁，不要急于下结论，尤其生气时不要做决断，要学会换位思考，大事化小小事化了，把复杂的事情尽量简单处理，千万不要把简单的事情复杂化。永远不要扭曲，别人善意，无药可救。昨天是张过期的支票，明天是张信用卡，只有今天才是现金，要善加利用！执着的攀登者不必去与别人比较自己的</div> </li> <li><a href="/article/1835508131489214464.htm" title="高级编程--XML+socket练习题" target="_blank">高级编程--XML+socket练习题</a> masa010 <a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/%E5%BC%80%E5%8F%91%E8%AF%AD%E8%A8%80/1.htm">开发语言</a> <div>1.北京华北2114.8万人上海华东2,500万人广州华南1292.68万人成都华西1417万人（1）使用dom4j将信息存入xml中（2）读取信息，并打印控制台（3）添加一个city节点与子节点（4）使用socketTCP协议编写服务端与客户端，客户端输入城市ID，服务器响应相应城市信息（5）使用socketTCP协议编写服务端与客户端，客户端要求用户输入city对象，服务端接收并使用dom4j</div> </li> <li><a href="/article/1835507739820912640.htm" title="2018-07-23-催眠日作业-#不一样的31天#-66小鹿" target="_blank">2018-07-23-催眠日作业-#不一样的31天#-66小鹿</a> 小鹿_33 <div>预言日：人总是在逃避命运的路上，与之不期而遇。心理学上有个著名的名词，叫做自证预言；经济学上也有一个很著名的定律叫做，墨菲定律；在灵修派上，还有一个很著名的法则，叫做吸引力法则。这3个领域的词，虽然看起来不太一样，但是他们都在告诉人们一个现象：你越担心什么，就越有可能会发生什么。同样的道理，你越想得到什么，就应该要积极地去创造什么。无论是自证预言，墨菲定律还是吸引力法则，对人都有正反2个维度的影响</div> </li> <li><a href="/article/1835506996258893824.htm" title="回溯 Leetcode 332 重新安排行程" target="_blank">回溯 Leetcode 332 重新安排行程</a> mmaerd <a class="tag" taget="_blank" href="/search/Leetcode%E5%88%B7%E9%A2%98%E5%AD%A6%E4%B9%A0%E8%AE%B0%E5%BD%95/1.htm">Leetcode刷题学习记录</a><a class="tag" taget="_blank" href="/search/leetcode/1.htm">leetcode</a><a class="tag" taget="_blank" href="/search/%E7%AE%97%E6%B3%95/1.htm">算法</a><a class="tag" taget="_blank" href="/search/%E8%81%8C%E5%9C%BA%E5%92%8C%E5%8F%91%E5%B1%95/1.htm">职场和发展</a> <div>重新安排行程Leetcode332学习记录自代码随想录给你一份航线列表tickets，其中tickets[i]=[fromi,toi]表示飞机出发和降落的机场地点。请你对该行程进行重新规划排序。所有这些机票都属于一个从JFK（肯尼迪国际机场）出发的先生，所以该行程必须从JFK开始。如果存在多种有效的行程，请你按字典排序返回最小的行程组合。例如，行程[“JFK”,“LGA”]与[“JFK”,“LGB</div> </li> <li><a href="/article/1835506869339254784.htm" title="每日一题——第九十题" target="_blank">每日一题——第九十题</a> 互联网打工人no1 <a class="tag" taget="_blank" href="/search/C%E8%AF%AD%E8%A8%80%E7%A8%8B%E5%BA%8F%E8%AE%BE%E8%AE%A1%E6%AF%8F%E6%97%A5%E4%B8%80%E7%BB%83/1.htm">C语言程序设计每日一练</a><a class="tag" taget="_blank" href="/search/c%E8%AF%AD%E8%A8%80/1.htm">c语言</a> <div>题目：判断子串是否与主串匹配#include#include#include//////判断子串是否在主串中匹配//////主串///子串///boolisSubstring(constchar*str,constchar*substr){intlenstr=strlen(str);//计算主串的长度intlenSub=strlen(substr);//计算子串的长度//遍历主字符串，对每个可能得</div> </li> <li><a href="/article/1835506869838376960.htm" title="Python数据分析与可视化实战指南" target="_blank">Python数据分析与可视化实战指南</a> William数据分析 <a class="tag" taget="_blank" href="/search/python/1.htm">python</a><a class="tag" taget="_blank" href="/search/python/1.htm">python</a><a class="tag" taget="_blank" href="/search/%E6%95%B0%E6%8D%AE/1.htm">数据</a> <div>在数据驱动的时代，Python因其简洁的语法、强大的库生态系统以及活跃的社区，成为了数据分析与可视化的首选语言。本文将通过一个详细的案例，带领大家学习如何使用Python进行数据分析，并通过可视化来直观呈现分析结果。一、环境准备1.1安装必要库在开始数据分析和可视化之前，我们需要安装一些常用的库。主要包括pandas、numpy、matplotlib和seaborn等。这些库分别用于数据处理、数学</div> </li> <li><a href="/article/1835505957011025920.htm" title="《庄子.达生9》" target="_blank">《庄子.达生9》</a> 钱江潮369 <div>【原文】孔子观于吕梁，县水三十仞，流沫四十里，鼋鼍鱼鳖之所不能游也。见一丈夫游之，以为有苦而欲死也，使弟子并流而拯之。数百步而出，被发行歌而游于塘下。孔子从而问焉，曰：“吾以子为鬼，察子则人也。请问，‘蹈水有道乎’”曰：“亡，吾无道。吾始乎故，长乎性，成乎命。与齐俱入，与汩偕出，从水之道而不为私焉。此吾所以蹈之也。”孔子曰：“何谓始乎故，长乎性，成乎命？”曰：“吾生于陵而安于陵，故也；长于水而安于</div> </li> <li><a href="/article/1835505326573580288.htm" title="水泥质量纠纷案代理词" target="_blank">水泥质量纠纷案代理词</a> 徐宝峰律师 <div>贵州领航建设有限公司诉贵州纳雍隆庆乌江水泥有限公司产品质量纠纷案代理词尊敬的审判长、审判员：贵州千里律师事务所接受被告贵州纳雍隆庆乌江水泥有限公司的委托，指派我担任其诉讼代理人，参加本案的诉讼活动。下面，我结合本案事实和相关法律规定发表如下代理意见，供合议庭评议案件时参考：原告应当举证证明其遭受的损失与被告生产的水泥质量的因果关系。首先水泥是一种粉状水硬性无机胶凝材料。加水搅拌后成浆体，能在空气中</div> </li> <li><a href="/article/1835504470440636416.htm" title="Goolge earth studio 进阶4——路径修改与平滑" target="_blank">Goolge earth studio 进阶4——路径修改与平滑</a> 陟彼高冈yu <a class="tag" taget="_blank" href="/search/Google/1.htm">Google</a><a class="tag" taget="_blank" href="/search/earth/1.htm">earth</a><a class="tag" taget="_blank" href="/search/studio/1.htm">studio</a><a class="tag" taget="_blank" href="/search/%E8%BF%9B%E9%98%B6%E6%95%99%E7%A8%8B/1.htm">进阶教程</a><a class="tag" taget="_blank" href="/search/%E6%97%85%E6%B8%B8/1.htm">旅游</a> <div>如果我们希望在大约中途时获得更多的城市鸟瞰视角。可以将相机拖动到这里并创建一个新的关键帧。camera_target_clip_7EarthStudio会自动平滑我们的路径，所以当我们通过这个关键帧时，不是一个生硬的角度，而是一个平滑的曲线。camera_target_clip_8路径上有贝塞尔控制手柄，允许我们调整路径的形状。右键单击，我们可以选择“平滑路径”，这是默认的自动平滑算法，或者我们可</div> </li> <li><a href="/article/1835501774031646720.htm" title="18-115 一切思考不能有效转化为行动，都TM是扯淡！" target="_blank">18-115 一切思考不能有效转化为行动，都TM是扯淡！</a> 成长时间线 <div>7月25号写了一篇关于为什么会断更如此严重的反思，然而，之后日更仅仅维持了一周，又出现了这次更严重的现象。从8月2号到昨天8月6号，5天！又是5天没有更文！虽然这次断更时间和上次一样，那为什么说这次更严重？因为上次之后就分析了问题的原因，以及应该如何解决，按理说应该会好转，然而，没过几天严重断更的现象再次出现，想想，经过反思，问题依然没有解决与改变，这让我有些担忧。到底是哪里出了问题，难道我就真的</div> </li> <li><a href="/article/1835501771485704192.htm" title="山东大学小树林支教调研团青青仓木队——翟晓楠" target="_blank">山东大学小树林支教调研团青青仓木队——翟晓楠</a> 山东大学青青仓木队 <div>过了半年，又一次启程，又一次回到支教的初心之地。比起上一次的试探与不安，我更多了一丝稳重与熟练。心境、处境也都随着半个学期的过去而变得不同，半个学期中，身体上的，心理上的，太多的逆境让我变得步履维艰，曲曲折折，弯弯绕绕，我仿佛打不起精神，没有胃口，没有动力。感觉走的不顺畅的时候，支教这个旅程，给了我力量。自告奋勇承担起队长这一职务的我，从组织时的复杂和困难的经历，协调各种问题，从无到有，和校长和队</div> </li> <li><a href="/article/1835500751997202432.htm" title="直返最高等级与直返APP：无需邀请码的返利新体验" target="_blank">直返最高等级与直返APP：无需邀请码的返利新体验</a> 古楼 <div>随着互联网的普及和电商的兴起，直返模式逐渐成为一种流行的商业模式。在这种模式下，消费者通过购买产品或服务，获得一定的返利，并可以分享给更多的人。其中，直返最高等级和直返APP是直返模式中的重要概念和工具。本文将详细介绍直返最高等级的概念、直返APP的使用以及与邀请码的关系。【高省】APP（高佣金领导者）是一个自用省钱佣金高，分享推广赚钱多的平台，百度有几百万篇报道，运行三年，稳定可靠。高省APP，</div> </li> <li><a href="/article/1835498925755297792.htm" title="DIV+CSS+JavaScript技术制作网页（旅游主题网页设计与制作）云南大理" target="_blank">DIV+CSS+JavaScript技术制作网页（旅游主题网页设计与制作）云南大理</a> STU学生网页设计 <a class="tag" taget="_blank" href="/search/%E7%BD%91%E9%A1%B5%E8%AE%BE%E8%AE%A1/1.htm">网页设计</a><a class="tag" taget="_blank" href="/search/%E6%9C%9F%E6%9C%AB%E7%BD%91%E9%A1%B5%E4%BD%9C%E4%B8%9A/1.htm">期末网页作业</a><a class="tag" taget="_blank" href="/search/html%E9%9D%99%E6%80%81%E7%BD%91%E9%A1%B5/1.htm">html静态网页</a><a class="tag" taget="_blank" href="/search/html5%E6%9C%9F%E6%9C%AB%E5%A4%A7%E4%BD%9C%E4%B8%9A/1.htm">html5期末大作业</a><a class="tag" taget="_blank" href="/search/%E7%BD%91%E9%A1%B5%E8%AE%BE%E8%AE%A1/1.htm">网页设计</a><a class="tag" taget="_blank" href="/search/web%E5%A4%A7%E4%BD%9C%E4%B8%9A/1.htm">web大作业</a> <div>️精彩专栏推荐作者主页:【进入主页—获取更多源码】web前端期末大作业：【HTML5网页期末作业(1000套)】程序员有趣的告白方式：【HTML七夕情人节表白网页制作(110套)】文章目录二、网站介绍三、网站效果▶️1.视频演示2.图片演示四、网站代码HTML结构代码CSS样式代码五、更多源码二、网站介绍网站布局方面：计划采用目前主流的、能兼容各大主流浏览器、显示效果稳定的浮动网页布局结构。网站程</div> </li> <li><a href="/article/1835498218293653504.htm" title="2020-04-12每天三百字之连接与替代" target="_blank">2020-04-12每天三百字之连接与替代</a> 冷眼看潮 <div>不知道是不是好为人师，有时候还真想和别人分享一下我对某些现象的看法或者解释。人类社会不断发展进步的过程，就是不断连接与替代的过程。人类发现了火并应用火以后，告别了茹毛饮血的野兽般的原始生活（火烧、烹饪替代了生食）人类用石器代替了完全手工，工具的使用使人类进步一大步。类似这样的替代还有很多，随着科技的发展，有更多的原始的事物被替代，代之以更高效、更先进的技术。在近现代，汽车替代了马车，高速公路和铁路</div> </li> <li><a href="/article/1835497664381284352.htm" title="探索OpenAI和LangChain的适配器集成：轻松切换模型提供商" target="_blank">探索OpenAI和LangChain的适配器集成：轻松切换模型提供商</a> nseejrukjhad <a class="tag" taget="_blank" href="/search/langchain/1.htm">langchain</a><a class="tag" taget="_blank" href="/search/easyui/1.htm">easyui</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/python/1.htm">python</a> <div>#探索OpenAI和LangChain的适配器集成：轻松切换模型提供商##引言在人工智能和自然语言处理的世界中，OpenAI的模型提供了强大的能力。然而，随着技术的发展，许多人开始探索其他模型以满足特定需求。LangChain作为一个强大的工具，集成了多种模型提供商，通过提供适配器，简化了不同模型之间的转换。本篇文章将介绍如何使用LangChain的适配器与OpenAI集成，以便轻松切换模型提供商</div> </li> <li><a href="/article/1835497537369370624.htm" title="利用Requests Toolkit轻松完成HTTP请求" target="_blank">利用Requests Toolkit轻松完成HTTP请求</a> nseejrukjhad <a class="tag" taget="_blank" href="/search/http/1.htm">http</a><a class="tag" taget="_blank" href="/search/%E7%BD%91%E7%BB%9C%E5%8D%8F%E8%AE%AE/1.htm">网络协议</a><a class="tag" taget="_blank" href="/search/%E7%BD%91%E7%BB%9C/1.htm">网络</a><a class="tag" taget="_blank" href="/search/python/1.htm">python</a> <div>RequestsToolkit的力量：轻松构建HTTP请求Agent在现代软件开发中，API请求是与外部服务交互的核心。RequestsToolkit提供了一种便捷的方式，帮助开发者构建自动化的HTTP请求Agent。本文旨在详细介绍RequestsToolkit的设置、使用和潜在挑战。引言RequestsToolkit是一个强大的工具包，可用于构建执行HTTP请求的智能代理。这对于想要自动化与外</div> </li> <li><a href="/article/1835497074049773568.htm" title="数组去重" target="_blank">数组去重</a> 好奇的猫猫猫 <div>整理自js中基础数据结构数组去重问题思考？如何去除数组中重复的项例如数组：[1,3,4,3,5]我们在做去重的时候，一开始想到的肯定是，逐个比较，外面一层循环，内层后一个与前一个一比较，如果是久不将当前这一项放进新的数组，挨个比较完之后返回一个新的去过重复的数组不好的实践方式上述方法效率极低，代码量还多，思考？有没有更好的方法这时候不禁一想当然有了！！！hashtable啊，通过对象的hash办法</div> </li> <li><a href="/article/1835496310099243008.htm" title="春季养肝正当时" target="_blank">春季养肝正当时</a> dxn悟 <div>重温快乐2023年2月4日立春。春天来了，春暖花开，小鸟欢唱，那在这样的季节我们如何养肝呢？自然界的春季对应中医五行的木，人体五脏肝属木，“木曰曲直”，是以树干曲曲直直地向上、向外伸长舒展的生发姿态，来形容具有生长、升发、条达、舒畅等特征的食物及现象。根据中医天人相应的理念，肝五行属木，喜条达，主疏泄，与春天相应，所以春天最适合养肝。养肝首先要少生气，因为肝喜条达恶抑郁。人体五志肝为怒，生气发怒最</div> </li> <li><a href="/article/1835496149843275776.htm" title="关于城市旅游的HTML网页设计——(旅游风景云南 5页)HTML+CSS+JavaScript" target="_blank">关于城市旅游的HTML网页设计——(旅游风景云南 5页)HTML+CSS+JavaScript</a> 二挡起步 <a class="tag" taget="_blank" href="/search/web%E5%89%8D%E7%AB%AF%E6%9C%9F%E6%9C%AB%E5%A4%A7%E4%BD%9C%E4%B8%9A/1.htm">web前端期末大作业</a><a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a><a class="tag" taget="_blank" href="/search/html/1.htm">html</a><a class="tag" taget="_blank" href="/search/css/1.htm">css</a><a class="tag" taget="_blank" href="/search/%E6%97%85%E6%B8%B8/1.htm">旅游</a><a class="tag" taget="_blank" href="/search/%E9%A3%8E%E6%99%AF/1.htm">风景</a> <div>⛵源码获取文末联系✈Web前端开发技术描述网页设计题材，DIV+CSS布局制作,HTML+CSS网页设计期末课程大作业|游景点介绍|旅游风景区|家乡介绍|等网站的设计与制作|HTML期末大学生网页设计作业，Web大学生网页HTML：结构CSS：样式在操作方面上运用了html5和css3，采用了div+css结构、表单、超链接、浮动、绝对定位、相对定位、字体样式、引用视频等基础知识JavaScrip</div> </li> <li><a href="/article/1835496148601761792.htm" title="HTML网页设计制作大作业（div+css）云南我的家乡旅游景点带文字滚动" target="_blank">HTML网页设计制作大作业（div+css）云南我的家乡旅游景点带文字滚动</a> 二挡起步 <a class="tag" taget="_blank" href="/search/web%E5%89%8D%E7%AB%AF%E6%9C%9F%E6%9C%AB%E5%A4%A7%E4%BD%9C%E4%B8%9A/1.htm">web前端期末大作业</a><a class="tag" taget="_blank" href="/search/web%E8%AE%BE%E8%AE%A1%E7%BD%91%E9%A1%B5%E8%A7%84%E5%88%92%E4%B8%8E%E8%AE%BE%E8%AE%A1/1.htm">web设计网页规划与设计</a><a class="tag" taget="_blank" href="/search/html/1.htm">html</a><a class="tag" taget="_blank" href="/search/css/1.htm">css</a><a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a><a class="tag" taget="_blank" href="/search/dreamweaver/1.htm">dreamweaver</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a> <div>Web前端开发技术描述网页设计题材，DIV+CSS布局制作,HTML+CSS网页设计期末课程大作业游景点介绍|旅游风景区|家乡介绍|等网站的设计与制作HTML期末大学生网页设计作业HTML：结构CSS：样式在操作方面上运用了html5和css3，采用了div+css结构、表单、超链接、浮动、绝对定位、相对定位、字体样式、引用视频等基础知识JavaScript：做与用户的交互行为文章目录前端学习路线</div> </li> <li><a href="/article/8.htm" title="LeetCode[Math] - #66 Plus One" target="_blank">LeetCode[Math] - #66 Plus One</a> Cwind <a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/LeetCode/1.htm">LeetCode</a><a class="tag" taget="_blank" href="/search/%E9%A2%98%E8%A7%A3/1.htm">题解</a><a class="tag" taget="_blank" href="/search/Algorithm/1.htm">Algorithm</a><a class="tag" taget="_blank" href="/search/Math/1.htm">Math</a> <div>原题链接：#66 Plus One 要求：给定一个用数字数组表示的非负整数，如num1 = {1, 2, 3, 9}, num2 = {9, 9}等，给这个数加上1。注意： 1. 数字的较高位存在数组的头上，即num1表示数字1239 2. 每一位（数组中的每个元素）的取值范围为0~9 难度：简单分析：题目比较简单，只须从数组</div> </li> <li><a href="/article/135.htm" title="JQuery中$.ajax()方法参数详解" target="_blank">JQuery中$.ajax()方法参数详解</a> AILIKES <a class="tag" taget="_blank" href="/search/JavaScript/1.htm">JavaScript</a><a class="tag" taget="_blank" href="/search/jsonp/1.htm">jsonp</a><a class="tag" taget="_blank" href="/search/jquery/1.htm">jquery</a><a class="tag" taget="_blank" href="/search/Ajax/1.htm">Ajax</a><a class="tag" taget="_blank" href="/search/json/1.htm">json</a> <div>url: 要求为String类型的参数，（默认为当前页地址）发送请求的地址。 type: 要求为String类型的参数，请求方式（post或get）默认为get。注意其他http请求方法，例如put和 delete也可以使用，但仅部分浏览器支持。 timeout: 要求为Number类型的参数，设置请求超时时间（毫秒）。此设置将覆盖$.ajaxSetup()方法的全局</div> </li> <li><a href="/article/262.htm" title="JConsole & JVisualVM远程监视Webphere服务器JVM" target="_blank">JConsole & JVisualVM远程监视Webphere服务器JVM</a> Kai_Ge <a class="tag" taget="_blank" href="/search/JVisualVM/1.htm">JVisualVM</a><a class="tag" taget="_blank" href="/search/JConsole/1.htm">JConsole</a><a class="tag" taget="_blank" href="/search/Webphere/1.htm">Webphere</a> <div> JConsole是JDK里自带的一个工具，可以监测Java程序运行时所有对象的申请、释放等动作，将内存管理的所有信息进行统计、分析、可视化。我们可以根据这些信息判断程序是否有内存泄漏问题。　　使用JConsole工具来分析WAS的JVM问题，需要进行相关的配置。　　首先我们看WAS服务器端的配置. 　　1、登录was控制台https://10.4.119.18</div> </li> <li><a href="/article/389.htm" title="自定义annotation" target="_blank">自定义annotation</a> 120153216 <a class="tag" taget="_blank" href="/search/annotation/1.htm">annotation</a> <div>Java annotation 自定义注释@interface的用法一、什么是注释说起注释，得先提一提什么是元数据(metadata)。所谓元数据就是数据的数据。也就是说，元数据是描述数据的。就象数据表中的字段一样，每个字段描述了这个字段下的数据的含义。而J2SE5.0中提供的注释就是java源代码的元数据，也就是说注释是描述java源</div> </li> <li><a href="/article/516.htm" title="CentOS 5/6.X 使用 EPEL YUM源" target="_blank">CentOS 5/6.X 使用 EPEL YUM源</a> 2002wmj <a class="tag" taget="_blank" href="/search/centos/1.htm">centos</a> <div>CentOS 6.X 安装使用EPEL YUM源1. 查看操作系统版本[root@node1 ~]# uname -a Linux node1.test.com 2.6.32-358.el6.x86_64 #1 SMP Fri Feb 22 00:31:26 UTC 2013 x86_64 x86_64 x86_64 GNU/Linux [root@node1 ~]#</div> </li> <li><a href="/article/643.htm" title="在SQLSERVER中查找缺失和无用的索引SQL" target="_blank">在SQLSERVER中查找缺失和无用的索引SQL</a> 357029540 <a class="tag" taget="_blank" href="/search/SQL+Server/1.htm">SQL Server</a> <div>--缺失的索引 SELECT avg_total_user_cost * avg_user_impact * ( user_scans + user_seeks ) AS PossibleImprovement , last_user_seek , </div> </li> <li><a href="/article/770.htm" title="Spring3 MVC 笔记（二） —json+rest优化" target="_blank">Spring3 MVC 笔记（二） —json+rest优化</a> 7454103 <a class="tag" taget="_blank" href="/search/Spring3+MVC/1.htm">Spring3 MVC</a> <div>接上次的 spring mvc 注解的一些详细信息！其实也是一些个人的学习笔记呵呵！ </div> </li> <li><a href="/article/897.htm" title="替换“\”的时候报错Unexpected internal error near index 1 \ ^" target="_blank">替换“\”的时候报错Unexpected internal error near index 1 \ ^</a> adminjun <a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/%E2%80%9C%5C%E6%9B%BF%E6%8D%A2%E2%80%9D/1.htm">“\替换”</a> <div>发现还是有些东西没有刻子脑子里,,过段时间就没什么概念了,所以贴出来...以免再忘... 在拆分字符串时遇到通过 \ 来拆分，可是用所以想通过转义 \\ 来拆分的时候会报异常 public class Main { /*</div> </li> <li><a href="/article/1024.htm" title="POJ 1035 Spell checker(哈希表)" target="_blank">POJ 1035 Spell checker(哈希表)</a> aijuans <a class="tag" taget="_blank" href="/search/%E6%9A%B4%E5%8A%9B%E6%B1%82%E8%A7%A3--%E5%93%88%E5%B8%8C%E8%A1%A8/1.htm">暴力求解--哈希表</a> <div>/* 题意：输入字典，然后输入单词，判断字典中是否出现过该单词，或者是否进行删除、添加、替换操作，如果是，则输出对应的字典中的单词要求按照输入时候的排名输出题解：建立两个哈希表。一个存储字典和输入字典中单词的排名，一个进行最后输出的判重 */ #include <iostream> //#define using namespace std; const int HASH =</div> </li> <li><a href="/article/1151.htm" title="通过原型实现javascript Array的去重、最大值和最小值" target="_blank">通过原型实现javascript Array的去重、最大值和最小值</a> ayaoxinchao <a class="tag" taget="_blank" href="/search/JavaScript/1.htm">JavaScript</a><a class="tag" taget="_blank" href="/search/array/1.htm">array</a><a class="tag" taget="_blank" href="/search/prototype/1.htm">prototype</a> <div>用原型函数（prototype）可以定义一些很方便的自定义函数，实现各种自定义功能。本次主要是实现了Array的去重、获取最大值和最小值。实现代码如下： <script type="text/javascript"> Array.prototype.unique = function() { var a = {}; var le</div> </li> <li><a href="/article/1278.htm" title="UIWebView实现https双向认证请求" target="_blank">UIWebView实现https双向认证请求</a> bewithme <a class="tag" taget="_blank" href="/search/UIWebView/1.htm">UIWebView</a><a class="tag" taget="_blank" href="/search/https/1.htm">https</a><a class="tag" taget="_blank" href="/search/Objective-C/1.htm">Objective-C</a> <div> 什么是HTTPS双向认证我已在先前的博文 ASIHTTPRequest实现https双向认证请求中有讲述，不理解的读者可以先复习一下。本文是用UIWebView来实现对需要客户端证书验证的服务请求，网上有些文章中有涉及到此内容，但都只言片语，没有讲完全，更没有完整的代码，让人困扰不已。但是此知</div> </li> <li><a href="/article/1405.htm" title="NoSQL数据库之Redis数据库管理(Redis高级应用之事务处理、持久化操作、pub_sub、虚拟内存)" target="_blank">NoSQL数据库之Redis数据库管理(Redis高级应用之事务处理、持久化操作、pub_sub、虚拟内存)</a> bijian1013 <a class="tag" taget="_blank" href="/search/redis/1.htm">redis</a><a class="tag" taget="_blank" href="/search/%E6%95%B0%E6%8D%AE%E5%BA%93/1.htm">数据库</a><a class="tag" taget="_blank" href="/search/NoSQL/1.htm">NoSQL</a> <div>3.事务处理 Redis对事务的支持目前不比较简单。Redis只能保证一个client发起的事务中的命令可以连续的执行，而中间不会插入其他client的命令。当一个client在一个连接中发出multi命令时，这个连接会进入一个事务上下文，该连接后续的命令不会立即执行，而是先放到一个队列中，当执行exec命令时，redis会顺序的执行队列中</div> </li> <li><a href="/article/1532.htm" title="各数据库分页sql备忘" target="_blank">各数据库分页sql备忘</a> bingyingao <a class="tag" taget="_blank" href="/search/oracle/1.htm">oracle</a><a class="tag" taget="_blank" href="/search/sql/1.htm">sql</a><a class="tag" taget="_blank" href="/search/%E5%88%86%E9%A1%B5/1.htm">分页</a> <div>ORACLE 下面这个效率很低 SELECT * FROM ( SELECT A.*, ROWNUM RN FROM (SELECT * FROM IPAY_RCD_FS_RETURN order by id desc) A ) WHERE RN <20; 下面这个效率很高 SELECT A.*, ROWNUM RN FROM (SELECT * FROM IPAY_RCD_</div> </li> <li><a href="/article/1659.htm" title="【Scala七】Scala核心一：函数" target="_blank">【Scala七】Scala核心一：函数</a> bit1129 <a class="tag" taget="_blank" href="/search/scala/1.htm">scala</a> <div>1. 如果函数体只有一行代码，则可以不用写{},比如 def print(x: Int) = println(x) 一行上的多条语句用分号隔开，则只有第一句属于方法体，例如 def printWithValue(x: Int) : String= println(x); "ABC" 上面的代码报错，因为，printWithValue的方法</div> </li> <li><a href="/article/1786.htm" title="了解GHC的factorial编译过程" target="_blank">了解GHC的factorial编译过程</a> bookjovi <a class="tag" taget="_blank" href="/search/haskell/1.htm">haskell</a> <div>GHC相对其他主流语言的编译器或解释器还是比较复杂的，一部分原因是haskell本身的设计就不易于实现compiler，如lazy特性，static typed，类型推导等。关于GHC的内部实现有篇文章说的挺好，这里，文中在RTS一节中详细说了haskell的concurrent实现，里面提到了green thread，如果熟悉Go语言的话就会发现，ghc的concurrent实现和Go有点类</div> </li> <li><a href="/article/1913.htm" title="Java-Collections Framework学习与总结-LinkedHashMap" target="_blank">Java-Collections Framework学习与总结-LinkedHashMap</a> BrokenDreams <a class="tag" taget="_blank" href="/search/LinkedHashMap/1.htm">LinkedHashMap</a> <div> 前面总结了java.util.HashMap，了解了其内部由散列表实现，每个桶内是一个单向链表。那有没有双向链表的实现呢？双向链表的实现会具备什么特性呢？来看一下HashMap的一个子类——java.util.LinkedHashMap。 </div> </li> <li><a href="/article/2040.htm" title="读《研磨设计模式》-代码笔记-抽象工厂模式-Abstract Factory" target="_blank">读《研磨设计模式》-代码笔记-抽象工厂模式-Abstract Factory</a> bylijinnan <a class="tag" taget="_blank" href="/search/abstract/1.htm">abstract</a> <div>声明：本文只为方便我个人查阅和理解，详细的分析以及源代码请移步原作者的博客http://chjavach.iteye.com/ package design.pattern; /* * Abstract Factory Pattern * 抽象工厂模式的目的是： * 通过在抽象工厂里面定义一组产品接口，方便地切换“产品簇” * 这些接口是相关或者相依赖的</div> </li> <li><a href="/article/2167.htm" title="压暗面部高光" target="_blank">压暗面部高光</a> cherishLC <a class="tag" taget="_blank" href="/search/PS/1.htm">PS</a> <div>方法一、压暗高光&重新着色当皮肤很油又使用闪光灯时，很容易在面部形成高光区域。下面讲一下我今天处理高光区域的心得：皮肤可以分为纹理和色彩两个属性。其中纹理主要由亮度通道（Lab模式的L通道）决定，色彩则由a、b通道确定。处理思路为在保持高光区域纹理的情况下，对高光区域着色。具体步骤为：降低高光区域的整体的亮度，再进行着色。如果想简化步骤，可以只进行着色（参看下面的步骤1</div> </li> <li><a href="/article/2294.htm" title="Java VisualVM监控远程JVM" target="_blank">Java VisualVM监控远程JVM</a> crabdave <a class="tag" taget="_blank" href="/search/visualvm/1.htm">visualvm</a> <div>Java VisualVM监控远程JVM JDK1.6开始自带的VisualVM就是不错的监控工具. 这个工具就在JAVA_HOME\bin\目录下的jvisualvm.exe, 双击这个文件就能看到界面通过JMX连接远程机器, 需要经过下面的配置: 1. 修改远程机器JDK配置文件 (我这里远程机器是linux). </div> </li> <li><a href="/article/2421.htm" title="Saiku去掉登录模块" target="_blank">Saiku去掉登录模块</a> daizj <a class="tag" taget="_blank" href="/search/saiku/1.htm">saiku</a><a class="tag" taget="_blank" href="/search/%E7%99%BB%E5%BD%95/1.htm">登录</a><a class="tag" taget="_blank" href="/search/olap/1.htm">olap</a><a class="tag" taget="_blank" href="/search/BI/1.htm">BI</a> <div> 1、修改applicationContext-saiku-webapp.xml <security:intercept-url pattern="/rest/**" access="IS_AUTHENTICATED_ANONYMOUSLY" /> <security:intercept-url pattern=&qu</div> </li> <li><a href="/article/2548.htm" title="浅析 Flex中的Focus" target="_blank">浅析 Flex中的Focus</a> dsjt <a class="tag" taget="_blank" href="/search/html/1.htm">html</a><a class="tag" taget="_blank" href="/search/Flex/1.htm">Flex</a><a class="tag" taget="_blank" href="/search/Flash/1.htm">Flash</a> <div>关键字：focus、 setFocus、 IFocusManager、KeyboardEvent 焦点、设置焦点、获得焦点、键盘事件一、无焦点的困扰——组件监听不到键盘事件原因：只有获得焦点的组件（确切说是InteractiveObject）才能监听到键盘事件的目标阶段；键盘事件（flash.events.KeyboardEvent）参与冒泡阶段，所以焦点组件的父项（以及它爸</div> </li> <li><a href="/article/2675.htm" title="Yii全局函数使用" target="_blank">Yii全局函数使用</a> dcj3sjt126com <a class="tag" taget="_blank" href="/search/yii/1.htm">yii</a> <div>由于YII致力于完美的整合第三方库，它并没有定义任何全局函数。yii中的每一个应用都需要全类别和对象范围。例如，Yii::app()->user;Yii::app()->params['name'];等等。我们可以自行设定全局函数，使得代码看起来更加简洁易用。(原文地址) 我们可以保存在globals.php在protected目录下。然后，在入口脚本index.php的，我们包括在</div> </li> <li><a href="/article/2802.htm" title="设计模式之单例模式二（解决无序写入的问题）" target="_blank">设计模式之单例模式二（解决无序写入的问题）</a> come_for_dream <a class="tag" taget="_blank" href="/search/%E5%8D%95%E4%BE%8B%E6%A8%A1%E5%BC%8F/1.htm">单例模式</a><a class="tag" taget="_blank" href="/search/volatile/1.htm">volatile</a><a class="tag" taget="_blank" href="/search/%E4%B9%B1%E5%BA%8F%E6%89%A7%E8%A1%8C/1.htm">乱序执行</a><a class="tag" taget="_blank" href="/search/%E5%8F%8C%E9%87%8D%E6%A3%80%E9%AA%8C%E9%94%81/1.htm">双重检验锁</a> <div> 在上篇文章中我们使用了双重检验锁的方式避免懒汉式单例模式下由于多线程造成的实例被多次创建的问题，但是因为由于JVM为了使得处理器内部的运算单元能充分利用，处理器可能会对输入代码进行乱序执行（Out Of Order Execute）优化，处理器会在计算之后将乱序执行的结果进行重组，保证该</div> </li> <li><a href="/article/2929.htm" title="程序员从初级到高级的蜕变" target="_blank">程序员从初级到高级的蜕变</a> gcq511120594 <a class="tag" taget="_blank" href="/search/%E6%A1%86%E6%9E%B6/1.htm">框架</a><a class="tag" taget="_blank" href="/search/%E5%B7%A5%E4%BD%9C/1.htm">工作</a><a class="tag" taget="_blank" href="/search/PHP/1.htm">PHP</a><a class="tag" taget="_blank" href="/search/android/1.htm">android</a><a class="tag" taget="_blank" href="/search/html5/1.htm">html5</a> <div>软件开发是一个奇怪的行业，市场远远供不应求。这是一个已经存在多年的问题，而且随着时间的流逝，愈演愈烈。我们严重缺乏能够满足需求的人才。这个行业相当年轻。大多数软件项目是失败的。几乎所有的项目都会超出预算。我们解决问题的最佳指导方针可以归结为——“用一些通用方法去解决问题，当然这些方法常常不管用，于是，唯一能做的就是不断地尝试，逐个看看是否奏效”。现在我们把淫浸代码时间超过3年的开发人员称为</div> </li> <li><a href="/article/3056.htm" title="Reverse Linked List" target="_blank">Reverse Linked List</a> hcx2013 <a class="tag" taget="_blank" href="/search/list/1.htm">list</a> <div>Reverse a singly linked list. /** * Definition for singly-linked list. * public class ListNode { * int val; * ListNode next; * ListNode(int x) { val = x; } * } */ p</div> </li> <li><a href="/article/3183.htm" title="Spring4.1新特性——数据库集成测试" target="_blank">Spring4.1新特性——数据库集成测试</a> jinnianshilongnian <a class="tag" taget="_blank" href="/search/spring+4.1/1.htm">spring 4.1</a> <div>目录 Spring4.1新特性——综述 Spring4.1新特性——Spring核心部分及其他 Spring4.1新特性——Spring缓存框架增强 Spring4.1新特性——异步调用和事件机制的异常处理 Spring4.1新特性——数据库集成测试脚本初始化 Spring4.1新特性——Spring MVC增强 Spring4.1新特性——页面自动化测试框架Spring MVC T</div> </li> <li><a href="/article/3310.htm" title="C# Ajax上传图片同时生成微缩图(附Demo)" target="_blank">C# Ajax上传图片同时生成微缩图(附Demo)</a> liyonghui160com <div> 1.Ajax无刷新上传图片,详情请阅我的这篇文章。（jquery + c# ashx） 2.C#位图处理 System.Drawing。 3.最新demo支持IE7,IE8,Fir</div> </li> <li><a href="/article/3437.htm" title="Java list三种遍历方法性能比较" target="_blank">Java list三种遍历方法性能比较</a> pda158 <a class="tag" taget="_blank" href="/search/java/1.htm">java</a> <div>从c/c++语言转向java开发，学习java语言list遍历的三种方法，顺便测试各种遍历方法的性能，测试方法为在ArrayList中插入1千万条记录，然后遍历ArrayList，发现了一个奇怪的现象，测试代码例如以下： package com.hisense.tiger.list; import java.util.ArrayList; import java.util.Iterator;</div> </li> <li><a href="/article/3564.htm" title="300个涵盖IT各方面的免费资源（上）——商业与市场篇" target="_blank">300个涵盖IT各方面的免费资源（上）——商业与市场篇</a> shoothao <a class="tag" taget="_blank" href="/search/seo/1.htm">seo</a><a class="tag" taget="_blank" href="/search/%E5%95%86%E4%B8%9A%E4%B8%8E%E5%B8%82%E5%9C%BA/1.htm">商业与市场</a><a class="tag" taget="_blank" href="/search/IT%E8%B5%84%E6%BA%90/1.htm">IT资源</a><a class="tag" taget="_blank" href="/search/%E5%85%8D%E8%B4%B9%E8%B5%84%E6%BA%90/1.htm">免费资源</a> <div> A.网站模板+logo+服务器主机+发票生成 HTML5 UP:响应式的HTML5和CSS3网站模板。 Bootswatch:免费的Bootstrap主题。 Templated:收集了845个免费的CSS和HTML5网站模板。 Wordpress.org|Wordpress.com:可免费创建你的新网站。 Strikingly:关注领域中免费无限的移动优</div> </li> <li><a href="/article/3691.htm" title="localStorage、sessionStorage" target="_blank">localStorage、sessionStorage</a> uule <a class="tag" taget="_blank" href="/search/localStorage/1.htm">localStorage</a> <div>W3School 例子 HTML5 提供了两种在客户端存储数据的新方法： localStorage - 没有时间限制的数据存储 sessionStorage - 针对一个 session 的数据存储之前，这些都是由 cookie 完成的。但是 cookie 不适合大量数据的存储，因为它们由每个对服务器的请求来传递，这使得 cookie 速度很慢而且效率也不</div> </li> </ul> </div> </div> </div> <div> <div class="container"> <div class="indexes"> 按字母分类： <a href="/tags/A/1.htm" target="_blank">A</a><a href="/tags/B/1.htm" target="_blank">B</a><a href="/tags/C/1.htm" target="_blank">C</a><a href="/tags/D/1.htm" target="_blank">D</a><a href="/tags/E/1.htm" target="_blank">E</a><a href="/tags/F/1.htm" target="_blank">F</a><a href="/tags/G/1.htm" target="_blank">G</a><a href="/tags/H/1.htm" target="_blank">H</a><a href="/tags/I/1.htm" target="_blank">I</a><a href="/tags/J/1.htm" target="_blank">J</a><a href="/tags/K/1.htm" target="_blank">K</a><a href="/tags/L/1.htm" target="_blank">L</a><a href="/tags/M/1.htm" target="_blank">M</a><a href="/tags/N/1.htm" target="_blank">N</a><a href="/tags/O/1.htm" target="_blank">O</a><a href="/tags/P/1.htm" target="_blank">P</a><a href="/tags/Q/1.htm" target="_blank">Q</a><a href="/tags/R/1.htm" target="_blank">R</a><a href="/tags/S/1.htm" target="_blank">S</a><a href="/tags/T/1.htm" target="_blank">T</a><a href="/tags/U/1.htm" target="_blank">U</a><a href="/tags/V/1.htm" target="_blank">V</a><a href="/tags/W/1.htm" target="_blank">W</a><a href="/tags/X/1.htm" target="_blank">X</a><a href="/tags/Y/1.htm" target="_blank">Y</a><a href="/tags/Z/1.htm" target="_blank">Z</a><a href="/tags/0/1.htm" target="_blank">其他</a> </div> </div> </div> <footer id="footer" class="mb30 mt30"> <div class="container"> <div class="footBglm"> <a target="_blank" href="/">首页</a> - <a target="_blank" href="/custom/about.htm">关于我们</a> - <a target="_blank" href="/search/Java/1.htm">站内搜索</a> - <a target="_blank" href="/sitemap.txt">Sitemap</a> - <a target="_blank" href="/custom/delete.htm">侵权投诉</a> </div> <div class="copyright">版权所有 IT知识库 CopyRight © 2000-2050 E-COM-NET.COM , All Rights Reserved.  </div> </div> </footer>  <script type="text/javascript" src="/static/syntaxhighlighter/scripts/shCore.js"></script> <script type="text/javascript" src="/static/syntaxhighlighter/scripts/shLegacy.js"></script> <script type="text/javascript" src="/static/syntaxhighlighter/scripts/shAutoloader.js"></script> <link type="text/css" rel="stylesheet" href="/static/syntaxhighlighter/styles/shCoreDefault.css"/> <script type="text/javascript" src="/static/syntaxhighlighter/src/my_start_1.js"></script> </body> </html>