HTML总结1【转】

以下内容转载和参考自:w3school的HTML学习内容,HTML 简介 。

一、概述

   HTML不是一种编程语言,它是超文本标记语言 (Hyper Text Markup Language),使用标记标签来描述网页内容。HTML标签是由尖括号包围的关键词,标签通常是成对出现的,标签对中的第一个标签是开始标签(开放标签),第二个标签是结束标签(闭合标签)。一个HTML文档就是由HTML标签和其中的文本组成的,浏览器不会显示 HTML 标签,而是使用标签来解释并展示文本内容。

  开始标签到结束标签的所有内容又称为HTML 元素。HTML元素中的属性包含在标签头中,属性值应该始终使用引号包围,如果属性值里含有双引号,那么必须使用单引号来包围属性值。 默认情况下HTML 会自动地在段落、标题这种块级元素前后添加一个额外的空行(换行),其它元素则不会。HTML 标签对大小写不敏感,但推荐使用小写。搜索引擎使用标题为您的网页的结构和内容编制索引,所以应该合理的使用标签来设置标题。一些html元素和属性并不是所有浏览器都兼容的,有些元素和属性对于老式浏览器也不兼容。

 
 


这是一个标题

这是一个标题

这是一个段落。

这是一个文本 这里是引用内容

这是一个标题

This is a para graph
with line breaks

站内链接

站外链接


describe text
HTML总结1【转】_第1张图片

  有的HTML首行是,这是一个声明,它用来告知 Web 浏览器页面了HTML 5版本。

  仅有 16 种颜色名被 HTML 4.0 标准支持,如black、white、blue、gray、green、red、yellow。

  应该通过标签或属性来改变样式输出,如下所示的p段落中,并不会根据源代码来显示段落,源代码中的空行、换行和连续的空格都会被算作一个空格来显示。可以使用pre 标签来定义预格式文本,这样就能保留文本中的空格、换行和空行:

HTML总结1【转】_第2张图片

下面为一些文本格式化标签的使用:

HTML总结1【转】_第3张图片

  a元素还可以创建滚动到本页面指定位置的“锚”,如下所示,当我们点击“转到提示”文本后,页面会滚动到“提示”文本处,也可以使用a打开指定的超链接后滚动到该页面的锚处:

HTML总结1【转】_第4张图片

     对于子目录的URL,应该将正斜杠添加到URL中,比如href = "http://www.w3school.com.cn/html/",假如这样书写链接:href = "http://www.w3school.com.cn/html",就会向服务器产生两次 HTTP 请求。

  可以将a、img等元素放到p、h中来混合显示,也可以将img放置a中来设置一个图片链接。图片与文本混合显示的时候,图片默认是底部与文字对齐,也可给img元素添加align属性来设置顶部对齐(align="top")或中间对齐(align = "middle"),如果将align设置成“left”或“right”的话,图像就会在整个段落的最左或最右来显示:

HTML总结1【转】_第5张图片

  也可以设置图片为整个页面的背景,通过设置body元素的background属性:。

  创建图像映射:usemap是标签的一个属性,用来指示使用的图像地图,图像地图把一幅图像分成若干个区域,点击不同的区域会进入不同的页面。如下所示的图片使用planetmap图像地图,点击不同的星球会跳转指定的页面:

HTML总结1【转】_第6张图片

  可以在网页中嵌入另一个网页,通过iframe元素:

HTML总结1【转】_第7张图片  

  绝对路径:

  相对路径1:,使用本网站根目录中images目录中的picture.jpg。

  相对路径2:,使用当前目录中的image目录中的picture.jpg。

二、head  

   元素是所有头部元素的容器,以下标签都可以添加到 head 部分:、<base>、<link>、<style>、<meta>、<script> 。<title>用来设置标签栏的标题,<base>可以为页面上的所有链接规定统一的跳转地址或目标;<link> 标签常用于连接外部样式表;<style>用来定义内部样式表;<meta> 提供HTML 文档的元数据(元数据(metadata)是关于数据的信息),元数据不会显示在页面上,它用于提供给浏览器,比如用于设置页面的描述, 如使用的字符编码、关键词、文档作者、最后修改时间等,一些搜索引擎会利用 meta 元素的 name 和 content 属性来索引您的页面;<script> 用于定义客户端脚本,比如 JavaScript。</p> <p><a href="http://img.e-com-net.com/image/info8/84db3aa6df53444eb29ed655dbd3d6f7.jpg" target="_blank"><img alt="HTML总结1【转】_第8张图片" src="http://img.e-com-net.com/image/info8/84db3aa6df53444eb29ed655dbd3d6f7.jpg" width="650" height="233" style="border:1px solid black;"></a></p> <p></p> <p style="text-align:center;"><a href="http://img.e-com-net.com/image/info8/e1c0dd8f809f4be7b927c0fb29bb8088.jpg" target="_blank"><img alt="HTML总结1【转】_第9张图片" src="http://img.e-com-net.com/image/info8/e1c0dd8f809f4be7b927c0fb29bb8088.jpg" width="650" height="196" style="border:1px solid black;"></a></p> <p></p> <p><strong>三、样式</strong></p> <p>  style属性即样式,它提供了一种改变所有 HTML 元素样式的通用方法,有了它之后一些标签和属性就被弃用了,如<center>和<font>标签以及align和bgcolor属性:</p> <div> <div> <div> <a href="http://img.e-com-net.com/image/info8/f6225ff361364f1ca2e2f35a70446509.jpg" target="_blank"><img alt="" src="http://img.e-com-net.com/image/info8/f6225ff361364f1ca2e2f35a70446509.jpg" width="650" height="82"></a> </div> </div> </div> <p style="text-align:center;">  <a href="http://img.e-com-net.com/image/info8/33823ff6b1744e888ad17daa359bc911.jpg" target="_blank"><img alt="HTML总结1【转】_第10张图片" src="http://img.e-com-net.com/image/info8/33823ff6b1744e888ad17daa359bc911.jpg" width="650" height="104" style="border:1px solid black;"></a></p> <p>  <span>可以用来设置标签中部分元素的样式:</p> <p style="text-align:center;"><a href="http://img.e-com-net.com/image/info8/8a3a9c9f36c041a78e1a04790de2530d.jpg" target="_blank"><img alt="HTML总结1【转】_第11张图片" src="http://img.e-com-net.com/image/info8/8a3a9c9f36c041a78e1a04790de2530d.jpg" width="650" height="339" style="border:1px solid black;"></a></p> <p>   单个标签内元素的样式可以使用<span>来定义,对多个标签使用相同样式的话使用<div>。<div>可以将多个标签形成一个块,块里边的元素可以使用相同的样式,如下所示。<div> 是一个块级元素,这意味着它的内容自动地开始一个新行。div中的align属性不赞成使用,请使用样式取而代之。</p> <p style="text-align:center;"><a href="http://img.e-com-net.com/image/info8/e1399b3cf9d5432ebc4d16837c7eaac6.jpg" target="_blank"><img alt="HTML总结1【转】_第12张图片" src="http://img.e-com-net.com/image/info8/e1399b3cf9d5432ebc4d16837c7eaac6.jpg" width="650" height="154" style="border:1px solid black;"></a></p> <p>    div块中元素也可以有自己独特的样式,而且div中部分样式只是针对这个div块而不是块中的元素,如下所示的标题h1的背景颜色没有使用div中设置的,div中设置的边框没有应用到标题h1和段落p,只应用到了整个div块的显示:</p> <p style="text-align:center;"><a href="http://img.e-com-net.com/image/info8/b7fe3dee3dc2411b81a6e647b8f25e42.jpg" target="_blank"><img alt="HTML总结1【转】_第13张图片" src="http://img.e-com-net.com/image/info8/b7fe3dee3dc2411b81a6e647b8f25e42.jpg" width="650" height="109" style="border:1px solid black;"></a></p> <p>   大多数 HTML 元素被定义为块级元素( block level element)或内联元素(inline element),块级元素在浏览器显示时,通常会以新行来开始(和结束), 如<h1>, <p>, <ul>, <table>, <div>。内联元素在显示时通常不会以新行开始,如<b>, <td>, <a>, <img>, <span>。<div> 元素可用于对大的内容块设置样式属性,以及进行文档布局,<span> 元素可用于为元素内部分文本设置样式属性。</p> <p>  使用样式改变网页外观有三种方法,第一种就是上面所说的在在相关的标签中使用样式属性,样式属性可以包含任何 css 属性,这种方式属于内联样式。</p> <p>  第二种方法就是使用内部样式表(internal css),如下所示,在html的head 部分通过 <style> 标签定义内部样式表,这样这些样式就能够被本文件中所有的元素共用:</p> <div> <div> <div> <a href="http://img.e-com-net.com/image/info8/182708717a074ec1a579eb8d2c9fe21f.jpg" target="_blank"><img alt="HTML总结1【转】_第14张图片" src="http://img.e-com-net.com/image/info8/182708717a074ec1a579eb8d2c9fe21f.jpg" width="650" height="179" style="border:1px solid black;"></a> </div> </div> </div> <p>  内部样式也可以与class、id结合使用,如下同时也标识了magin和padding的区别,其它的还有magin-left:10px(仅保留10像素的左边距)、margin:10px 20px(上下边距为10,左右边距为20)、padding:10px 20px 30px 40px(上右下左外边距)、margin:10px(上右下左外边距):</p> <p><a href="http://img.e-com-net.com/image/info8/12b0de07c5a7465aa256883c770016c9.jpg" target="_blank"><img alt="HTML总结1【转】_第15张图片" src="http://img.e-com-net.com/image/info8/12b0de07c5a7465aa256883c770016c9.jpg" width="650" height="189" style="border:1px solid black;"></a></p> <p></p> <p style="text-align:center;">需要注意的是,使用padding的话会增加元素的大小,如下所示的h1使用了50的padding,所以h1的宽度变成了150而不是100:  </p> <p style="text-align:center;"><a href="http://img.e-com-net.com/image/info8/90c3d051348a47e8afe31a75adf80f7f.jpg" target="_blank"><img alt="HTML总结1【转】_第16张图片" src="http://img.e-com-net.com/image/info8/90c3d051348a47e8afe31a75adf80f7f.jpg" width="650" height="126" style="border:1px solid black;"></a></p> <p style="text-align:center;"><a href="http://img.e-com-net.com/image/info8/baec2337f248409d8adc3c8634d5b0a1.jpg" target="_blank"><img alt="HTML总结1【转】_第17张图片" src="http://img.e-com-net.com/image/info8/baec2337f248409d8adc3c8634d5b0a1.jpg" width="650" height="150" style="border:1px solid black;"></a></p> <p><a href="http://img.e-com-net.com/image/info8/7b45bcb3de1c406c80e4b833bb5aff85.jpg" target="_blank"><img alt="HTML总结1【转】_第18张图片" src="http://img.e-com-net.com/image/info8/7b45bcb3de1c406c80e4b833bb5aff85.jpg" width="650" height="163" style="border:1px solid black;"></a></p> <p style="text-align:center;"><a href="http://img.e-com-net.com/image/info8/19f54b2b8ea745e5b4af64d364eebf66.jpg" target="_blank"><img alt="HTML总结1【转】_第19张图片" src="http://img.e-com-net.com/image/info8/19f54b2b8ea745e5b4af64d364eebf66.jpg" width="650" height="176" style="border:1px solid black;"></a>  </p> <p>  使用样式的第三种方法是使用外部样式表(external css),当样式需要被应用到很多页面的时候,外部样式表将是理想的选择。使用外部样式表,你就可以通过更改一个样式文件来改变整个站点的外观:</p> <p style="text-align:center;"><a href="http://img.e-com-net.com/image/info8/294b39cbd1c04d28b13c431f1fadba71.jpg" target="_blank"><img alt="HTML总结1【转】_第20张图片" src="http://img.e-com-net.com/image/info8/294b39cbd1c04d28b13c431f1fadba71.jpg" width="650" height="229" style="border:1px solid black;"></a></p> <p> 如下为为上面使用的csstest.css样式文件:</p> <div> <div> <div></div> </div> </div> <div> <div> <div> <a href="http://img.e-com-net.com/image/info8/2eb24cb50f6346b98fb1fe4ac7bc608b.png" target="_blank"><img alt="HTML总结1【转】_第21张图片" src="http://img.e-com-net.com/image/info8/2eb24cb50f6346b98fb1fe4ac7bc608b.png" width="213" height="377" style="border:1px solid black;"></a> </div> </div> </div> <p style="text-align:center;"><a href="http://img.e-com-net.com/image/info8/b786886bc9e44ea6821eba1eb6a6c0c0.jpg" target="_blank"><img alt="HTML总结1【转】_第22张图片" src="http://img.e-com-net.com/image/info8/b786886bc9e44ea6821eba1eb6a6c0c0.jpg" width="650" height="175" style="border:1px solid black;"></a></p> <p><strong> 四、id与class</strong></p> <p>  可以为 <span> 应用 id 或 class 属性,这样便于对 span 应用外部样式。id、class、style属于HTML全局属性,即除了<span>外可以在所有HTML 元素中使用的属性(其它全局属性参见:HTML 全局属性)。class与id的主要差异是,class 用于元素组(类似的元素,或者可以理解为某一类元素),而 id 用于标识单独的唯一的元素(一个 HTML文档中不能存在拥有相同 id 的元素)。如下所示,我们通过<span>为"提示"文本设置了单独的样式:红色加粗显示,其它地方文本也想设置这一样式的话,同样使用<span>对其包围,然后使用class="tip"属性即可:</p> <p style="text-align:center;"><a href="http://img.e-com-net.com/image/info8/6f9edd5afb484faf9d9538e70123d59a.jpg" target="_blank"><img alt="HTML总结1【转】_第23张图片" src="http://img.e-com-net.com/image/info8/6f9edd5afb484faf9d9538e70123d59a.jpg" width="650" height="461" style="border:1px solid black;"></a></p> <p style="text-align:center;"><a href="http://img.e-com-net.com/image/info8/e702dfa621084105953c9a4bfabce9f3.jpg" target="_blank"><img alt="HTML总结1【转】_第24张图片" src="http://img.e-com-net.com/image/info8/e702dfa621084105953c9a4bfabce9f3.jpg" width="501" height="242" style="border:1px solid black;"></a></p> <p></p> <p>  也可以用 id 或 class 来标记 <div>, 如下所示,两个div块通过使用同一个div class,使这两个块中的元素使用相同的外部样式:</p> <p> <a href="http://img.e-com-net.com/image/info8/9ab2642c0ac34c59acce6a905c7baf31.jpg" target="_blank"><img alt="HTML总结1【转】_第25张图片" src="http://img.e-com-net.com/image/info8/9ab2642c0ac34c59acce6a905c7baf31.jpg" width="368" height="481" style="border:1px solid black;"></a></p> <p>  如下所示,如果不对 span/div 应用样式,那么span/div中元素会正常的默认显示,但实际上span/div仍然增加了额外的结构,它们指示了一些元素是属于一个块里的(将这些元素进行了结构化):</p> <p style="text-align:center;"><a href="http://img.e-com-net.com/image/info8/ee68fd4a2a6f4512a33ecb957ab20813.jpg" target="_blank"><img alt="HTML总结1【转】_第26张图片" src="http://img.e-com-net.com/image/info8/ee68fd4a2a6f4512a33ecb957ab20813.jpg" width="306" height="261" style="border:1px solid black;"></a></p> <p>   div/span 通过与 id、class 、role 属性配合,提供了向html文档添加额外结构的机制,如果这个结构是通用的话使用class属性,如果这个结构是特定块使用的话使用id属性,id 属性为一个元素或多个元素(div块)分配一个唯一的名字,class属性则适合被多次使用的情况。id/class 的值必须以字母或者下划线开始,不能以数字开始且大小写敏感,值中不能出现空格,最好也不要使用下划线( CSS2.0(以及某些浏览器)中的限制)。</p> <p>  前面说过id、class、style属于全局属性,所以除了div和span,它们还可以应用到h和p等元素:</p> <p style="text-align:center;"><a href="http://img.e-com-net.com/image/info8/f91a697cd9254ba3b39af655095dcb44.jpg" target="_blank"><img alt="HTML总结1【转】_第27张图片" src="http://img.e-com-net.com/image/info8/f91a697cd9254ba3b39af655095dcb44.jpg" width="650" height="137" style="border:1px solid black;"></a></p> <p>   如下所示的三个div分别标识了网页上的头部、导航栏、侧边栏三个块,导航栏实际上是一个菜单,所以将ul列表的id属性值设置为menu:</p> <p style="text-align:center;"><a href="http://img.e-com-net.com/image/info8/30922f9ba4cd43f8a270aef1a3a5414f.jpg" target="_blank"><img alt="HTML总结1【转】_第28张图片" src="http://img.e-com-net.com/image/info8/30922f9ba4cd43f8a270aef1a3a5414f.jpg" width="650" height="267" style="border:1px solid black;"></a></p> <p style="text-align:center;"> <a href="http://img.e-com-net.com/image/info8/e32385023ddf49b49ce7ed12cf4f66fd.jpg" target="_blank"><img alt="HTML总结1【转】_第29张图片" src="http://img.e-com-net.com/image/info8/e32385023ddf49b49ce7ed12cf4f66fd.jpg" width="650" height="523" style="border:1px solid black;"></a></p> <p><strong> 五、html布局</strong>  </p> <p>  <div> 元素常用作布局工具,因为能够轻松地通过 CSS 对其进行定位。如下所示,可以直接使用div块来实现一个色块,这三个色块又在名为outside的div块中,outside块通过内部样式表来设置样式,每个色块又可以单独设置其样式,通过内部样式表和style样式属性。可以看到,outside块的高度会自动使用三个内部div块的高度和,而outside的宽度在没有指定的时候会使用body的宽度:</p> <p style="text-align:center;"><a href="http://img.e-com-net.com/image/info8/3856b2da94884fad88b05838e39085d6.jpg" target="_blank"><img alt="HTML总结1【转】_第30张图片" src="http://img.e-com-net.com/image/info8/3856b2da94884fad88b05838e39085d6.jpg" width="650" height="160" style="border:1px solid black;"></a></p> <p>   从上面可以看到,我们可以通过样式表来设置一些通用的样式,比如每个色块使用的inside来实现相同的大小,同时还可以对每个元素设置单独的样式,比如通过色块的style属性来设置色块的单独颜色。如下所示,我们可以再增加一个标题h1,可以看到,div使用的样式表中的border样式并不会应用到div块中的所有元素(色块和h1并没有红色的边框),而是被本div块所使用:</p> <p style="text-align:center;"><a href="http://img.e-com-net.com/image/info8/bfd2e0f309bb43ae93076734dccd6396.jpg" target="_blank"><img alt="HTML总结1【转】_第31张图片" src="http://img.e-com-net.com/image/info8/bfd2e0f309bb43ae93076734dccd6396.jpg" width="650" height="177" style="border:1px solid black;"></a></p> <p>   从上面可以看到,div块和标题h都会换行显示(标题h还会存在默认的margin-top和margin-bottom),如果我们想要这三个色块在同一行显示的话,可以通过display属性将div设置为行内模式(div默认是单行显示:一个div一行,两个div两行...),这样这三个div块就会在一个行内而不是每个div都是一行,如下所示:</p> <p style="text-align:center;"><a href="http://img.e-com-net.com/image/info8/5c134a0bcf364219b2f8fc818f7545af.jpg" target="_blank"><img alt="HTML总结1【转】_第32张图片" src="http://img.e-com-net.com/image/info8/5c134a0bcf364219b2f8fc818f7545af.jpg" width="650" height="186" style="border:1px solid black;"></a></p> <p>   下面为将外边的div块设置行内模式的效果,可以看到其宽度会自动使用内部div块的宽度而不是body的宽度:</p> <p style="text-align:center;"><a href="http://img.e-com-net.com/image/info8/777f547d0cf541c5b8088dcc93e65c08.jpg" target="_blank"><img alt="HTML总结1【转】_第33张图片" src="http://img.e-com-net.com/image/info8/777f547d0cf541c5b8088dcc93e65c08.jpg" width="650" height="253" style="border:1px solid black;"></a></p> <p>  虽然使用display可以实现模块的一些布局,但有时候会有一些问题,比如上面三个水平的色块中会有一些空隙,因为div中间存在的换行符,我们可以将outside中添加font - size: 0px就可以消除这些空隙,但是一般我们会使用下面的float来实现精准的布局。 </p> <p>  float就是浮动的意思,它可以使某一模块脱离外部的限制来成为一个新的块,其值有left(向左浮动)、right、none(不浮动,默认)、inherit(从父元素继承)。如下使用float使三个色块并排显示,可以看到,因为三个色块跳出了原来的div块,所以原来的div块里就没了元素,所以只留下了红色的边框:</p> <p style="text-align:center;"><a href="http://img.e-com-net.com/image/info8/7b426e8171654069a4fc4c903a5ef1d9.jpg" target="_blank"><img alt="HTML总结1【转】_第34张图片" src="http://img.e-com-net.com/image/info8/7b426e8171654069a4fc4c903a5ef1d9.jpg" width="650" height="166" style="border:1px solid black;"></a></p> <p>   </p> <p>  可以在outside中添加高度样式属性,这样就能撑起外边的div块了:</p> <p style="text-align:center;"><a href="http://img.e-com-net.com/image/info8/ddc85e6a0fb04691bcece7fa0056fd2f.jpg" target="_blank"><img alt="HTML总结1【转】_第35张图片" src="http://img.e-com-net.com/image/info8/ddc85e6a0fb04691bcece7fa0056fd2f.jpg" width="650" height="168" style="border:1px solid black;"></a></p> <p>  如下所示,如果我们仅对第一个div块使用float:left的话,那么第二个div块的起始位置会与第一个div块重合(因为第一个div块浮动出来了):</p> <p style="text-align:center;"><a href="http://img.e-com-net.com/image/info8/3cd3aca25d914e14b6904ad30f1b7d8c.jpg" target="_blank"><img alt="HTML总结1【转】_第36张图片" src="http://img.e-com-net.com/image/info8/3cd3aca25d914e14b6904ad30f1b7d8c.jpg" width="650" height="155" style="border:1px solid black;"></a></p> <p>  而如果第一个div块后面紧跟的不是div块而是一个p或者h等元素的话,那么这个p会在div块的右边展示,因为float的浮动是相对于div块来说的: </p> <p><a href="http://img.e-com-net.com/image/info8/8fbbfd04b92c40d3ab7abf421fe75c43.jpg" target="_blank"><img alt="HTML总结1【转】_第37张图片" src="http://img.e-com-net.com/image/info8/8fbbfd04b92c40d3ab7abf421fe75c43.jpg" width="650" height="154" style="border:1px solid black;"></a></p> <p>  如果我们想要上面的p元素在最左边展示,那么可以使用clear属性,如下所示。clear属性规定了元素的哪一侧不允许出现浮动元素,值为left/right表示左边/右边不允许浮动元素,both表示左边跟右边都不允许浮动元素,inherit表示从父元素继承 clear 属性的值,none表示允许浮动(默认值)。</p> <p style="text-align:center;"><a href="http://img.e-com-net.com/image/info8/e87a26d6499144b6968f7a75872250f1.jpg" target="_blank"><img alt="HTML总结1【转】_第38张图片" src="http://img.e-com-net.com/image/info8/e87a26d6499144b6968f7a75872250f1.jpg" width="650" height="162" style="border:1px solid black;"></a></p> <p>   下面的h1在一个div中,默认div是单行模式,所以h1会占一行,而且h1没有设置长度,所以其长度为整行(去除margin) 。第二个div和第三个idv因为使用了左浮动,所以其靠左展示,第四个div使用了clear并且设置了both值,所以其会被放置nav和section的下边:</p> <pre><code class="language-html"><!DOCTYPE html> <html> <head> <body bgcolor=#7fffd4> <style> #header { background-color:black; color:white; text-align:center; <!--文本对齐方式:居中--> padding:5px; } #nav { line-height:30px; <!--行高--> background-color:#eeeeee; height:300px; <!--整个块的高度--> width:100px; <!--整个块的宽度--> float:left; padding:5px; } #section { background-color:#faebd7; width:350px; float:left; padding:10px; } #footer { background-color:black; color:white; clear:both; text-align:center; padding:5px; } </style> </head> <body> <div id="header"> <h1>City Gallery</h1> </div> <div id="nav"> London<br> Paris<br> Tokyo<br> </div> <div id="section"> <h2>London</h2> <p> London is the capital city of England. It is the most populous city in the United Kingdom, with a metropolitan area of over 13 million inhabitants. </p> </div> <p>测试数据</p> <div id="footer"> Copyright ? W3Schools.com </div> </body> </html> </code></pre> <p style="text-align:center;"><a href="http://img.e-com-net.com/image/info8/a1df48080ba04a519b286bed5e4cc8e1.jpg" target="_blank"><img alt="HTML总结1【转】_第39张图片" src="http://img.e-com-net.com/image/info8/a1df48080ba04a519b286bed5e4cc8e1.jpg" width="650" height="538" style="border:1px solid black;"></a></p> <p>   还可以使用<header>, <nav>, <section>, 以及 <footer>这些语义元素标签来进行布局,下面的代码可以实现与上面相同的效果:</p> <table> <tbody> <tr> <td>header</td> <td>定义文档或节的页眉</td> </tr> <tr> <td>nav</td> <td>定义导航链接的容器</td> </tr> <tr> <td>section</td> <td>定义文档中的节</td> </tr> <tr> <td>article</td> <td>定义独立的自包含文章</td> </tr> <tr> <td>aside</td> <td>定义内容之外的内容(比如侧栏)</td> </tr> <tr> <td>footer</td> <td>定义文档或节的页脚</td> </tr> <tr> <td>details</td> <td>定义额外的细节</td> </tr> <tr> <td>summary</td> <td>定义 details 元素的标题</td> </tr> </tbody> </table> <pre><code class="language-html"><!DOCTYPE html> <html> <head> <body bgcolor=#7fffd4> <style> header { background-color:black; color:white; text-align:center; padding:5px; } nav { line-height:30px; background-color:#eeeeee; height:300px; width:100px; float:left; padding:5px; } section { background-color:#faebd7; width:350px; float:left; padding:10px; } footer { background-color:black; color:white; clear:both; text-align:center; padding:5px; } </style> </head> <body> <header> <h1>City Gallery</h1> </header> <nav> London<br> Paris<br> Tokyo<br> </nav> <section> <h1>London</h1> <p> London is the capital city of England. It is the most populous city in the United Kingdom, with a metropolitan area of over 13 million inhabitants. </p> </section> <p>测试数据</p> <footer> Copyright W3Schools.com </footer> </body> </html> </code></pre> <p>  可以使用position来设置元素的位置,如下所示将按钮的位置设置为在右下角指定位置显示。如果想要鼠标滚动的时候按钮也不跟着滚动还是固定在右下角现实的话,使用fixed替换absolute(比如一些网站会将一张宣传图片固定显示在top,鼠标滚动的话该图片也不会移动,这就是使用fixed的效果)。其中的cursor:pointer设置按钮的鼠标光标形状为小手,text-align:right设置按钮文本为右对齐显示:</p> <p><a href="http://img.e-com-net.com/image/info8/2added2b58894f618a7ae58e4356f73a.jpg" target="_blank"><img alt="HTML总结1【转】_第40张图片" src="http://img.e-com-net.com/image/info8/2added2b58894f618a7ae58e4356f73a.jpg" width="650" height="169" style="border:1px solid black;"></a></p> </div> </div> </div> </div> </div> <!--PC和WAP自适应版--> <div id="SOHUCS" sid="1694600266017484800"></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"> <!-- 文章页-右侧1 动态广告位 --> <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> <!-- 文章页-右侧2 动态广告位 --> <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> <!-- 文章页-右侧3 动态广告位 --> <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,html,前端)</h4> <div id="paradigm-article-related"> <div class="recommend-post mb30"> <ul class="widget-links"> <li><a href="/article/1950232820773351424.htm" title="移动端城市区县二级联动选择功能实现包" target="_blank">移动端城市区县二级联动选择功能实现包</a> <span class="text-muted">good2know</span> <div>本文还有配套的精品资源,点击获取简介:本项目是一套为移动端设计的jQuery实现方案,用于简化用户在选择城市和区县时的流程。它包括所有必需文件:HTML、JavaScript、CSS及图片资源。通过动态更新下拉菜单选项,实现城市到区县的联动效果,支持数据异步加载。开发者可以轻松集成此功能到移动网站或应用,并可基于需求进行扩展和优化。1.jQuery移动端解决方案概述jQuery技术简介jQuery</div> </li> <li><a href="/article/1950232190038110208.htm" title="day15|前端框架学习和算法" target="_blank">day15|前端框架学习和算法</a> <span class="text-muted">universe_01</span> <a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/%E7%AE%97%E6%B3%95/1.htm">算法</a><a class="tag" taget="_blank" href="/search/%E7%AC%94%E8%AE%B0/1.htm">笔记</a> <div>T22括号生成先把所有情况都画出来,然后(在满足什么情况下)把不符合条件的删除。T78子集要画树状图,把思路清晰。可以用暴力法、回溯法和DFS做这个题DFS深度搜索:每个边都走完,再回溯应用:二叉树搜索,图搜索回溯算法=DFS+剪枝T200岛屿数量(非常经典BFS宽度把树状转化成队列形式,lambda匿名函数“一次性的小函数,没有名字”setup语法糖:让代码更简洁好写的语法ref创建:基本类型的</div> </li> <li><a href="/article/1950225381961297920.htm" title="SpringMVC的执行流程" target="_blank">SpringMVC的执行流程</a> <span class="text-muted"></span> <div>1、什么是MVCMVC是一种设计模式。MVC的原理图如下所示M-Model模型(完成业务逻辑:有javaBean构成,service+dao+entity)V-View视图(做界面的展示jsp,html……)C-Controller控制器(接收请求—>调用模型—>根据结果派发页面2、SpringMVC是什么SpringMVC是一个MVC的开源框架,SpringMVC=Struts2+Spring,</div> </li> <li><a href="/article/1950208989954371584.htm" title="Selenium 特殊控件操作与 ActionChains 实践详解" target="_blank">Selenium 特殊控件操作与 ActionChains 实践详解</a> <span class="text-muted">小馋喵知识杂货铺</span> <a class="tag" taget="_blank" href="/search/selenium/1.htm">selenium</a><a class="tag" taget="_blank" href="/search/%E6%B5%8B%E8%AF%95%E5%B7%A5%E5%85%B7/1.htm">测试工具</a> <div>1.下拉框单选操作(a)使用SeleniumSelect类(标准HTML标签)Selenium提供了内置的Select类用于操作标准下拉框,这种方式简单且直观。fromselenium.webdriver.support.uiimportSelect#定位下拉框dropdown=Select(driver.find_element("id","dropdown_id"))#通过以下三种方式选择单个</div> </li> <li><a href="/article/1950207097413103616.htm" title="微信公众号回调java_处理微信公众号消息回调" target="_blank">微信公众号回调java_处理微信公众号消息回调</a> <span class="text-muted">weixin_39607620</span> <a class="tag" taget="_blank" href="/search/%E5%BE%AE%E4%BF%A1%E5%85%AC%E4%BC%97%E5%8F%B7%E5%9B%9E%E8%B0%83java/1.htm">微信公众号回调java</a> <div>1、背景在上一节中,咱们知道如何接入微信公众号,可是以后公众号会与咱们进行交互,那么微信公众号如何通知到咱们本身的服务器呢?咱们知道咱们接入的时候提供的url是GET/mp/entry,那么公众号以后产生的事件将会以POST/mp/entry发送到咱们本身的服务器上。html2、代码实现,此处仍是使用weixin-java-mp这个框架实现一、引入weixin-java-mpcom.github.</div> </li> <li><a href="/article/1950201094361640960.htm" title="人工智能应用研究快讯 2021-11-30" target="_blank">人工智能应用研究快讯 2021-11-30</a> <span class="text-muted">峰谷皆平</span> <div>[HTML]ArtificialIntelligenceforSkinCancerDetection:ScopingReviewATakiddin,JSchneider,YYang,AAbd-Alrazaq...JournalofMedicalInternet...,2021ABSTACT:Background:Skincanceristhemostcommoncancertypeaffectin</div> </li> <li><a href="/article/1950195876991397888.htm" title="【Jupyter】个人开发常见命令" target="_blank">【Jupyter】个人开发常见命令</a> <span class="text-muted">TIM老师</span> <a class="tag" taget="_blank" href="/search/%23/1.htm">#</a><a class="tag" taget="_blank" href="/search/Pycharm/1.htm">Pycharm</a><a class="tag" taget="_blank" href="/search/%26amp%3B/1.htm">&</a><a class="tag" taget="_blank" href="/search/VSCode/1.htm">VSCode</a><a class="tag" taget="_blank" href="/search/python/1.htm">python</a><a class="tag" taget="_blank" href="/search/Jupyter/1.htm">Jupyter</a> <div>1.查看python版本importsysprint(sys.version)2.ipynb/py文件转换jupyternbconvert--topythonmy_file.ipynbipynb转换为mdjupyternbconvert--tomdmy_file.ipynbipynb转为htmljupyternbconvert--tohtmlmy_file.ipynbipython转换为pdfju</div> </li> <li><a href="/article/1950194742100815872.htm" title="用代码生成艺术字:设计个性化海报的秘密" target="_blank">用代码生成艺术字:设计个性化海报的秘密</a> <span class="text-muted"></span> <div>本文围绕“用代码生成艺术字:设计个性化海报的秘密”展开,先概述代码生成艺术字在海报设计中的独特价值,接着介绍常用的代码工具(如HTML、CSS、JavaScript等),详细阐述从构思到实现的完整流程,包括字体样式设计、动态效果添加等,还分享了提升艺术字质感的技巧及实际案例。最后总结代码生成艺术字的优势,为设计师提供打造个性化海报的实用指南,助力提升海报设计的独特性与吸引力,符合搜索引擎SEO标准</div> </li> <li><a href="/article/1950191208873652224.htm" title="vue element 封装表单" target="_blank">vue element 封装表单</a> <span class="text-muted">影子信息</span> <a class="tag" taget="_blank" href="/search/vue/1.htm">vue</a><a class="tag" taget="_blank" href="/search/vue.js/1.htm">vue.js</a><a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a> <div>背景:在前端系统开发中,系统页面涉及到的表单组件比较多,所以进行了简单的封装。封装的包括一些Form表单组件,如下:input输入框、select下拉框、等实现效果:理论知识:表单组件官方链接:点击跳转封装组件:封装组件的思路:不封装element组件,每一个input组件绑定一个form对象,例如官网。简单封装element组件,利用for循环生成form表单的每一项el-form-item。进</div> </li> <li><a href="/article/1950191165710069760.htm" title="前端面试每日 3+1 —— 第39天" target="_blank">前端面试每日 3+1 —— 第39天</a> <span class="text-muted">浪子神剑</span> <div>今天的面试题(2019.05.25)——第39天[html]title与h1、b与strong、i与em的区别分别是什么?[css]写出你知道的CSS水平和垂直居中的方法[js]说说你对模块化的理解[软技能]公钥加密和私钥加密是什么?《论语》,曾子曰:“吾日三省吾身”(我每天多次反省自己)。前端面试每日3+1题,以面试题来驱动学习,每天进步一点!让努力成为一种习惯,让奋斗成为一种享受!欢迎在Iss</div> </li> <li><a href="/article/1950187223672483840.htm" title="GDP经济社会人文民生栅格数据下载网站汇总" target="_blank">GDP经济社会人文民生栅格数据下载网站汇总</a> <span class="text-muted">疯狂学习GIS</span> <div>  本文为“GIS数据获取整理”专栏(https://blog.csdn.net/zhebushibiaoshifu/category_10857546.html)中第八篇独立博客,因此本文全部标题均由“8”开头。本文对目前主要的GDP、社会与经济数据获取网站加以整理与介绍,若需其它GIS领域数据(如遥感影像数据、气象数据、土地土壤数据、农业数据等),大家可以点击上方专栏查看,也可以看这一篇汇总文</div> </li> <li><a href="/article/1950180497007112192.htm" title="【MySQL】MySQL数据库如何改名" target="_blank">【MySQL】MySQL数据库如何改名</a> <span class="text-muted">武昌库里写JAVA</span> <a class="tag" taget="_blank" href="/search/%E9%9D%A2%E8%AF%95%E9%A2%98%E6%B1%87%E6%80%BB%E4%B8%8E%E8%A7%A3%E6%9E%90/1.htm">面试题汇总与解析</a><a class="tag" taget="_blank" href="/search/spring/1.htm">spring</a><a class="tag" taget="_blank" href="/search/boot/1.htm">boot</a><a class="tag" taget="_blank" href="/search/vue.js/1.htm">vue.js</a><a class="tag" taget="_blank" href="/search/sql/1.htm">sql</a><a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/%E5%AD%A6%E4%B9%A0/1.htm">学习</a> <div>MySQL建库授权语句https://www.jianshu.com/p/2237a9649ceeMySQL数据库改名的三种方法https://www.cnblogs.com/gomysql/p/3584881.htmlMySQL安全修改数据库名几种方法https://blog.csdn.net/haiross/article/details/51282417MySQL重命名数据库https://</div> </li> <li><a href="/article/1950178477592342528.htm" title="前端数据库:IndexedDB从基础到高级使用指南" target="_blank">前端数据库:IndexedDB从基础到高级使用指南</a> <span class="text-muted"></span> <div>文章目录前端数据库:IndexedDB从基础到高级使用指南引言一、IndexedDB概述1.1什么是IndexedDB1.2与其他存储方案的比较二、基础使用2.1打开/创建数据库2.2基本CRUD操作添加数据读取数据更新数据删除数据三、高级特性3.1复杂查询与游标3.2事务高级用法3.3性能优化技巧四、实战案例:构建离线优先的待办事项应用4.1数据库设计4.2同步策略实现五、常见问题与解决方案5.</div> </li> <li><a href="/article/1950169524384886784.htm" title="【Java Web实战】从零到一打造企业级网上购书网站系统 | 完整开发实录(三)" target="_blank">【Java Web实战】从零到一打造企业级网上购书网站系统 | 完整开发实录(三)</a> <span class="text-muted">笙囧同学</span> <a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/%E7%8A%B6%E6%80%81%E6%A8%A1%E5%BC%8F/1.htm">状态模式</a> <div>核心功能设计用户管理系统用户管理是整个系统的基础,我设计了完整的用户生命周期管理:用户注册流程验证失败验证通过验证失败验证通过用户名已存在用户名可用失败成功用户访问注册页面填写注册信息前端表单验证显示错误提示提交到后端后端数据验证返回错误信息用户名唯一性检查提示用户名重复密码加密处理保存用户信息保存成功?显示系统错误注册成功跳转登录页面登录认证机制深度解析我实现了一套企业级的多层次安全认证机制:认</div> </li> <li><a href="/article/1950169526440095744.htm" title="从零到一:打造基于GigaChat AI的艺术创作平台 | 笙囧同学的全栈开发实战" target="_blank">从零到一:打造基于GigaChat AI的艺术创作平台 | 笙囧同学的全栈开发实战</a> <span class="text-muted"></span> <div>作者简介:笙囧同学,中科院计算机大模型方向硕士,全栈开发爱好者联系方式:3251736703@qq.com各大平台账号:笙囧同学座右铭:偷懒是人生进步的阶梯前言在AI技术飞速发展的今天,如何将前沿的大模型技术与实际应用相结合,一直是我们开发者关注的焦点。今天,笙囧同学将带大家从零开始,构建一个基于GigaChatAI的艺术创作平台,实现React前端+Django后端的完整全栈解决方案。这不仅仅是</div> </li> <li><a href="/article/1950164483057971200.htm" title="14.tornado操作之应用Websocket协议实现聊天室功能" target="_blank">14.tornado操作之应用Websocket协议实现聊天室功能</a> <span class="text-muted">孤寒者</span> <a class="tag" taget="_blank" href="/search/Tornado%E6%A1%86%E6%9E%B6%E4%BB%8E%E5%85%A5%E9%97%A8%E5%88%B0%E5%AE%9E%E6%88%98/1.htm">Tornado框架从入门到实战</a><a class="tag" taget="_blank" href="/search/websocket/1.htm">websocket</a><a class="tag" taget="_blank" href="/search/tornado/1.htm">tornado</a><a class="tag" taget="_blank" href="/search/%E8%81%8A%E5%A4%A9%E5%AE%A4%E5%8A%9F%E8%83%BD%E5%AE%9E%E7%8E%B0/1.htm">聊天室功能实现</a><a class="tag" taget="_blank" href="/search/python/1.htm">python</a> <div>目录:每篇前言:1.什么是WebSocket(1)定义(2)优点(3)和HTTP对比(4)适用场景2.WebSocket关键方法3.本tornado项目中使用WebSocket(1)准备一个聊天室的页面:第一步:编写视图:第二步:编写接口:(app.py中加入以下接口!)第三步:编写前端页面:测试接口——响应OK!(2)使用WebSocket:(3)聊天室的聊天功能的最终实现:第一步:战前准备第二</div> </li> <li><a href="/article/1950144218282389504.htm" title="为什么学习Web前端一定要掌握JavaScript?" target="_blank">为什么学习Web前端一定要掌握JavaScript?</a> <span class="text-muted">web前端学习指南</span> <div>为什么学习Web前端一定要掌握JavaScript?在前端的世界里,没有什么是JavaScript实现不了的,关于JS有一句话:凡是可以用JavaScript来写的应用,最终都会用JavaScript,JavaScript可运行在所有主要平台的所有主流浏览器上,也可运行在每一个主流操作系统的服务器端上。现如今我们在为网站写任何一个主要功能的时候都需要有懂能够用JavaScript写前端的开发人员。</div> </li> <li><a href="/article/1950143305194991616.htm" title="小架构step系列25:错误码" target="_blank">小架构step系列25:错误码</a> <span class="text-muted">秋千码途</span> <a class="tag" taget="_blank" href="/search/%E6%9E%B6%E6%9E%84/1.htm">架构</a><a class="tag" taget="_blank" href="/search/java/1.htm">java</a> <div>1概述一个系统中,可能产生各种各样的错误,对这些错误进行编码。当错误发生时,通过这个错误码就有可能快速判断是什么错误,不一定需要查看代码就可以进行处理,提高问题处理效率。有了统一的错误码,还可以标准化错误信息,方便把错误信息纳入文档管理和对错误信息进行国际化等。没有错误码的管理,开发人员就会按自己的理解处理这些错误。有些直接把堆栈直接反馈到前端页面上,使用看不懂这些信息体验很差,也暴露了堆栈信息有</div> </li> <li><a href="/article/1950140903616212992.htm" title="Java朴实无华按天计划从入门到实战(强化速战版-66天)" target="_blank">Java朴实无华按天计划从入门到实战(强化速战版-66天)</a> <span class="text-muted">岫珩</span> <a class="tag" taget="_blank" href="/search/Java/1.htm">Java</a><a class="tag" taget="_blank" href="/search/%E5%90%8E%E7%AB%AF/1.htm">后端</a><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><a class="tag" taget="_blank" href="/search/%E5%AD%A6%E4%B9%A0/1.htm">学习</a><a class="tag" taget="_blank" href="/search/Java/1.htm">Java</a><a class="tag" taget="_blank" href="/search/%E6%97%B6%E9%97%B4%E5%AE%89%E6%8E%92/1.htm">时间安排</a><a class="tag" taget="_blank" href="/search/%E5%AD%A6%E4%B9%A0%E8%AE%A1%E5%88%92/1.htm">学习计划</a> <div>致敬读者感谢阅读笑口常开生日快乐⬛早点睡觉博主相关博主信息博客首页专栏推荐活动信息文章目录Java朴实无华按天计划从入门到实战(强化速战版-66天)1.基础(18)1.1JavaSE核心(5天)1.2数据库与SQL(5天)1.3前端基础(8天)2.进阶(17天)2.1JavaWeb核心(5天)2.2Mybatis与Spring全家桶(6天)2.3中间件入门(4天)2.4实践项目(2天)3.高阶(1</div> </li> <li><a href="/article/1950132204336115712.htm" title="《跨域资源共享CORS的深层逻辑与前端实践精要》" target="_blank">《跨域资源共享CORS的深层逻辑与前端实践精要》</a> <span class="text-muted"></span> <div>不同源头的资源交互已成为常态,而跨域资源共享(CORS)正是支撑这种交互的隐形架构。现代Web安全体系中平衡开放与防护的精妙设计。理解CORS的深层逻辑,不仅能解决实际开发中的跨域难题,更能触及网络安全与资源流通的核心矛盾,为前端工程师构建稳健的应用提供底层认知支撑。跨域资源共享的诞生,源于网络安全与应用发展的必然冲突。浏览器的同源策略,作为早期网络安全的基石,通过限制不同源文档的交互,有效阻挡了</div> </li> <li><a href="/article/1950131321980383232.htm" title="深入了解 Kubernetes(k8s):从概念到实践" target="_blank">深入了解 Kubernetes(k8s):从概念到实践</a> <span class="text-muted"></span> <div>目录一、k8s核心概念二、k8s的优势三、k8s架构组件控制平面组件节点组件四、k8s+docker运行前后端分离项目的例子1.准备前端项目2.准备后端项目3.创建k8s部署配置文件4.部署应用到k8s集群在当今云计算和容器化技术飞速发展的时代,Kubernetes(简称k8s)已成为容器编排领域的事实标准。无论是互联网巨头、传统企业还是初创公司,都在广泛采用k8s来管理和部署容器化应用。本文将带</div> </li> <li><a href="/article/1950130722157162496.htm" title="移动端适配rem方案" target="_blank">移动端适配rem方案</a> <span class="text-muted">简单的码农</span> <div>1.rem+动态html的font-size1.rem单位是相对于html元素的font-size来设置的,那么如果我们需要在不同的屏幕下有不同的尺寸,可以动态的修改html的font-size尺寸。2.比如如下案例:设置一个盒子的宽度是2rem;设置不同的屏幕上html的font-size不同;image这样在开发中,我们只需要考虑两个问题:问题一:针对不同的屏幕,设置html不同的font-s</div> </li> <li><a href="/article/1950130692448907264.htm" title="Vue CSR 到 Nuxt 3 SSR 迁移:技术实现与问题解决实录" target="_blank">Vue CSR 到 Nuxt 3 SSR 迁移:技术实现与问题解决实录</a> <span class="text-muted">二倍速播放</span> <a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/vue.js/1.htm">vue.js</a> <div>1.迁移动机与技术选型1.1CSR架构的局限性基于Vue3和Vite构建的客户端渲染(CSR)单页应用(SPA)提供了良好的开发体验和用户交互流畅性。但是其核心局限在于:搜索引擎优化(SEO):初始HTML响应仅包含一个根div元素,实际内容由JavaScript在浏览器端动态生成。虽然主流搜索引擎(如Google)能够执行部分JavaScript,但其抓取效率和稳定性不如直接获取完整HTML。非</div> </li> <li><a href="/article/1950127794931429376.htm" title="redis反弹shell时kali无法接收回弹的解决方法" target="_blank">redis反弹shell时kali无法接收回弹的解决方法</a> <span class="text-muted">显哥无敌</span> <a class="tag" taget="_blank" href="/search/shell/1.htm">shell</a><a class="tag" taget="_blank" href="/search/redis/1.htm">redis</a> <div>无法接受回谈大概率是bash命令写的不对,那个crontab中间的星号个数是有意义的,不是随便加的,下面贴一下crontab的基本用法https://www.cnblogs.com/zhoading/p/11572630.html{minute}{hour}{day-of-month}{month}{day-of-week}{full-path-to-shell-script}如果是要cronta</div> </li> <li><a href="/article/1950121289456873472.htm" title="native.js设置可缩放的webview并隐藏缩放控件" target="_blank">native.js设置可缩放的webview并隐藏缩放控件</a> <span class="text-muted">Nanayai</span> <div>需求明确:webview页面可以手指缩放,并且不要那个原生控件;实现思路:1.使用h5+封装好的方法:设置scalable属性,并在html中设置meta标签:user-scalable=yes或不设置,minimum-scale和maximum-scale需要注意不要都设为1:mui.openWindow({url:"someThing",id:"someThing",styles:{scala</div> </li> <li><a href="/article/1950119224630374400.htm" title="大厂都在用的前端缓存策略,你掌握了吗?" target="_blank">大厂都在用的前端缓存策略,你掌握了吗?</a> <span class="text-muted">AI架构全栈开发实战笔记</span> <a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/%E7%BC%93%E5%AD%98/1.htm">缓存</a><a class="tag" taget="_blank" href="/search/ai/1.htm">ai</a> <div>大厂都在用的前端缓存策略,你掌握了吗?关键词:前端缓存、HTTP缓存、ServiceWorker、CDN缓存、缓存策略、性能优化、浏览器缓存摘要:本文将深入探讨前端开发中常用的缓存策略,从浏览器缓存到ServiceWorker,从HTTP缓存头到CDN缓存,全面解析大厂都在使用的高效缓存技术。通过生动的比喻和实际代码示例,帮助开发者理解并掌握这些提升Web应用性能的关键技术。背景介绍目的和范围本文</div> </li> <li><a href="/article/1950117078799282176.htm" title="Redis反弹Shell" target="_blank">Redis反弹Shell</a> <span class="text-muted">波吉爱睡觉</span> <a class="tag" taget="_blank" href="/search/web%E5%AE%89%E5%85%A8/1.htm">web安全</a><a class="tag" taget="_blank" href="/search/%23%E6%9C%AA%E6%8E%88%E6%9D%83%E8%AE%BF%E9%97%AE%E6%BC%8F%E6%B4%9E/1.htm">#未授权访问漏洞</a><a class="tag" taget="_blank" href="/search/%23SSRF/1.htm">#SSRF</a><a class="tag" taget="_blank" href="/search/redis/1.htm">redis</a><a class="tag" taget="_blank" href="/search/%E7%BD%91%E7%BB%9C%E5%AE%89%E5%85%A8/1.htm">网络安全</a><a class="tag" taget="_blank" href="/search/web%E5%AE%89%E5%85%A8/1.htm">web安全</a> <div>这里我来总结几种Redis反弹Shell的方法一、利用Redis写WebShell前提条件开了web服务器,并且知道路径,还需要有文件读写增删改查的权限条件比较苛刻,但是满足条件上传就会简单一点,我们直接将文件写入www目录下,完了使用工具连接即可。语句:redis:6379>configsetdir/var/www/html/redis:6379>configsetdbfilenameshell</div> </li> <li><a href="/article/1950115062781898752.htm" title="26. 什么是雪碧图,作用和原理了解吗" target="_blank">26. 什么是雪碧图,作用和原理了解吗</a> <span class="text-muted">yqcoder</span> <a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF%E9%9D%A2%E8%AF%95-CSS/1.htm">前端面试-CSS</a><a class="tag" taget="_blank" href="/search/css/1.htm">css</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/html/1.htm">html</a> <div>总结小图合成一张,使用background来使用,减少资源请求一、什么是雪碧图?雪碧图(CSSSprite)是一种前端优化技术,指的是将多个小图标合并成一张大图,通过CSS控制显示其中的某一部分。它常用于网站中图标、按钮等小图较多的场景。二、雪碧图的作用作用说明✅减少HTTP请求次数合并多个图片为一张图,减少请求资源数✅提升页面加载速度尤其在图片较多时效果明显✅避免图片加载闪烁鼠标悬停切换图片时不</div> </li> <li><a href="/article/1950112039502409728.htm" title="H5UI微信小程序前端框架实战指南" target="_blank">H5UI微信小程序前端框架实战指南</a> <span class="text-muted">ai</span> <div>本文还有配套的精品资源,点击获取简介:H5UI是一个为微信小程序开发设计的前端框架,基于H5技术,提供简洁高效的组件库。框架集成了丰富的UI元素,如按钮、表格、导航栏等,简化了界面布局和交互的实现。通过安装、引入、使用组件和事件绑定四个步骤,开发者可以轻松构建功能齐全的应用。了解性能优化等注意事项对于高效开发同样重要。1.微信小程序前端开发框架介绍微信小程序概述微信小程序是微信官方推出的一种无需下</div> </li> <li><a href="/article/1950108839089074176.htm" title="Windows下Oracle安装图解" target="_blank">Windows下Oracle安装图解</a> <span class="text-muted">叫我老村长</span> <div>Windows下Oracle安装图解----oracle-win-64-11g详细安装步骤一、Oracle下载官方下地址http://www.oracle.com/technetwork/database/enterprise-edition/downloads/index.htmlwin32位操作系统下载地址:http://download.oracle.com/otn/nt/oracle11g</div> </li> <li><a href="/article/101.htm" title="数据采集高并发的架构应用" target="_blank">数据采集高并发的架构应用</a> <span class="text-muted">3golden</span> <a class="tag" taget="_blank" href="/search/.net/1.htm">.net</a> <div>问题的出发点:          最近公司为了发展需要,要扩大对用户的信息采集,每个用户的采集量估计约2W。如果用户量增加的话,将会大量照成采集量成3W倍的增长,但是又要满足日常业务需要,特别是指令要及时得到响应的频率次数远大于预期。       &n</div> </li> <li><a href="/article/228.htm" title="不停止 MySQL 服务增加从库的两种方式" target="_blank">不停止 MySQL 服务增加从库的两种方式</a> <span class="text-muted">brotherlamp</span> <a class="tag" taget="_blank" href="/search/linux/1.htm">linux</a><a class="tag" taget="_blank" href="/search/linux%E8%A7%86%E9%A2%91/1.htm">linux视频</a><a class="tag" taget="_blank" href="/search/linux%E8%B5%84%E6%96%99/1.htm">linux资料</a><a class="tag" taget="_blank" href="/search/linux%E6%95%99%E7%A8%8B/1.htm">linux教程</a><a class="tag" taget="_blank" href="/search/linux%E8%87%AA%E5%AD%A6/1.htm">linux自学</a> <div>现在生产环境MySQL数据库是一主一从,由于业务量访问不断增大,故再增加一台从库。前提是不能影响线上业务使用,也就是说不能重启MySQL服务,为了避免出现其他情况,选择在网站访问量低峰期时间段操作。  一般在线增加从库有两种方式,一种是通过mysqldump备份主库,恢复到从库,mysqldump是逻辑备份,数据量大时,备份速度会很慢,锁表的时间也会很长。另一种是通过xtrabacku</div> </li> <li><a href="/article/355.htm" title="Quartz——SimpleTrigger触发器" target="_blank">Quartz——SimpleTrigger触发器</a> <span class="text-muted">eksliang</span> <a class="tag" taget="_blank" href="/search/SimpleTrigger/1.htm">SimpleTrigger</a><a class="tag" taget="_blank" href="/search/TriggerUtils/1.htm">TriggerUtils</a><a class="tag" taget="_blank" href="/search/quartz/1.htm">quartz</a> <div>转载请出自出处:http://eksliang.iteye.com/blog/2208166 一.概述 SimpleTrigger触发器,当且仅需触发一次或者以固定时间间隔周期触发执行;   二.SimpleTrigger的构造函数 SimpleTrigger(String name, String group):通过该构造函数指定Trigger所属组和名称; Simpl</div> </li> <li><a href="/article/482.htm" title="Informatica应用(1)" target="_blank">Informatica应用(1)</a> <span class="text-muted">18289753290</span> <a class="tag" taget="_blank" href="/search/sql/1.htm">sql</a><a class="tag" taget="_blank" href="/search/workflow/1.htm">workflow</a><a class="tag" taget="_blank" href="/search/lookup/1.htm">lookup</a><a class="tag" taget="_blank" href="/search/%E7%BB%84%E4%BB%B6/1.htm">组件</a><a class="tag" taget="_blank" href="/search/Informatica/1.htm">Informatica</a> <div>1.如果要在workflow中调用shell脚本有一个command组件,在里面设置shell的路径;调度wf可以右键出现schedule,现在用的是HP的tidal调度wf的执行。 2.designer里面的router类似于SSIS中的broadcast(多播组件);Reset_Workflow_Var:参数重置 (比如说我这个参数初始是1在workflow跑得过程中变成了3我要在结束时还要</div> </li> <li><a href="/article/609.htm" title="python 获取图片验证码中文字" target="_blank">python 获取图片验证码中文字</a> <span class="text-muted">酷的飞上天空</span> <a class="tag" taget="_blank" href="/search/python/1.htm">python</a> <div>根据现成的开源项目 http://code.google.com/p/pytesser/改写 在window上用easy_install安装不上  看了下源码发现代码很少  于是就想自己改写一下   添加支持网络图片的直接解析   #coding:utf-8 #import sys #reload(sys) #sys.s</div> </li> <li><a href="/article/736.htm" title="AJAX" target="_blank">AJAX</a> <span class="text-muted">永夜-极光</span> <a class="tag" taget="_blank" href="/search/Ajax/1.htm">Ajax</a> <div>1.AJAX功能:动态更新页面,减少流量消耗,减轻服务器负担   2.代码结构:    <html> <head> <script type="text/javascript"> function loadXMLDoc() { .... AJAX script goes here ... </div> </li> <li><a href="/article/863.htm" title="创业OR读研" target="_blank">创业OR读研</a> <span class="text-muted">随便小屋</span> <a class="tag" taget="_blank" href="/search/%E5%88%9B%E4%B8%9A/1.htm">创业</a> <div>        现在研一,有种想创业的想法,不知道该不该去实施。因为对于的我情况这两者是矛盾的,可能就是鱼与熊掌不能兼得。                研一的生活刚刚过去两个月,我们学校主要的是</div> </li> <li><a href="/article/990.htm" title="需求做得好与坏直接关系着程序员生活质量" target="_blank">需求做得好与坏直接关系着程序员生活质量</a> <span class="text-muted">aijuans</span> <a class="tag" taget="_blank" href="/search/IT+%E7%94%9F%E6%B4%BB/1.htm">IT 生活</a> <div>         这个故事还得从去年换工作的事情说起,由于自己不太喜欢第一家公司的环境我选择了换一份工作。去年九月份我入职现在的这家公司,专门从事金融业内软件的开发。十一月份我们整个项目组前往北京做现场开发,从此苦逼的日子开始了。        系统背景:五月份就有同事前往甲方了解需求一直到6月份,后续几个月也完</div> </li> <li><a href="/article/1117.htm" title="如何定义和区分高级软件开发工程师" target="_blank">如何定义和区分高级软件开发工程师</a> <span class="text-muted">aoyouzi</span> <div>在软件开发领域,高级开发工程师通常是指那些编写代码超过 3 年的人。这些人可能会被放到领导的位置,但经常会产生非常糟糕的结果。Matt Briggs 是一名高级开发工程师兼 Scrum 管理员。他认为,单纯使用年限来划分开发人员存在问题,两个同样具有 10 年开发经验的开发人员可能大不相同。近日,他发表了一篇博文,根据开发者所能发挥的作用划分软件开发工程师的成长阶段。   初</div> </li> <li><a href="/article/1244.htm" title="Servlet的请求与响应" target="_blank">Servlet的请求与响应</a> <span class="text-muted">百合不是茶</span> <a class="tag" taget="_blank" href="/search/servlet/1.htm">servlet</a><a class="tag" taget="_blank" href="/search/get%E6%8F%90%E4%BA%A4/1.htm">get提交</a><a class="tag" taget="_blank" href="/search/java%E5%A4%84%E7%90%86post%E6%8F%90%E4%BA%A4/1.htm">java处理post提交</a> <div>  Servlet是tomcat中的一个重要组成,也是负责客户端和服务端的中介     1,Http的请求方式(get  ,post);   客户端的请求一般都会都是Servlet来接受的,在接收之前怎么来确定是那种方式提交的,以及如何反馈,Servlet中有相应的方法,  http的get方式 servlet就是都doGet(</div> </li> <li><a href="/article/1371.htm" title="web.xml配置详解之listener" target="_blank">web.xml配置详解之listener</a> <span class="text-muted">bijian1013</span> <a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/web.xml/1.htm">web.xml</a><a class="tag" taget="_blank" href="/search/listener/1.htm">listener</a> <div>一.定义 <listener> <listen-class>com.myapp.MyListener</listen-class> </listener>   二.作用        该元素用来注册一个监听器类。可以收到事件什么时候发生以及用什么作为响</div> </li> <li><a href="/article/1498.htm" title="Web页面性能优化(yahoo技术)" target="_blank">Web页面性能优化(yahoo技术)</a> <span class="text-muted">Bill_chen</span> <a class="tag" taget="_blank" href="/search/JavaScript/1.htm">JavaScript</a><a class="tag" taget="_blank" href="/search/Ajax/1.htm">Ajax</a><a class="tag" taget="_blank" href="/search/Web/1.htm">Web</a><a class="tag" taget="_blank" href="/search/css/1.htm">css</a><a class="tag" taget="_blank" href="/search/Yahoo/1.htm">Yahoo</a> <div>1.尽可能的减少HTTP请求数 content 2.使用CDN server 3.添加Expires头(或者 Cache-control) server 4.Gzip 组件 server 5.把CSS样式放在页面的上方。 css 6.将脚本放在底部(包括内联的) javascript 7.避免在CSS中使用Expressions css 8.将javascript和css独立成外部文</div> </li> <li><a href="/article/1625.htm" title="【MongoDB学习笔记八】MongoDB游标、分页查询、查询结果排序" target="_blank">【MongoDB学习笔记八】MongoDB游标、分页查询、查询结果排序</a> <span class="text-muted">bit1129</span> <a class="tag" taget="_blank" href="/search/mongodb/1.htm">mongodb</a> <div>游标   游标,简单的说就是一个查询结果的指针。游标作为数据库的一个对象,使用它是包括 声明 打开 循环抓去一定数目的文档直到结果集中的所有文档已经抓取完 关闭游标   游标的基本用法,类似于JDBC的ResultSet(hasNext判断是否抓去完,next移动游标到下一条文档),在获取一个文档集时,可以提供一个类似JDBC的FetchSize</div> </li> <li><a href="/article/1752.htm" title="ORA-12514 TNS 监听程序当前无法识别连接描述符中请求服务 的解决方法" target="_blank">ORA-12514 TNS 监听程序当前无法识别连接描述符中请求服务 的解决方法</a> <span class="text-muted">白糖_</span> <a class="tag" taget="_blank" href="/search/ORA-12514/1.htm">ORA-12514</a> <div> 今天通过Oracle SQL*Plus连接远端服务器的时候提示“监听程序当前无法识别连接描述符中请求服务”,遂在网上找到了解决方案: ①打开Oracle服务器安装目录\NETWORK\ADMIN\listener.ora文件,你会看到如下信息:   # listener.ora Network Configuration File: D:\database\Oracle\net</div> </li> <li><a href="/article/1879.htm" title="Eclipse 问题 A resource exists with a different case" target="_blank">Eclipse 问题 A resource exists with a different case</a> <span class="text-muted">bozch</span> <a class="tag" taget="_blank" href="/search/eclipse/1.htm">eclipse</a> <div>在使用Eclipse进行开发的时候,出现了如下的问题: Description Resource Path Location TypeThe project was not built due to "A resource exists with a different case: '/SeenTaoImp_zhV2/bin/seentao'.&</div> </li> <li><a href="/article/2006.htm" title="编程之美-小飞的电梯调度算法" target="_blank">编程之美-小飞的电梯调度算法</a> <span class="text-muted">bylijinnan</span> <a class="tag" taget="_blank" href="/search/%E7%BC%96%E7%A8%8B%E4%B9%8B%E7%BE%8E/1.htm">编程之美</a> <div> public class AptElevator { /** * 编程之美 小飞 电梯调度算法 * 在繁忙的时间,每次电梯从一层往上走时,我们只允许电梯停在其中的某一层。 * 所有乘客都从一楼上电梯,到达某层楼后,电梯听下来,所有乘客再从这里爬楼梯到自己的目的层。 * 在一楼时,每个乘客选择自己的目的层,电梯则自动计算出应停的楼层。 * 问:电梯停在哪</div> </li> <li><a href="/article/2133.htm" title="SQL注入相关概念" target="_blank">SQL注入相关概念</a> <span class="text-muted">chenbowen00</span> <a class="tag" taget="_blank" href="/search/sql/1.htm">sql</a><a class="tag" taget="_blank" href="/search/Web/1.htm">Web</a><a class="tag" taget="_blank" href="/search/%E5%AE%89%E5%85%A8/1.htm">安全</a> <div>SQL Injection:就是通过把SQL命令插入到Web表单递交或输入域名或页面请求的查询字符串,最终达到欺骗服务器执行恶意的SQL命令。 具体来说,它是利用现有应用程序,将(恶意)的SQL命令注入到后台数据库引擎执行的能力,它可以通过在Web表单中输入(恶意)SQL语句得到一个存在安全漏洞的网站上的数据库,而不是按照设计者意图去执行SQL语句。 首先让我们了解什么时候可能发生SQ</div> </li> <li><a href="/article/2260.htm" title="[光与电]光子信号战防御原理" target="_blank">[光与电]光子信号战防御原理</a> <span class="text-muted">comsci</span> <a class="tag" taget="_blank" href="/search/%E5%8E%9F%E7%90%86/1.htm">原理</a> <div>       无论是在战场上,还是在后方,敌人都有可能用光子信号对人体进行控制和攻击,那么采取什么样的防御方法,最简单,最有效呢?       我们这里有几个山寨的办法,可能有些作用,大家如果有兴趣可以去实验一下       根据光</div> </li> <li><a href="/article/2387.htm" title="oracle 11g新特性:Pending Statistics" target="_blank">oracle 11g新特性:Pending Statistics</a> <span class="text-muted">daizj</span> <a class="tag" taget="_blank" href="/search/oracle/1.htm">oracle</a><a class="tag" taget="_blank" href="/search/dbms_stats/1.htm">dbms_stats</a> <div>oracle 11g新特性:Pending Statistics 转 从11g开始,表与索引的统计信息收集完毕后,可以选择收集的统信息立即发布,也可以选择使新收集的统计信息处于pending状态,待确定处于pending状态的统计信息是安全的,再使处于pending状态的统计信息发布,这样就会避免一些因为收集统计信息立即发布而导致SQL执行计划走错的灾难。 在 11g 之前的版本中,D</div> </li> <li><a href="/article/2514.htm" title="快速理解RequireJs" target="_blank">快速理解RequireJs</a> <span class="text-muted">dengkane</span> <a class="tag" taget="_blank" href="/search/jquery/1.htm">jquery</a><a class="tag" taget="_blank" href="/search/requirejs/1.htm">requirejs</a> <div>RequireJs已经流行很久了,我们在项目中也打算使用它。它提供了以下功能: 声明不同js文件之间的依赖 可以按需、并行、延时载入js库 可以让我们的代码以模块化的方式组织 初看起来并不复杂。 在html中引入requirejs 在HTML中,添加这样的 <script> 标签: <script src="/path/to</div> </li> <li><a href="/article/2641.htm" title="C语言学习四流程控制if条件选择、for循环和强制类型转换" target="_blank">C语言学习四流程控制if条件选择、for循环和强制类型转换</a> <span class="text-muted">dcj3sjt126com</span> <a class="tag" taget="_blank" href="/search/c/1.htm">c</a> <div># include <stdio.h> int main(void) { int i, j; scanf("%d %d", &i, &j); if (i > j) printf("i大于j\n"); else printf("i小于j\n"); retu</div> </li> <li><a href="/article/2768.htm" title="dictionary的使用要注意" target="_blank">dictionary的使用要注意</a> <span class="text-muted">dcj3sjt126com</span> <a class="tag" taget="_blank" href="/search/IO/1.htm">IO</a> <div>NSDictionary *dict = [NSDictionary dictionaryWithObjectsAndKeys: user.user_id , @"id", user.username , @"username", </div> </li> <li><a href="/article/2895.htm" title="Android 中的资源访问(Resource)" target="_blank">Android 中的资源访问(Resource)</a> <span class="text-muted">finally_m</span> <a class="tag" taget="_blank" href="/search/xml/1.htm">xml</a><a class="tag" taget="_blank" href="/search/android/1.htm">android</a><a class="tag" taget="_blank" href="/search/String/1.htm">String</a><a class="tag" taget="_blank" href="/search/drawable/1.htm">drawable</a><a class="tag" taget="_blank" href="/search/color/1.htm">color</a> <div> 简单的说,Android中的资源是指非代码部分。例如,在我们的Android程序中要使用一些图片来设置界面,要使用一些音频文件来设置铃声,要使用一些动画来显示特效,要使用一些字符串来显示提示信息。那么,这些图片、音频、动画和字符串等叫做Android中的资源文件。 在Eclipse创建的工程中,我们可以看到res和assets两个文件夹,是用来保存资源文件的,在assets中保存的一般是原生</div> </li> <li><a href="/article/3022.htm" title="Spring使用Cache、整合Ehcache" target="_blank">Spring使用Cache、整合Ehcache</a> <span class="text-muted">234390216</span> <a class="tag" taget="_blank" href="/search/spring/1.htm">spring</a><a class="tag" taget="_blank" href="/search/cache/1.htm">cache</a><a class="tag" taget="_blank" href="/search/ehcache/1.htm">ehcache</a><a class="tag" taget="_blank" href="/search/%40Cacheable/1.htm">@Cacheable</a> <div>Spring使用Cache            从3.1开始,Spring引入了对Cache的支持。其使用方法和原理都类似于Spring对事务管理的支持。Spring Cache是作用在方法上的,其核心思想是这样的:当我们在调用一个缓存方法时会把该方法参数和返回结果作为一个键值对存放在缓存中,等到下次利用同样的</div> </li> <li><a href="/article/3149.htm" title="当druid遇上oracle blob(clob)" target="_blank">当druid遇上oracle blob(clob)</a> <span class="text-muted">jackyrong</span> <a class="tag" taget="_blank" href="/search/oracle/1.htm">oracle</a> <div>http://blog.csdn.net/renfufei/article/details/44887371 众所周知,Oracle有很多坑, 所以才有了去IOE。 在使用Druid做数据库连接池后,其实偶尔也会碰到小坑,这就是使用开源项目所必须去填平的。【如果使用不开源的产品,那就不是坑,而是陷阱了,你都不知道怎么去填坑】 用Druid连接池,通过JDBC往Oracle数据库的</div> </li> <li><a href="/article/3276.htm" title="easyui datagrid pagination获得分页页码、总页数等信息" target="_blank">easyui datagrid pagination获得分页页码、总页数等信息</a> <span class="text-muted">ldzyz007</span> <div>var grid = $('#datagrid');  var options = grid.datagrid('getPager').data("pagination").options;  var curr = options.pageNumber;  var total = options.total;  var max =</div> </li> <li><a href="/article/3403.htm" title="浅析awk里的数组" target="_blank">浅析awk里的数组</a> <span class="text-muted">nigelzeng</span> <a class="tag" taget="_blank" href="/search/%E4%BA%8C%E7%BB%B4%E6%95%B0%E7%BB%84/1.htm">二维数组</a><a class="tag" taget="_blank" href="/search/array/1.htm">array</a><a class="tag" taget="_blank" href="/search/%E6%95%B0%E7%BB%84/1.htm">数组</a><a class="tag" taget="_blank" href="/search/awk/1.htm">awk</a> <div>awk绝对是文本处理中的神器,它本身也是一门编程语言,还有许多功能本人没有使用到。这篇文章就单单针对awk里的数组来进行讨论,如何利用数组来帮助完成文本分析。   有这么一组数据:   abcd,91#31#2012-12-31 11:24:00 case_a,136#19#2012-12-31 11:24:00 case_a,136#23#2012-12-31 1</div> </li> <li><a href="/article/3530.htm" title="搭建 CentOS 6 服务器(6) - TigerVNC" target="_blank">搭建 CentOS 6 服务器(6) - TigerVNC</a> <span class="text-muted">rensanning</span> <a class="tag" taget="_blank" href="/search/centos/1.htm">centos</a> <div>安装GNOME桌面环境 # yum groupinstall "X Window System" "Desktop" 安装TigerVNC # yum -y install tigervnc-server tigervnc 启动VNC服务 # /etc/init.d/vncserver restart # vncser</div> </li> <li><a href="/article/3657.htm" title="Spring 数据库连接整理" target="_blank">Spring 数据库连接整理</a> <span class="text-muted">tomcat_oracle</span> <a class="tag" taget="_blank" href="/search/spring/1.htm">spring</a><a class="tag" taget="_blank" href="/search/bean/1.htm">bean</a><a class="tag" taget="_blank" href="/search/jdbc/1.htm">jdbc</a> <div>1、数据库连接jdbc.properties配置详解   jdbc.url=jdbc:hsqldb:hsql://localhost/xdb   jdbc.username=sa   jdbc.password=   jdbc.driver=不同的数据库厂商驱动,此处不一一列举   接下来,详细配置代码如下:    Spring连接池    </div> </li> <li><a href="/article/3784.htm" title="Dom4J解析使用xpath java.lang.NoClassDefFoundError: org/jaxen/JaxenException异常" target="_blank">Dom4J解析使用xpath java.lang.NoClassDefFoundError: org/jaxen/JaxenException异常</a> <span class="text-muted">xp9802</span> <div>用Dom4J解析xml,以前没注意,今天使用dom4j包解析xml时在xpath使用处报错      异常栈:java.lang.NoClassDefFoundError: org/jaxen/JaxenException异常       导入包 jaxen-1.1-beta-6.jar 解决; &nb</div> </li> </ul> </div> </div> </div> <div> <div class="container"> <div class="indexes"> <strong>按字母分类:</strong> <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. <!-- <a href="https://beian.miit.gov.cn/" rel="nofollow" target="_blank">京ICP备09083238号</a><br>--> </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>