Python/Spring Cloud Alibaba开发--前端复习笔记(1)———— html5和css3.html基础

Python/Spring Cloud Alibaba开发–前端复习笔记(1)———— html5和css3.html基础

1)概述和基本结构

超文本标记语言。超文本指超链接,标记指的是标签。
基本结构:

   文档声明
   定义网页的语言 en为英文,zh-CN为中文   

	
网页标题</tiltle>
</head>
<body>
	你好!欢迎访问我的个人网页!
</body>
</html>
</code></pre> 
  <h4>2)html分类</h4> 
  <p>xhtml1.0文档类型<br> 文档声明、编码声明、网页语言声明长。<br> 区别:a。文档声明和编码声明 b。html5新增了标签元素以及元素属性</p> 
  <h4>3)注释</h4> 
  <pre><code><!--这是注释-->  两个横杆
</code></pre> 
  <h4>4)标题标签</h4> 
  <p><code><h1><h2><h3><h4><h5><h6></code><br> 可以在网页上定义6种级别的标题。6种级别的标题表示文档的6级目录层级关系。</p> 
  <h4>5)段落标签</h4> 
  <pre><code><p>文字</p>
</code></pre> 
  <p>段落标签中,开头处不识别空格,内容中只识别一个空格。<br> 识别符: ;为空格 <;为小于号< >;为大于号><br> 换行</p> 
  <h4>6)块标签、含样式的标签</h4> 
  <h5>1>块标签</h5> 
  <div>
    标签 块元素,表示一块内容,没有具体的语义 标签 行内元素,表示一行中的一小段内容,没有具体的语义 p段落标签有样式,行距等,div块标签没有样式。 
  </div> 
  <h5>2>含样式和语义的标签</h5> 
  <p><code><em></code>标签,表示语气中的强调词,斜体<br> <code><i></code>标签,表示专业词汇,斜体<br> <code><b></code>标签,表示文档中的关键字或者产品名,加粗<br> <code><strong></code>标签,表示非常重要的内容,加粗</p> 
  <h5>3>语义化标签</h5> 
  <p>h1 标题;p 段落;ul、li 列表;a 链接;dl、dt、dd 定义列表</p> 
  <h4>7)图像标签、绝对路径和相对路径</h4> 
  <h5>1>图像标签</h5> 
  <pre><code class="prism language-css"><img src=”images/001.jpg” alt=”产品图片” />
</code></pre> 
  <p>src属性 定义图片的引用地址<br> alt属性 定义图片加载失败时显示的文字,搜索引擎会使用这个文字收录图、盲人读屏软件会读取这个文字让盲人识别图片,所以此属性非常重要。</p> 
  <h5>2>绝对路径和相对路径</h5> 
  <p>绝对路径:相对于磁盘的位置去定位 文件的位置<br> 相对路径:相对于当前文件的位置去定位文件的位置<br> ./ 表示当前目录,可以省略<br> …/ 表示上一层目录</p> 
  <h4>8)链接标签</h4> 
  <p> 定义一个链接地址 常用属性 href属性 定义跳转的地址 title属性 定义鼠标悬停时弹出的提示文字框 target属性 定义链接窗口打开的位置 target=”self” 缺省值,新页面替换原来的页面,在原来的位置打开 target=”_blank”新页面会在新开的一个浏览器窗口打开 跳转到页面顶部</p> 
  <h4>9)列表标签</h4> 
  <p>有序列表<br> 会自动给内容加序号<br> 可以使用<code><ol>, <li></code>配合使用来实现。</p> 
  <pre><code><ol>
	<li>listcontent1</li>
	<li>listcontent2</li>
	<li>listcontent3</li>
</ol>
</code></pre> 
  <p>快捷键定义: <code>ol>li*3</code> 然后按tab键<br> 无序列表<br> 可以用来做新闻标题等<br> 可以使用<code><ul>, <li></code>配合使用来实现。<br> 在css中使用List-style:none 去掉列表前的点。</p> 
  <pre><code><ul>
	<li><a href=”#”>news1</a></li>
	<li><a href=”#”>news2</a></li>
	<li><a  href=”#”>news3</a></li>
</ul>
</code></pre> 
  <p>快捷键定义:<code>ul>(li>a{新闻标题})*3</code> 然后按tab键<br> 定义列表<br> <code><dl></code>标签表示列表的整体,<code><dt></code>标签定义术语的题目,<code><dd></code>标签是术语的解释。</p> 
  <h3>2.表格标签和传统布局</h3> 
  <h4>1)html表格</h4> 声明一个表格 属性: border 定义表格的边框,设置值是数值 cellpadding 定义单元格内容与边框的距离,设置值是数值 cellspacing 定义单元格与单元格之间的距离,设置值是数值 align 设置整体表格相对于浏览器窗口的水平对齐方式,设置值有left|center|right 定义表格的一行 
  <table> 
   <tbody> 
    <tr> 
     <td> 定义一行中的一个单元格,td代表普通单元格,th表示表头单元格。 属性: align 设置单元格中内容的水平对齐方式,设置值有left|center|right valign 设置单元格中内容的垂直对齐方式 top|middle|bottom colspan 设置单元格水平合并,设置值是数值 rowspan 设置单元格垂直合并,设置值是数值 快捷操作:table>(tr>td*5)*6 创建6行5列的表格 </td> 
    </tr> 
   </tbody> 
  </table> 
  <h4>2)页面布局</h4> 
  <p>一般分为两种:</p> 
  <h5>1>table布局</h5> 
  <p>即传统布局,将页面空间划分成若干个单元格,将文字或图片等元素放入单元格中,隐藏表格的边框,从而实现布局。目前主要应用在EDM(广告邮件中的页面)中。<br> 布局复杂时,在table中嵌套表格</p> 
  <h5>2>html+css布局(DIV+CSS)</h5> 
  <p>通过CSS样式设置来布局文字或图片等元素,需要用到CSS盒子模型、盒子类型、CSS浮动、CSS定位、CSS背景图定位等知识来布局,比传统布局更复杂,目前是主流。</p> 
  <h3>3.html表单</h3> 
  <p>表单用于搜集不同类型的用户输入,表单由不同类型的标签组成。</p> 
  <h5>1><code><form></code>标签</h5> 
  <p>定义整体的表单区域<br> action属性 定义表单数据提交地址<br> method属性 定义表单提交的方式,一般有“get”方式和“post”方式</p> 
  <h5>2> <code><label></code></h5> 
  <p>表单元素定义文字标注</p> 
  <h5>3> <code><input></code></h5> 
  <p>定义通用的表单元素<br> type属性:“text”定义单行文本输入框;“password”定义密码输入框;“radio”定义单选框;“checkbox“定义复选框;”file“定义上传文件;”submit“定义提交按钮;”reset“定义重置按钮;”image“定义图片作为提交按钮,用src属性定义图片地址;”hidden“定义一个隐藏的表单域,用来存储值,select属性定义复选框option定义选项。<br> value属性 定义表单元素的值<br> name属性 定义表单元素的名称,此名称是提交数据时的键名</p> 
  <h3>4.CSS基本语法</h3> 
  <p>层叠样式表,html只负责文档的结构和内容,表现形式完全交给CSS。<br> css的定义方法:<br> 选择器 {属性:值;属性:值 }</p> 
  <pre><code>div{
	font-size:16px;
color:ed;
}
</code></pre> 
  <p>css页面引入方法:</p> 
  <h5>1>外联式</h5> 
  <p>在html文件的<code><head></code>中加入<br> <code><link rel=”stylesheet” type=”text/css” href=”./css/main.css”></code> href为css文件地址</p> 
  <h5>2>嵌入式</h5> 
  <p>通过style标签,在网页上创建嵌入的样式表</p> 
  <pre><code><style type=”text/css”>
div{ width:100px; height:100px; color:red }
</code></pre> 
  <h5>3>内联式</h5> 
  <p>通过标签的style属性,在标签上直接写样式</p> 
  <pre><code><div style=”width:100px; height:100px; color:red”>……</div>
1
</code></pre> 
  <h3>5.CSS常用文本样式</h3> 
  <p>字号 font-size;颜色 color;字体 font-family;斜体 font-style;加粗 font-weight;行高 line-height<br> 可以使用<code><span></code>标签,进行特定的样式设置</p> 
  <h3>6.CSS样式选择器</h3> 
  <p>css颜色值表示方法:<br> 1>颜色名表示,如 red gold<br> 2>rgb表示 如 rgb(255,0,0)红色<br> 3>16进制数值表示,#ff0000 表示红色,可以简写为#f00</p> 
  <h4>1)标签选择器</h4> 
  <p>尽量应用在层级选择器中。<br> <code>*</code> 所有标签</p> 
  <h4>2)id选择器</h4> 
  <p>通过id名来选择元素,元素的id名称不能重复。但id名一般给程序使用,所以不推荐使用id作为选择器。<br> 例如:<br> <code><div id=“div1”>第一个div</div></code> 设置id<br> 在<code><head></code>的<code><style></code>中设置样式<br> #div1{}中设置样式</p> 
  <h4>3)类选择器</h4> 
  <p>通过类名来选择元素,一个类可以应用于多个元素,一个元素也可以使用多个类,应用最多的一种选择器。<br> 设置类选择器</p> 
  <pre><code>.green{color:green;}

<div class=“green”>`这是第一个div`</div>
</code></pre> 
  <h4>4)层级选择器</h4> 
  <p>主要应用在选择父元素下的子元素,或者子元素下面的子元素,可与标签元素结合使用,减少命名,同时也可以通过层级,防止命名冲突。</p> 
  <h4>5)组选择器</h4> 
  <p>类选择器中相同的样式可以用组选择器共同定义,类名用逗号隔开</p> 
  <h4>6)伪类及伪元素选择器</h4> 
  <p>常用的伪类选择器由hover,表示鼠标悬浮在元素上时的状态,伪元素选择器有before和after,它们可以通过样式在元素中插入内容。<br> 类名后加冒号定义<br> <code>.box: hover{color:red}</code> 鼠标悬停在元素上时,元素变为红色<br> <code>.box: before{content: “dd”}</code> 在标签元素前面增加文字 dd<br> after可以在元素后面增加文字</p> 
  <h3>7.盒子模型</h3> 
  <h4>1)模型理解</h4> 
  <p>元素在也页面中显示成一个方块,把元素叫做盒子,设置对应的样式分别为:盒子的宽度(width)、盒子的高度(height)、盒子的边框(border)、盒子内的内容和边框之间的间距(padding)、盒子与盒子之间的间距(margin)。<br> 定义一个类选择器,在选择器中定义属性</p> 
  <h4>2)设置宽高</h4> 
  <pre><code>width:200px
height:200px
</code></pre> 
  <h4>3)设置边框</h4> 
  <pre><code class="prism language-css">border-top:10px solid #000; 设置顶边框10px粗,实线,黑色
border-left:10px dashed #000; 虚线
border-right:10px dotted #000;点线
border-bottom 底部边框
border:10px solid #000; 同时设置四个边
</code></pre> 
  <h4>4)内容和边框间距</h4> 
  <p>padding-top、padding-left、padding-right、padding-bottom<br> 修改之后整体盒子变大,width和height设置的是内容的宽高。<br> 可以使用padding直接设置,顺时针设置。</p> 
  <pre><code class="prism language-css">padding:20px 80px 100px;这是设置上边、左右、下边的距离
padding:20px;这是同时设置四条边的距离
</code></pre> 
  <h4>5)设置外间距margin</h4> 
  <p>margin-top、margin-left 盒子与外界的距离</p> 
  <h4>6)盒子真实尺寸</h4> 
  <p>宽度 width+左右paddingwidth+左右borderwidth<br> 高度:height+上下paddingheight+上下borderheight<br> line-height text-indent 行高和首行缩进可以避免盒子尺寸发生变化。</p> 
  <h3>8.margin和overflow属性</h3> 
  <h4>1)margin使用技巧</h4> 
  <pre><code class="prism language-css">margin:50px auto 100px
</code></pre> 
  <p>左右边框会随着总界面大小的变化而变化。<br> 1>margin:x auto 设置元素水平居中<br> 2>margin负值让元素位移及边框合并</p> 
  <h4>2)外边距合并</h4> 
  <p>外边距合并指的是,当两个垂直外边距相遇时,它们将形成一个外边距。合并后的外边距的高度等于两个发生合并的外边距的高度中的较大者。解决方法:<br> 1>使用这种特性<br> 2>设置一边的外边距,一般设置margin-top<br> 3>将元素浮动或者定位</p> 
  <h4>3)margin-top 塌陷</h4> 
  <p>在两个盒子嵌套时候,内部的盒子设置的margin-top会加到外边的盒子上,导致内部的盒子margin-top设置失败,解决方法:<br> 1>外部盒子设置一个边框<br> 2>外部盒子设置overflow:hidden<br> 3>使用伪元素类</p> 
  <pre><code>.clearfix: before{
	content:””;
	display:table;
}
</code></pre> 
  <h4>4)css元素溢出</h4> 
  <p>当子元素的尺寸超过父元素的尺寸时,需要设置父元素显示溢出的子元素的方式,设置的方法是通过overflow属性来设置。<br> overflow的设置项:<br> 1>visible默认值,内容不会被修剪,会呈现在元素框之外。<br> 2>hidden内容会被修剪,并且其余内容是不可见的,此属性还有清除浮动、清除margin-top塌陷的功能。<br> 3>scroll内容会被修剪,但是浏览器会显示滚动条以便查看其余的内容。<br> 4>auto如果内容被修剪,则浏览器会显示滚动条以便查看其余的内容。<br> 5>inherit规定应该从父元素继承overflow属性的值</p> 
  <h3>9.display属性</h3> 
  <h4>1)块元素</h4> 
  <p>也称为行元素,常用标签如:div, p, ul, li, h1~h6, dl, dt, dd等都是块元素,它在布局中的行为:<br> a 支持全部的样式<br> b 如果没有设置宽度,默认的宽度为父级宽度100%<br> c 盒子占据一行,即使设置了宽度</p> 
  <h4>2)内联元素</h4> 
  <p>也称为行内元素,布局中常用的标签如:a, span, em, b, strong, i等都是内联元素,它们在布局中的行为:<br> a 支持部分样式(不支持宽、高、margin上下、padding上下)<br> b 宽高由内容决定<br> c 盒子并在一行<br> d 代码换行,盒子之间会产生间距<br> e 子元素是内联元素,父元素可以用text-align属性设置子元素水平对齐方式<br> 解决内联元素间隙的方法:<br> a 去掉内联元素之间的换行<br> b 将内联元素的父级设置font-size为0,内联元素自身再设置font-size</p> 
  <h4>3)内联块元素</h4> 
  <p>也称为行内块元素,img和input元素的行为类似这种元素,但是也归类于内联元素,我们可以用display属性将块元素或者内联元素转化成这种元素,在布局中的行为:<br> a 支持全部样式<br> b 如果没有设置宽高,宽高由内容决定<br> c 盒子并在一行<br> d 代码换行,盒子会产生间距<br> e 子元素是内联块元素,父元素可以通过text-align属性设置子元素水平对齐方式</p> 
  <h4>4)display属性</h4> 
  <p>none 元素隐藏且不占位置<br> block 元素以块元素显示<br> inline 元素以内联元素显示<br> inline-block 元素以内联块元素显示</p> 
  <h3>10.浮动</h3> 
  <p>父级盒子不给高度,子集盒子浮动,子集盒子“撑不开”父级盒子,父级盒子需要清除浮动<br> 特性<br> 1>浮动元素有左浮动(float:left)和右浮动(float:right)两种<br> 2>浮动的元素会向左或向右浮动,碰到父元素边界、其他元素才停下来<br> 3>相邻浮动的块元素可以并在一行,超出父级宽度就换行<br> 4>浮动让行内元素或块元素自动转化为行内块元素(此时不会有行内块元素间隙问题)<br> 5>浮动元素后面没有浮动的元素会占据浮动元素的位置,没有浮动的元素内的文字会避开浮动的元素,形成文字绕图的效果<br> 6>父元素如果没有设置尺寸(一般是高度不设置),父元素内整体浮动的元素无法撑开父元素,父元素需要清除浮动<br> 7>浮动元素之间没有垂直margin的合并</p> 
  <h4>清除浮动:</h4> 
  <p>1>父级上增加属性overflow:hidden<br> 2>在最后一个子元素的后面加一个空的div,给它样式属性clear:both(不推荐)<br> 3>使用成熟的清浮动样式类,clearfix</p> 
  <pre><code class="prism language-css"><span class="token selector">.clearfix:after</span><span class="token punctuation">{</span>
	<span class="token property">content</span><span class="token punctuation">:</span><span class="token string">""</span><span class="token punctuation">;</span>
	<span class="token property">display</span><span class="token punctuation">:</span>table<span class="token punctuation">;</span>
	<span class="token property">clear</span><span class="token punctuation">:</span>both<span class="token punctuation">;</span>
</code></pre> 
  <p>将上面的类选择器加到父类class中。同时这个类可以与clearfix:before搭配使用,合成一个组选择器,解决margin-top塌陷的问题。</p> 
  <pre><code>.clearfix{ zoom:1 }
</code></pre> 
  <p>IE浏览器专用,兼容。</p> 
  <h3>11定位</h3> 
  <p>文档流:盒子按照html标签编写的顺序依次从上到下,从左到右排列,块元素占一行,行内元素在一行之内从左到右排列,先写的先排列,后写的排在后面,每个盒子占据自己的位置。</p> 
  <h4>1)关于定位</h4> 
  <p>使用css的position属性来设置元素的定位类型,position设置如下:<br> 1>relative生成相对定位元素,元素所占据的文档流的位置保留,元素本身相对自身原位进行偏移<br> 2>absolute 生成绝对定位元素,不占据文档流位置,定位时,相对于上一个设置了定位的父级元素来进行定位,如果找不到,则相对于body元素进行定位。<br> 3>fixed生成固定定位元素,脱离文档流,相对于浏览器窗口定位<br> 4>static默认值,没有定位,出现在正常的文档流中<br> 5>inherit 从父元素继承position属性的值</p> 
  <h4>2)定位元素的偏移</h4> 
  <p>使用right、left、top、bottom来设置相对于参考元素的偏移值。</p> 
  <h3>12.background属性</h3> 
  <h4>1)设置项:</h4> 
  <pre><code class="prism language-css">background-color 设置背景颜色
background-image 设置背景图片地址
background-repeat 设置背景图片如何重复平铺
background-position 设置背景图片的位置,水平方向“left、center、right”,垂直方向“top、center、bottom”。
background-attachment 设置背景图片是固定还是随着页面滚动条滚动
position属性中,左右移动时,负值向左,正值向右。上下移动时,负值向上,正值向下。
</code></pre> 
  <h4>2)雪碧图</h4> 
  <p>ps制作雪碧图<br> 1.使用photoshop新建一张背景透明的图片<br> 2.将小图片复制到此图片中,排列好每个图像的位置,图片幅面不够可以用画布大小调整大小<br> 3.按照所有小图片的范围裁剪图片,存为透明背景的png图片<br> 13.前端页面开发流程<br> 1)创建页面项目目录<br> 2)使用photoshop对效果图切图,切出网页制作中需要的小图片<br> 3)将装饰类图像合并,制作成雪碧图<br> 4)结合photoshop和代码编辑器,参照效果图,进行html和css代码书写,制作页面。</p> 
  <h3>14.html5与CSS3</h3> 
  <h4>1)css权重</h4> 
  <p>权重高的样式对元素起作用。<br> 权重等级:<br> 1> !important 加载样式属性值后,权重值为10000<br> 2>内联样式,如:style=“”,权重值为1000<br> 3>ID选择器,如:#content,权重值为100<br> 4>类、伪类和属性选择器,如:content、:hover权重值为10<br> 5>标签选择器和伪元素选择器,如:div、p、:before权重值为1<br> 6>通用选择器(<code>*</code>)、子选择器(>)、相邻选择器(+)、同胞选择器(~)、权重值为0</p> 
  <h4>2)css新增选择器</h4> 
  <h5>1>E:nth-child(n)</h5> 
  <p>匹配元素类型为E且是父元素的第n个子元素</p> 
  <h5>2>E:first-child</h5> 
  <p>匹配元素类型为E且是父元素的第一个子元素</p> 
  <h5>3>E:last-child</h5> 
  <p>匹配元素类型为E且是父元素的最后一个子元素</p> 
  <h5>4>E>F</h5> 
  <p>E元素下面第一层子元素</p> 
  <h5>5>E~F</h5> 
  <p>E元素后面的兄弟元素</p> 
  <h5>6>E+F</h5> 
  <p>紧挨着的后面的兄弟元素<br> 属性选择器:<br> 1>E[attr]含有attr属性的元素<br> 2>E[attr=‘ok’] 含有attr属性的元素且它的值为“ok”<br> 3>E[attr^=‘ok’] 含有attr属性的元素且它的值开头含有“ok”<br> 4>E[attr$=‘ok’] 含有attr属性的元素且它的值结尾含有“ok”<br> 5>E[attr*=‘ok’] 含有attr属性的元素且它的值中含有“ok”</p> 
  <h4>3)css3 圆角、rgba</h4> 
  <h5>1>圆角</h5> 
  <p>设置某一个角的圆角,比如设置左上角的圆角:<br> border-top-left-radius:30px 60px;<br> 同时设置四个角:<br> border-radius:30px 60px 120px 150px;<br> 顺序为顺时针</p> 
  <h5>2>rgba</h5> 
  <p>a 盒子透明度表示法</p> 
  <pre><code>.box
{
	opacity:0.1;
filter:alpha(opacity=10);  兼容IE
}
</code></pre> 
  <p>b rgba(0,0,0,0.1)前三个数值表示颜色,第四个数值表示颜色的透明度</p> 
  <h4>4)css3 transition动画</h4> 
  <p>1>transition-property设置过渡的属性,如,width height background-color<br> 2>transition-duration 设置过渡的时间,如:1s 500ms<br> 3>transition-timing-function 设置过渡的运动方式,常用linear匀速 ease缓冲<br> 4>transition-delay设置动画的延迟<br> 5>transition: property duration timing-function delay 同时设置四个属性</p> 
  <h4>5)css3 transform变换 翻面</h4> 
  <p>1>translate(x, y) 设置盒子位移<br> 2>scale(x, y) 设置盒子缩放<br> 3>rotate(deg) 设置盒子旋转<br> 4>skew(x-angle, y-angle) 设置盒子斜切<br> 5>perspective 设置透视距离<br> 6>transform-style flat|preserve-3d 设置盒子是否按3d空间显示<br> 7>translateX、translateY, translate 设置三维移动<br> 8>rotateX, rotateY, rotateZ 设置三维旋转<br> 9>scaleX, scaleY, scaleZ 设置三维缩放<br> 10>transform-origin 设置变形的中心点<br> 11>backface-visibility 设置盒子背面是否可见</p> 
  <h4>6)css3 animation动画</h4> 
  <p>1>@keyframes 定义关键帧动画<br> 2>animation-name 动画名称<br> 3>animation-duration 动画时间<br> 4>animation-timing-function 动画曲线 linear匀速,ease缓冲,steps步数<br> 5>animation-delay 动画延迟<br> 6>animation-iteration-count 动画播放次数 n|infinite<br> 7>animation-direction 动画结束后是否反向还原 normal|alternate<br> 8>animation-play-state 动画状态 paused(停止)|running(运动)<br> 9>animation-fill-mode 动画前后的状态 none|forwards(结束时停留在最后一帧)|backwards(开始时停留在定义的开始帧)|both(前后都应用)<br> 10>animation:name duration timing-function delay iteration-count direction; 同时设置多个属性。</p> 
  <h4>7)css3浏览器前缀</h4> 
  <h5>1>浏览器样式前缀</h5> 
  <p>为了让css3样式兼容,需要将某些样式加上浏览器前缀:<br> -ms- 兼容ie浏览器<br> -moz- 兼容firefox<br> -o- 兼容opera<br> -webkit- 兼容chrome和safari</p> 
  <h5>2>自动添加浏览器前缀</h5> 
  <p>交给插件,如,安装autoprefixer</p> 
  <h4>8)html5新增标签</h4> 
  <p>新增语义标签<br> <code><header></code> 页面头部、页眉<br> <code><nav></code> 页面导航<br> <code><article></code> 一篇文章<br> <code><section></code> 文章中的章节<br> <code><aside></code> 侧边栏<br> <code><footer></code> 页面底部,页脚<br> 音频视频</p> 
  <pre><code><audio>

<video>
</code></pre> 
  <h4>9)html5新增表单控件</h4> 
  <p>网址 邮箱 日期 时间 星期 数量 范围 电话 颜色 搜索</p> 
  <pre><code class="prism language-css"><label><span class="token property">网址</span><span class="token punctuation">:</span></label><input type=<span class="token string">"url"</span> name=<span class="token string">""</span> required><br><br> 
<label><span class="token property">邮箱</span><span class="token punctuation">:</span></label><input type=<span class="token string">"email"</span> name=<span class="token string">""</span> required><br><br> 
<label><span class="token property">日期</span><span class="token punctuation">:</span></label><input type=<span class="token string">"date"</span> name=<span class="token string">""</span>><br><br> 
<label><span class="token property">时间</span><span class="token punctuation">:</span></label><input type=<span class="token string">"time"</span> name=<span class="token string">""</span>><br><br> 
<label><span class="token property">星期</span><span class="token punctuation">:</span></label><input type=<span class="token string">"week"</span> name=<span class="token string">""</span>><br><br> 
<label><span class="token property">数量</span><span class="token punctuation">:</span></label><input type=<span class="token string">"number"</span> name=<span class="token string">""</span>> <br><br>
<label><span class="token property">范围</span><span class="token punctuation">:</span></label><input type=<span class="token string">"range"</span> name=<span class="token string">""</span>><br><br> 
<label><span class="token property">电话</span><span class="token punctuation">:</span></label><input type=<span class="token string">"tel"</span> name=<span class="token string">""</span>><br><br> 
<label><span class="token property">颜色</span><span class="token punctuation">:</span></label><input type=<span class="token string">"color"</span> name=<span class="token string">""</span>><br><br> 
<label><span class="token property">搜索</span><span class="token punctuation">:</span></label><input type=<span class="token string">"search"</span> name=<span class="token string">""</span>><br><br>
</code></pre> 
  <p>新增常用表单控件属性:<br> 1>placeholder 设置文本框默认提示文字<br> 2>autofocus 自动获得焦点<br> 3>autocomplete 联想关键词</p> 
  <h3>15.移动端页面开发</h3> 
  <h4>1)移动端与pc端页面布局区别</h4> 
  <h5>1>视口</h5> 
  <p>将pc端页面缩放到移动端窗口的大小。<br> 使用meta标签,name=”viewport”来设置视口的大小,将视口的大小设置为和移动设备可视区一样的大小。<br> 快捷键:meta:vp+tab</p> 
  <h5>2>视网膜屏幕(retina屏幕)清晰度解决方案</h5> 
  <p>视网膜屏幕:屏幕的物理像素密度更高的屏幕。物理像素点比一般屏幕的多。<br> 图像在视网膜屏幕和一般屏幕上显示的一样大,但视网膜屏幕的物理像素点比一般屏幕的小,图像在上面好像是被放大了,图像会变得模糊。为了解决这一问题,可以使用比原来大一倍的图像,然后用css样式强制把图像的尺寸设为原来图像尺寸的大小。<br> background新属性<br> background-size:<br> length:用长度值指定背景图像大小。不允许负值。<br> percentage:用百分比指定背景图像大小。不允许负值。<br> auto:背景图像的真实大小。<br> cover:将背景图像等比缩放到完全覆盖容器,背景图像有可能超出容器。<br> contain:将背景图像等比缩放到宽度或高度与容器的宽度或高度相等,背景图像始终被包含在容器内。</p> 
  <h4>2)适配布局类型</h4> 
  <h5>1>pc及移动端页面适配方法</h5> 
  <p>a 全适配:响应式布局+流体布局<br> b 移动端适配:流体布局+少量响应式布局 / 基于rem的布局</p> 
  <h5>2>流体布局</h5> 
  <p>使用百分比来设置元素的宽度,元素的高度按实际高度写固定值。可以使用样式中的计算函数calc()来设置宽度,或者使用box-sizing属性将盒子设置为从边线计算盒子尺寸。</p> 
  <pre><code>calc()
</code></pre> 
  <p>通过计算的方式给元素加尺寸</p> 
  <pre><code>box-sizing
</code></pre> 
  <p>content-box 默认的盒子尺寸计算方式<br> border-box 设置盒子的尺寸计算方式为从边框开始,盒子的尺寸,边框和内填充算在盒子尺寸内</p> 
  <h5>3>响应式布局</h5> 
  <p>使用媒体查询的方式,通过查询浏览器宽度,不同的宽度应用不同的样式,每个样式块对应的是该宽度下的布局方式,从而实现响应式布局。</p> 
  <h5>4>基于rem的布局</h5> 
  <p>em单位是参照元素自身的文字大小来设置尺寸,rem指的是参照根节点的文字大小,根节点指的是html标签,设置html标签的文字大小,其他的元素相关尺寸设置用rem,这样,所有元素都有了统一的参照标准,改变html的大小,就会改变所有元素用rem设置的尺寸大小。<br> cssrm插件可以动态地将px尺寸换算成rem尺寸。</p> 
 </div> 
</div>
                            </div>
                        </div>
                    </div>
                    <!--PC和WAP自适应版-->
                    <div id="SOHUCS" sid="1693393660571365376"></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,python,html5,CSS3,原生开发)</h4>
        <div id="paradigm-article-related">
            <div class="recommend-post mb30">
                <ul class="widget-links">
                    <li><a href="/article/1899461861636632576.htm"
                           title="绿色算力网络构建与智能调度实践" target="_blank">绿色算力网络构建与智能调度实践</a>
                        <span class="text-muted">智能计算研究中心</span>
<a class="tag" taget="_blank" href="/search/%E5%85%B6%E4%BB%96/1.htm">其他</a>
                        <div>内容概要绿色算力网络的构建需以能效优化为核心,通过智能调度系统实现算力资源的高效整合与动态分配。当前架构设计包含三大核心模块:异构计算集群(涵盖GPU、FPGA及量子计算单元)、跨区域网络互联协议(适配东数西算的传输需求)以及能耗监测平台(基于实时数据建模的碳足迹追踪)。下表示例展示了典型算力节点的关键参数对比:节点类型计算密度(TFLOPS/m²)功耗比(TOPS/W)延迟控制(ms)量子计算集</div>
                    </li>
                    <li><a href="/article/1899461735283224576.htm"
                           title="跨领域算法安全优化与可解释实践" target="_blank">跨领域算法安全优化与可解释实践</a>
                        <span class="text-muted">智能计算研究中心</span>
<a class="tag" taget="_blank" href="/search/%E5%85%B6%E4%BB%96/1.htm">其他</a>
                        <div>内容概要作为系统性研究框架,《跨领域算法安全优化与可解释实践》从算法研发的全生命周期切入,重点解决多领域交叉应用中的核心矛盾。通过整合联邦学习的分布式架构与量子计算的高效特性,构建兼顾隐私保护与运算效率的算法优化范式,同时引入动态可解释性分析技术,为医疗影像诊断、金融风险预测等高敏感场景提供决策透明度保障。在技术路径层面,研究聚焦特征工程的鲁棒性设计、超参数的自适应调优策略,以及生成对抗网络在数据</div>
                    </li>
                    <li><a href="/article/1899461608892067840.htm"
                           title="智能算法安全与跨领域创新实践" target="_blank">智能算法安全与跨领域创新实践</a>
                        <span class="text-muted">智能计算研究中心</span>
<a class="tag" taget="_blank" href="/search/%E5%85%B6%E4%BB%96/1.htm">其他</a>
                        <div>内容概要在智能算法快速渗透各行业的背景下,安全治理与技术创新已成为驱动跨领域应用的核心议题。当前研究重点围绕算法可解释性增强、动态风险评估及数据安全防护展开,通过融合联邦学习的分布式协作框架、量子计算的算力突破以及注意力机制的特征聚焦能力,构建起多模态技术融合的创新路径。在应用场景层面,医疗影像诊断、金融风险预测与自动驾驶系统等关键领域已形成算法效能与安全性的双重验证体系,其中超参数优化、特征工程</div>
                    </li>
                    <li><a href="/article/1899461356399161344.htm"
                           title="模型优化前沿趋势与行业应用实战" target="_blank">模型优化前沿趋势与行业应用实战</a>
                        <span class="text-muted">智能计算研究中心</span>
<a class="tag" taget="_blank" href="/search/%E5%85%B6%E4%BB%96/1.htm">其他</a>
                        <div>内容概要模型优化技术正经历从理论研究到产业落地的关键跃迁。随着自动化机器学习(AutoML)与边缘计算技术的深度融合,模型开发范式正从人工调参转向自动化、自适应优化。以联邦学习为代表的数据隐私保护技术,正在重构跨机构协作的模型训练范式,而量子计算与神经架构搜索(NAS)的结合,为超参数优化开辟了新维度。在应用层面,医疗影像识别准确率突破99%的突破性成果,验证了迁移学习在跨领域知识迁移中的巨大潜力</div>
                    </li>
                    <li><a href="/article/1899461102887038976.htm"
                           title="RTX4070Ti巅峰性能与温控揭秘" target="_blank">RTX4070Ti巅峰性能与温控揭秘</a>
                        <span class="text-muted">智能计算研究中心</span>
<a class="tag" taget="_blank" href="/search/%E5%85%B6%E4%BB%96/1.htm">其他</a>
                        <div>内容概要作为NVIDIAAdaLovelace架构的旗舰产品之一,RTX4070Ti通过全新的流式多处理器与第三代RTCore实现了运算效能的跃升。本文将从核心架构创新、实机性能表现及散热技术突破三大维度展开分析:首先解析DLSS3帧生成技术对4K分辨率下光线追踪游戏帧率的提升效果,通过《赛博朋克2077》《瘟疫传说:安魂曲》等主流3A大作的实测数据验证其动态表现;其次拆解三槽厚度散热模组的设计逻</div>
                    </li>
                    <li><a href="/article/1899459842775511040.htm"
                           title="C#基础教程07 判断" target="_blank">C#基础教程07 判断</a>
                        <span class="text-muted">超级无敌暴龙战士塔塔开</span>
<a class="tag" taget="_blank" href="/search/C%23/1.htm">C#</a><a class="tag" taget="_blank" href="/search/c%23/1.htm">c#</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/.net/1.htm">.net</a>
                        <div>文章目录C#条件判断入门教程条件判断的基本语法常用运算符逻辑运算符if语句总结C#条件判断入门教程在C#编程语言中,条件判断是一种非常重要的控制语句。通过条件判断,我们可以根据不同的情况执行不同的代码,实现程序的流程控制。本篇文章将为大家介绍C#条件判断的基本语法、常用运算符、逻辑运算符,以及if语句、switch语句等控制语句的使用方法。条件判断的基本语法在C#中,条件判断的基本语法如下:pla</div>
                    </li>
                    <li><a href="/article/1899459211914440704.htm"
                           title="批量图片水印添加工具" target="_blank">批量图片水印添加工具</a>
                        <span class="text-muted">木木黄木木</span>
<a class="tag" taget="_blank" href="/search/python/1.htm">python</a>
                        <div>批量图片水印添加工具这是一个可以批量给图片添加水印的Python程序。程序会根据原始图片的分辨率自动调整水印大小,确保水印效果美观。这里写目录标题批量图片水印添加工具功能特点运行说明注意事项下载地址功能特点支持批量处理多个图片自动根据原图尺寸调整水印大小支持PNG格式的透明水印水印位置固定在右下角支持JPG、JPEG、PNG、BMP等格式的图片运行说明准备文件:将需要添加水印的图片放入input文</div>
                    </li>
                    <li><a href="/article/1899456187938697216.htm"
                           title="基于vue3实现的聊天机器人前端(附代码)" target="_blank">基于vue3实现的聊天机器人前端(附代码)</a>
                        <span class="text-muted">P7进阶路</span>
<a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a>
                        <div>跟它说说话吧!一个活泼的伙伴,为你提供情感支持!??发送消息!import{ref,onMounted}from'vue';import{v4asuuidv4}from'uuid';//引入UUID生成库//响应式数据constmessage=ref('');//用户输入的消息constchatbox=ref(null);//聊天记录显示区的引用constchatId=ref(uuidv4());</div>
                    </li>
                    <li><a href="/article/1899453540439486464.htm"
                           title="AIGC视频生成模型:ByteDance的PixelDance模型" target="_blank">AIGC视频生成模型:ByteDance的PixelDance模型</a>
                        <span class="text-muted">好评笔记</span>
<a class="tag" taget="_blank" href="/search/AIGC/1.htm">AIGC</a><a class="tag" taget="_blank" href="/search/%E9%9F%B3%E8%A7%86%E9%A2%91/1.htm">音视频</a><a class="tag" taget="_blank" href="/search/%E6%9C%BA%E5%99%A8%E5%AD%A6%E4%B9%A0/1.htm">机器学习</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/%E6%B7%B1%E5%BA%A6%E5%AD%A6%E4%B9%A0/1.htm">深度学习</a><a class="tag" taget="_blank" href="/search/%E8%AE%A1%E7%AE%97%E6%9C%BA%E8%A7%86%E8%A7%89/1.htm">计算机视觉</a><a class="tag" taget="_blank" href="/search/transformer/1.htm">transformer</a>
                        <div>大家好,这里是好评笔记,公主号:Goodnote,专栏文章私信限时Free。本文详细介绍ByteDance的视频生成模型PixelDance,论文于2023年11月发布,模型上线于2024年9月,同时期上线的模型还有Seaweed(论文未发布)。热门专栏机器学习机器学习笔记合集深度学习深度学习笔记合集优质专栏回顾:机器学习笔记深度学习笔记多模态论文笔记AIGC—图像文章目录热门专栏机器学习深度学习</div>
                    </li>
                    <li><a href="/article/1899453541840384000.htm"
                           title="PythonWeb——Django框架" target="_blank">PythonWeb——Django框架</a>
                        <span class="text-muted">Error_exception_worn</span>
<a class="tag" taget="_blank" href="/search/Python%E5%9F%BA%E7%A1%80/1.htm">Python基础</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/Python/1.htm">Python</a><a class="tag" taget="_blank" href="/search/django/1.htm">django</a>
                        <div>框架介绍1.什么是框架?框架就是程序的骨架,主体结构,也是个半成品。2.框架的优缺点可重用、成熟,稳健、易扩展、易维护3.Python中常见的框架大包大揽Django被官方称之为完美主义者的Web框架。力求精简web.py和Tornado新生代微框架Flask和Bottle4.Web框架中的一些概念MVC(模型-视图-控制器)和MVT(模型-视图-模板)Django框架介绍Django是一个高级的</div>
                    </li>
                    <li><a href="/article/1899449888282832896.htm"
                           title="【报错】zipfile.BadZipFile: File is not a zip file" target="_blank">【报错】zipfile.BadZipFile: File is not a zip file</a>
                        <span class="text-muted">Jude_lennon</span>
<a class="tag" taget="_blank" href="/search/%E6%8A%A5%E9%94%99/1.htm">报错</a><a class="tag" taget="_blank" href="/search/python/1.htm">python</a>
                        <div>pythonpd.read_excel(excel_path,sheet_name='Sheet1',engine='openpyxl',header=None)出现报错zipfile.BadZipFile:Fileisnotazipfile原代码:data_list=[load_graph_data(file)forfileindata_directory.glob("*.xlsx")]经过de</div>
                    </li>
                    <li><a href="/article/1899449255148449792.htm"
                           title="Python实现链表反转:迭代与递归双解法详解" target="_blank">Python实现链表反转:迭代与递归双解法详解</a>
                        <span class="text-muted">达不溜先生 ୧⍢⃝୨</span>
<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%E7%BB%93%E6%9E%84/1.htm">数据结构</a><a class="tag" taget="_blank" href="/search/%E9%93%BE%E8%A1%A8/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/leetcode/1.htm">leetcode</a>
                        <div>目录一、问题描述二、核心代码实现2.1迭代法实现迭代法中的prev初始值是None的原因:关键步骤图解2.2递归法实现递归法中要设置head.next=None的原因递归过程拆解三、方法对比与选择建议一、问题描述链表反转是数据结构中的基础算法问题,常见于面试和算法题库(如LeetCode#206)。要求将单向链表的节点顺序完全倒置二、核心代码实现2.1迭代法实现时间复杂度:O(n)空间复杂度:O(</div>
                    </li>
                    <li><a href="/article/1899447744515338240.htm"
                           title="数学建模与图形建模资源全解析" target="_blank">数学建模与图形建模资源全解析</a>
                        <span class="text-muted">点我头像干啥</span>
<a class="tag" taget="_blank" href="/search/Ai/1.htm">Ai</a><a class="tag" taget="_blank" href="/search/%E6%95%B0%E5%AD%A6%E5%BB%BA%E6%A8%A1/1.htm">数学建模</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/python/1.htm">python</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/%E6%95%B0%E6%8D%AE%E6%8C%96%E6%8E%98/1.htm">数据挖掘</a><a class="tag" taget="_blank" href="/search/%E5%88%86%E7%B1%BB/1.htm">分类</a>
                        <div>引言在当今的数据驱动时代,数学建模与图形建模已成为解决复杂问题、揭示数据内在规律的重要工具。无论是科学研究、工程设计,还是商业分析、决策支持,建模技术都发挥着举足轻重的作用。本文旨在为数学建模与图形建模的初学者及进阶者提供一份详尽的资源指南,涵盖软件工具、学习资料、在线课程、社区论坛等多个方面,帮助大家更好地掌握这些技能。一、数学建模资源概览1.数学建模软件工具数学建模离不开强大的软件支持。以下是</div>
                    </li>
                    <li><a href="/article/1899446608559403008.htm"
                           title="DeepSeek大语言模型下几个常用术语" target="_blank">DeepSeek大语言模型下几个常用术语</a>
                        <span class="text-muted">曲幽</span>
<a class="tag" taget="_blank" href="/search/AI/1.htm">AI</a><a class="tag" taget="_blank" href="/search/%E8%AE%A1%E7%AE%97%E6%9C%BA/1.htm">计算机</a><a class="tag" taget="_blank" href="/search/%E8%AF%AD%E8%A8%80%E6%A8%A1%E5%9E%8B/1.htm">语言模型</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/%E8%87%AA%E7%84%B6%E8%AF%AD%E8%A8%80%E5%A4%84%E7%90%86/1.htm">自然语言处理</a><a class="tag" taget="_blank" href="/search/deepseek/1.htm">deepseek</a><a class="tag" taget="_blank" href="/search/ollama/1.htm">ollama</a><a class="tag" taget="_blank" href="/search/ai/1.htm">ai</a>
                        <div>昨天刷B站看到复旦赵斌老师说的一句话“科幻电影里在人脑中植入芯片或许在当下无法实现,但当下可以借助AI人工智能实现人类第二脑”(大概是这个意思)更多内容,可关注公众号“一名程序媛”,我们一起从0-1学编程基本概念AI人工智能NLP自然语言处理LLM大语言模型HuggingFace一个提供了丰富的预训练模型和工具库的平台网站Ollama开源的本地大语言模型运行框架,用来在本地部署调用大语言模型,如D</div>
                    </li>
                    <li><a href="/article/1899443585930031104.htm"
                           title="Vue-前端发展史" target="_blank">Vue-前端发展史</a>
                        <span class="text-muted">lengzher_5601</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/html/1.htm">html</a><a class="tag" taget="_blank" href="/search/css/1.htm">css</a><a class="tag" taget="_blank" href="/search/js/1.htm">js</a><a class="tag" taget="_blank" href="/search/jsp/1.htm">jsp</a>
                        <div>文章目录Vue-前端发展史二、前端发展史1、UI框架2、JavaScript构建工具3、三端同一4、后端技术5、主流前端框架混合开发微信小程序Vue-前端发展史二、前端发展史1、UI框架Ant-Design:阿里巴巴出品,基于React的UI框架ElementUI、iview、ice:饿了么出品,基于Vue的UI框架BootStrap:Teitter推出的一个用于前端开发的开源工具包AmazeUI</div>
                    </li>
                    <li><a href="/article/1899442702450225152.htm"
                           title="HTML5 Canvas制作雪花飘落动画" target="_blank">HTML5 Canvas制作雪花飘落动画</a>
                        <span class="text-muted">坚持坚持那些年</span>

                        <div>本文还有配套的精品资源,点击获取简介:HTML5引入了Canvas元素,它赋予网页设计师丰富的绘图能力,允许通过JavaScript实现复杂的动画效果。本文将介绍如何结合HTML5的Canvas元素和JavaScript创建一个全屏的雪花飘落背景动画。通过定义雪花对象、创建雪花数组、编写主循环并利用requestAnimationFrame来绘制和更新雪花位置,我们能够实现一个逼真的雪花飘落动画效</div>
                    </li>
                    <li><a href="/article/1899442702886432768.htm"
                           title="Poe AI推出Previews预览功能!对标Claude Artifacts!" target="_blank">Poe AI推出Previews预览功能!对标Claude Artifacts!</a>
                        <span class="text-muted">AI信息Gap</span>
<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/ai/1.htm">ai</a><a class="tag" taget="_blank" href="/search/gpt/1.htm">gpt</a><a class="tag" taget="_blank" href="/search/OpenAI/1.htm">OpenAI</a><a class="tag" taget="_blank" href="/search/chatgpt/1.htm">chatgpt</a>
                        <div>Anthropic在发布最新模型Claude3.5Sonnet时,同时官宣了一个针对ClaudeAI重要的更新,那就是Artifacts。新功能Artifacts允许Claude用户在与聊天机器人的对话之外,通过一个专门的窗口分享、编辑和构建重要的独立内容。这些内容通常是超过15行的文本、代码片段、HTML网页、SVG图像、图表和交互式React组件等。用户可以在专用窗口中查看、复制和编辑这些内容</div>
                    </li>
                    <li><a href="/article/1899442703771430912.htm"
                           title="用 Claude3.5 从零写扫雷游戏-实现蜂窝地图" target="_blank">用 Claude3.5 从零写扫雷游戏-实现蜂窝地图</a>
                        <span class="text-muted">selfboot0</span>
<a class="tag" taget="_blank" href="/search/AI%E7%BC%96%E7%A8%8B/1.htm">AI编程</a><a class="tag" taget="_blank" href="/search/ai/1.htm">ai</a><a class="tag" taget="_blank" href="/search/chatgpt/1.htm">chatgpt</a>
                        <div>上一篇用Claude3.5从零写扫雷游戏-基本功能篇中,在Claude3.5的帮助下,我这前端小白也基本完成了一个完整的扫雷游戏。不过只是传统的方格扫雷,如果换成蜂窝扫雷游戏,Claude3.5能实现吗?先来看成果吧,可以在在线扫雷游戏中体验:Claude3.5蜂窝扫雷实现考虑到前面已经实现了基本的方格扫雷,并且我们很机智的把逻辑,渲染,UI组件都分开了。那么实现蜂窝状的扫雷,也可以按照这个思路来</div>
                    </li>
                    <li><a href="/article/1899442443250626560.htm"
                           title="Python机器学习实战:使用Flask构建机器学习API" target="_blank">Python机器学习实战:使用Flask构建机器学习API</a>
                        <span class="text-muted">AI天才研究院</span>
<a class="tag" taget="_blank" href="/search/DeepSeek/1.htm">DeepSeek</a><a class="tag" taget="_blank" href="/search/R1/1.htm">R1</a><a class="tag" taget="_blank" href="/search/%26amp%3B/1.htm">&</a><a class="tag" taget="_blank" href="/search/%E5%A4%A7%E6%95%B0%E6%8D%AEAI%E4%BA%BA%E5%B7%A5%E6%99%BA%E8%83%BD%E5%A4%A7%E6%A8%A1%E5%9E%8B/1.htm">大数据AI人工智能大模型</a><a class="tag" taget="_blank" href="/search/AI%E5%A4%A7%E6%A8%A1%E5%9E%8B%E4%BC%81%E4%B8%9A%E7%BA%A7%E5%BA%94%E7%94%A8%E5%BC%80%E5%8F%91%E5%AE%9E%E6%88%98/1.htm">AI大模型企业级应用开发实战</a><a class="tag" taget="_blank" href="/search/%E5%A4%A7%E5%8E%82Offer%E6%94%B6%E5%89%B2%E6%9C%BA/1.htm">大厂Offer收割机</a><a class="tag" taget="_blank" href="/search/%E9%9D%A2%E8%AF%95%E9%A2%98/1.htm">面试题</a><a class="tag" taget="_blank" href="/search/%E7%AE%80%E5%8E%86/1.htm">简历</a><a class="tag" taget="_blank" href="/search/%E7%A8%8B%E5%BA%8F%E5%91%98%E8%AF%BB%E4%B9%A6/1.htm">程序员读书</a><a class="tag" taget="_blank" href="/search/%E7%A1%85%E5%9F%BA%E8%AE%A1%E7%AE%97/1.htm">硅基计算</a><a class="tag" taget="_blank" href="/search/%E7%A2%B3%E5%9F%BA%E8%AE%A1%E7%AE%97/1.htm">碳基计算</a><a class="tag" taget="_blank" href="/search/%E8%AE%A4%E7%9F%A5%E8%AE%A1%E7%AE%97/1.htm">认知计算</a><a class="tag" taget="_blank" href="/search/%E7%94%9F%E7%89%A9%E8%AE%A1%E7%AE%97/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/%E7%A5%9E%E7%BB%8F%E7%BD%91%E7%BB%9C/1.htm">神经网络</a><a class="tag" taget="_blank" href="/search/%E5%A4%A7%E6%95%B0%E6%8D%AE/1.htm">大数据</a><a class="tag" taget="_blank" href="/search/AIGC/1.htm">AIGC</a><a class="tag" taget="_blank" href="/search/AGI/1.htm">AGI</a><a class="tag" taget="_blank" href="/search/LLM/1.htm">LLM</a><a class="tag" taget="_blank" href="/search/Java/1.htm">Java</a><a class="tag" taget="_blank" href="/search/Python/1.htm">Python</a><a class="tag" taget="_blank" href="/search/%E6%9E%B6%E6%9E%84%E8%AE%BE%E8%AE%A1/1.htm">架构设计</a><a class="tag" taget="_blank" href="/search/Agent/1.htm">Agent</a><a class="tag" taget="_blank" href="/search/%E7%A8%8B%E5%BA%8F%E5%91%98%E5%AE%9E%E7%8E%B0%E8%B4%A2%E5%AF%8C%E8%87%AA%E7%94%B1/1.htm">程序员实现财富自由</a>
                        <div>Python机器学习实战:使用Flask构建机器学习API作者:禅与计算机程序设计艺术/ZenandtheArtofComputerProgramming1.背景介绍1.1问题的由来在数据科学和机器学习领域,模型训练和部署一直是重要的挑战。传统的机器学习项目往往采用独立的脚本或复杂的流程,难以实现模型的自动化、可视化和复现。为了解决这一问题,将机器学习模型封装成可访问的API变得越来越流行。Fla</div>
                    </li>
                    <li><a href="/article/1899441812041428992.htm"
                           title="Html5学习教程,从入门到精通, HTML5超链接应用的详细语法知识点和案例代码(18)" target="_blank">Html5学习教程,从入门到精通, HTML5超链接应用的详细语法知识点和案例代码(18)</a>
                        <span class="text-muted">知识分享小能手</span>
<a class="tag" taget="_blank" href="/search/%E7%BD%91%E9%A1%B5%E5%BC%80%E5%8F%91/1.htm">网页开发</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF%E5%BC%80%E5%8F%91/1.htm">前端开发</a><a class="tag" taget="_blank" href="/search/%E7%BC%96%E7%A8%8B%E8%AF%AD%E8%A8%80%E5%A6%82%E9%97%A8/1.htm">编程语言如门</a><a class="tag" taget="_blank" href="/search/html5/1.htm">html5</a><a class="tag" taget="_blank" href="/search/%E5%AD%A6%E4%B9%A0/1.htm">学习</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><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/css3/1.htm">css3</a>
                        <div>HTML5超链接应用的详细语法知识点和案例代码超链接(Hyperlink),也称为跃点链接,是互联网和文档编辑中的一种重要概念。超链接的定义超链接是指从一个网页指向一个目标的连接关系,这个目标可以是另一个网页,也可以是相同网页上的不同位置,还可以是一个图片、动画、程序、电子邮件地址、文件,甚至是一个音视频文件。如果点击了这个链接,当前页面的位置就会跳转到被链接的目标位置。在文档编辑中,超链接可以链</div>
                    </li>
                    <li><a href="/article/1899441810997047296.htm"
                           title="Java快排算法详解" target="_blank">Java快排算法详解</a>
                        <span class="text-muted">大梦谁先觉i</span>
<a class="tag" taget="_blank" href="/search/%E6%95%B0%E6%8D%AE%E7%BB%93%E6%9E%84%E4%B8%8E%E7%AE%97%E6%B3%95/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/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/%E6%8E%92%E5%BA%8F%E7%AE%97%E6%B3%95/1.htm">排序算法</a>
                        <div>快排算法底层基本思想:先取出数列中的第一个数作为基准数。将数列中比基准数大的数全部放在他的右边,比基准数小的数全部放在它的左边。然后在对左右两部分重复第二步,直到各个区间只有一个数。具体Java代码实现publicclassQuickSort{publicstaticvoidsort(int[]array,intlow,inthigh){if(low=benchmark){high--;}//比基</div>
                    </li>
                    <li><a href="/article/1899440424783769600.htm"
                           title="一张表多少记录,会成为大表?如何计算" target="_blank">一张表多少记录,会成为大表?如何计算</a>
                        <span class="text-muted">18你磊哥</span>
<a class="tag" taget="_blank" href="/search/mysql/1.htm">mysql</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/mysql/1.htm">mysql</a>
                        <div>首先,“大表”的定义并不是绝对的。不同的数据库系统、不同的硬件配置、不同的查询模式,对“大”的定义可能都不一样。比如,对于MySQL来说,百万级别的记录可能已经算大表,而对于一些分布式数据库,可能处理十亿级别的数据才算挑战。接下来,用户可能想知道如何判断自己的表是否过大,以及如何计算这个阈值。这时候,我需要考虑几个方面:数据量、性能指标、存储引擎的特性、索引情况、查询复杂度等。数据量方面,表的记录</div>
                    </li>
                    <li><a href="/article/1899439542939742208.htm"
                           title="Django框架的全面指南:从入门到高级" target="_blank">Django框架的全面指南:从入门到高级</a>
                        <span class="text-muted">步入烟尘</span>
<a class="tag" taget="_blank" href="/search/Python%E8%B6%85%E5%85%A5%E9%97%A8%E6%8C%87%E5%8D%97%E5%85%A8%E5%86%8C/1.htm">Python超入门指南全册</a><a class="tag" taget="_blank" href="/search/django/1.htm">django</a><a class="tag" taget="_blank" href="/search/sqlite/1.htm">sqlite</a><a class="tag" taget="_blank" href="/search/%E6%95%B0%E6%8D%AE%E5%BA%93/1.htm">数据库</a>
                        <div>本文已收录于《Python超入门指南全册》本专栏专门针对零基础和需要进阶提升的同学所准备的一套完整教学,从基础到精通不断进阶深入,后续还有实战项目,轻松应对面试,专栏订阅地址:https://blog.csdn.net/mrdeam/category_12647587.html优点:订阅限时19.9付费专栏,私信博主还可进入全栈VIP答疑群,作者优先解答机会(代码指导、远程服务),群里大佬众多可以</div>
                    </li>
                    <li><a href="/article/1899438534327070720.htm"
                           title="Web前端发展史" target="_blank">Web前端发展史</a>
                        <span class="text-muted">王珍岩</span>
<a class="tag" taget="_blank" href="/search/%E7%AC%94%E8%AE%B0/1.htm">笔记</a>
                        <div>1、静态页面阶段那是1990年的12月25日,恰是西方的圣诞节,TimBerners-Lee在他的NeXT电脑上部署了第一套“主机-网站-浏览器”构成的Web系统,这标志BS架构的网站应用软件的开端,也是前端工程的开端。1993年4月Mosaic浏览器作为第一款正式的浏览器发布。1994年11月,鼎鼎大名的Navigator浏览器发布发布了,到年底W3C在Berners-Lee的主持下成立,标志着</div>
                    </li>
                    <li><a href="/article/1899438192701009920.htm"
                           title="大模型全军覆没,中科院自动化所推出多图数学推理新基准 | CVPR 2025" target="_blank">大模型全军覆没,中科院自动化所推出多图数学推理新基准 | CVPR 2025</a>
                        <span class="text-muted"></span>
<a class="tag" taget="_blank" href="/search/%E9%87%8F%E5%AD%90%E4%BD%8D/1.htm">量子位</a>
                        <div>关注前沿科技量子位挑战多图数学推理新基准,大模型直接全军覆没?!事情是这样的。近日,中国科学院自动化研究所推出多图数学推理全新基准MV-MATH(该工作已被CVPR2025录用),这是一个精心策划的多图数学推理数据集,旨在全面评估MLLM(多模态大语言模型)在多视觉场景中的数学推理能力。结果评估下来发现,GPT-4o仅得分32.1,类o1模型QvQ得分29.3,所有模型均不及格。具体咋回事,下面接</div>
                    </li>
                    <li><a href="/article/1899437686805032960.htm"
                           title="项目风险分析报告怎么写" target="_blank">项目风险分析报告怎么写</a>
                        <span class="text-muted"></span>
<a class="tag" taget="_blank" href="/search/%E9%A1%B9%E7%9B%AE%E9%A3%8E%E9%99%A9%E8%AF%84%E4%BC%B0/1.htm">项目风险评估</a>
                        <div>厘清项目背景、识别关键风险源、评估发生概率与影响、制定对应应对方案,是写好项目风险分析报告的四大核心步骤。看似简单的条目,却在实际操作中蕴含着深厚的方法论与经验积累。我个人特别强调“识别关键风险源”,因为若定位不准、范围过宽或过窄,都可能导致资源浪费或风险漏判。掌握准确的风险范围能帮助我们在后续的评估和应对阶段精准发力,避免将过多精力投入到不具备实际威胁的环节中。“识别关键风险源”的实质是通过系统</div>
                    </li>
                    <li><a href="/article/1899437652256550912.htm"
                           title="Canvas资源宝典:全面探索HTML5 Canvas技术" target="_blank">Canvas资源宝典:全面探索HTML5 Canvas技术</a>
                        <span class="text-muted">支然苹</span>

                        <div>Canvas资源宝典:全面探索HTML5Canvas技术awesome-canvasAcuratedlistofawesomeHTML5Canvaswithexamples,relatedarticlesandposts.项目地址:https://gitcode.com/gh_mirrors/aw/awesome-canvas一、项目介绍项目概述awesome-canvas是由RaphaëlMor</div>
                    </li>
                    <li><a href="/article/1899437526028972032.htm"
                           title="探索创新:CanvasParticles - 点燃你的网页动态效果" target="_blank">探索创新:CanvasParticles - 点燃你的网页动态效果</a>
                        <span class="text-muted">柏赢安Simona</span>

                        <div>探索创新:CanvasParticles-点燃你的网页动态效果去发现同类优质开源项目:https://gitcode.com/是一个开源的JavaScript库,专注于在HTML5Canvas上创建引人入胜的粒子动画效果。如果你是Web开发者,正在寻找一种方法为你的网站增添独特的视觉吸引力,那么这个项目绝对值得你深入了解。项目简介CanvasParticles提供了一套简洁而强大的API,让你能够</div>
                    </li>
                    <li><a href="/article/1899437273754169344.htm"
                           title="探索Coco-Web:一款强大的H5创作工具" target="_blank">探索Coco-Web:一款强大的H5创作工具</a>
                        <span class="text-muted">岑晔含Dora</span>

                        <div>探索Coco-Web:一款强大的H5创作工具去发现同类优质开源项目:https://gitcode.com/是一个开源的、基于Web的H5(HTML5)创作平台,旨在让开发者和设计师能够轻松地创建互动式的内容和应用。通过其直观的界面和丰富的功能,无论你是编程高手还是初学者,都能够利用Coco-Web制作出富有吸引力的数字内容。技术分析Coco-Web基于现代Web技术构建,包括:React.js:</div>
                    </li>
                    <li><a href="/article/1899437021672304640.htm"
                           title="探索CoreHTML5Canvas:创作动态Web图形的新工具" target="_blank">探索CoreHTML5Canvas:创作动态Web图形的新工具</a>
                        <span class="text-muted">郁英忆</span>

                        <div>探索CoreHTML5Canvas:创作动态Web图形的新工具去发现同类优质开源项目:https://gitcode.com/是一个强大的JavaScript库,专为开发者设计,旨在简化和增强在Web上创建交互式和动画图形的能力。这个项目利用HTML5Canvas元素,提供了一个简洁且高效的API,让开发人员可以轻松地构建出丰富的2D渲染效果。技术分析HTML5Canvas是HTML5的一个重要特</div>
                    </li>
                                <li><a href="/article/112.htm"
                                       title="HQL之投影查询" target="_blank">HQL之投影查询</a>
                                    <span class="text-muted">归来朝歌</span>
<a class="tag" taget="_blank" href="/search/HQL/1.htm">HQL</a><a class="tag" taget="_blank" href="/search/Hibernate/1.htm">Hibernate</a><a class="tag" taget="_blank" href="/search/%E6%9F%A5%E8%AF%A2%E8%AF%AD%E5%8F%A5/1.htm">查询语句</a><a class="tag" taget="_blank" href="/search/%E6%8A%95%E5%BD%B1%E6%9F%A5%E8%AF%A2/1.htm">投影查询</a>
                                    <div>        在HQL查询中,常常面临这样一个场景,对于多表查询,是要将一个表的对象查出来还是要只需要每个表中的几个字段,最后放在一起显示? 
针对上面的场景,如果需要将一个对象查出来: 
HQL语句写“from 对象”即可 
Session session = HibernateUtil.openSession();
		</div>
                                </li>
                                <li><a href="/article/239.htm"
                                       title="Spring整合redis" target="_blank">Spring整合redis</a>
                                    <span class="text-muted">bylijinnan</span>
<a class="tag" taget="_blank" href="/search/redis/1.htm">redis</a>
                                    <div>pom.xml 
 

<dependencies>
		<!-- Spring Data - Redis Library -->
		<dependency>
			<groupId>org.springframework.data</groupId>
			<artifactId>spring-data-redi</div>
                                </li>
                                <li><a href="/article/366.htm"
                                       title="org.hibernate.NonUniqueResultException: query did not return a unique result: 2" target="_blank">org.hibernate.NonUniqueResultException: query did not return a unique result: 2</a>
                                    <span class="text-muted">0624chenhong</span>
<a class="tag" taget="_blank" href="/search/Hibernate/1.htm">Hibernate</a>
                                    <div>参考:http://blog.csdn.net/qingfeilee/article/details/7052736 
org.hibernate.NonUniqueResultException: query did not return a unique result: 2 
        在项目中出现了org.hiber</div>
                                </li>
                                <li><a href="/article/493.htm"
                                       title="android动画效果" target="_blank">android动画效果</a>
                                    <span class="text-muted">不懂事的小屁孩</span>
<a class="tag" taget="_blank" href="/search/android%E5%8A%A8%E7%94%BB/1.htm">android动画</a>
                                    <div>前几天弄alertdialog和popupwindow的时候,用到了android的动画效果,今天专门研究了一下关于android的动画效果,列出来,方便以后使用。 
 
Android 平台提供了两类动画。 一类是Tween动画,就是对场景里的对象不断的进行图像变化来产生动画效果(旋转、平移、放缩和渐变)。 
第二类就是 Frame动画,即顺序的播放事先做好的图像,与gif图片原理类似。 
 
</div>
                                </li>
                                <li><a href="/article/620.htm"
                                       title="js delete 删除机理以及它的内存泄露问题的解决方案" target="_blank">js delete 删除机理以及它的内存泄露问题的解决方案</a>
                                    <span class="text-muted">换个号韩国红果果</span>
<a class="tag" taget="_blank" href="/search/JavaScript/1.htm">JavaScript</a>
                                    <div>delete删除属性时只是解除了属性与对象的绑定,故当属性值为一个对象时,删除时会造成内存泄露  (其实还未删除) 
举例: 

var person={name:{firstname:'bob'}}
var p=person.name
delete person.name
p.firstname  -->'bob'
// 依然可以访问p.firstname,存在内存泄露</div>
                                </li>
                                <li><a href="/article/747.htm"
                                       title="Oracle将零干预分析加入网络即服务计划" target="_blank">Oracle将零干预分析加入网络即服务计划</a>
                                    <span class="text-muted">蓝儿唯美</span>
<a class="tag" taget="_blank" href="/search/oracle/1.htm">oracle</a>
                                    <div>由Oracle通信技术部门主导的演示项目并没有在本月较早前法国南斯举行的行业集团TM论坛大会中获得嘉奖。但是,Oracle通信官员解雇致力于打造一个支持零干预分配和编制功能的网络即服务(NaaS)平台,帮助企业以更灵活和更适合云的方式实现通信服务提供商(CSP)的连接产品。这个Oracle主导的项目属于TM Forum Live!活动上展示的Catalyst计划的19个项目之一。Catalyst计</div>
                                </li>
                                <li><a href="/article/874.htm"
                                       title="spring学习——springmvc(二)" target="_blank">spring学习——springmvc(二)</a>
                                    <span class="text-muted">a-john</span>
<a class="tag" taget="_blank" href="/search/springMVC/1.htm">springMVC</a>
                                    <div>Spring MVC提供了非常方便的文件上传功能。 
1,配置Spring支持文件上传: 
DispatcherServlet本身并不知道如何处理multipart的表单数据,需要一个multipart解析器把POST请求的multipart数据中抽取出来,这样DispatcherServlet就能将其传递给我们的控制器了。为了在Spring中注册multipart解析器,需要声明一个实现了Mul</div>
                                </li>
                                <li><a href="/article/1001.htm"
                                       title="POJ-2828-Buy Tickets" target="_blank">POJ-2828-Buy Tickets</a>
                                    <span class="text-muted">aijuans</span>
<a class="tag" taget="_blank" href="/search/ACM_POJ/1.htm">ACM_POJ</a>
                                    <div>POJ-2828-Buy Tickets 
http://poj.org/problem?id=2828 
线段树,逆序插入 
 
#include<iostream>#include<cstdio>#include<cstring>#include<cstdlib>using namespace std;#define N 200010struct</div>
                                </li>
                                <li><a href="/article/1128.htm"
                                       title="Java Ant build.xml详解" target="_blank">Java Ant build.xml详解</a>
                                    <span class="text-muted">asia007</span>
<a class="tag" taget="_blank" href="/search/build.xml/1.htm">build.xml</a>
                                    <div>1,什么是antant是构建工具2,什么是构建概念到处可查到,形象来说,你要把代码从某个地方拿来,编译,再拷贝到某个地方去等等操作,当然不仅与此,但是主要用来干这个3,ant的好处跨平台   --因为ant是使用java实现的,所以它跨平台使用简单--与ant的兄弟make比起来语法清晰--同样是和make相比功能强大--ant能做的事情很多,可能你用了很久,你仍然不知道它能有</div>
                                </li>
                                <li><a href="/article/1255.htm"
                                       title="android按钮监听器的四种技术" target="_blank">android按钮监听器的四种技术</a>
                                    <span class="text-muted">百合不是茶</span>
<a class="tag" taget="_blank" href="/search/android/1.htm">android</a><a class="tag" taget="_blank" href="/search/xml%E9%85%8D%E7%BD%AE/1.htm">xml配置</a><a class="tag" taget="_blank" href="/search/%E7%9B%91%E5%90%AC%E5%99%A8/1.htm">监听器</a><a class="tag" taget="_blank" href="/search/%E5%AE%9E%E7%8E%B0%E6%8E%A5%E5%8F%A3/1.htm">实现接口</a>
                                    <div>android开发中经常会用到各种各样的监听器,android监听器的写法与java又有不同的地方;  
  
1,activity中使用内部类实现接口 ,创建内部类实例  使用add方法  与java类似 
  
创建监听器的实例 
myLis lis = new myLis(); 
  
使用add方法给按钮添加监听器 
 </div>
                                </li>
                                <li><a href="/article/1382.htm"
                                       title="软件架构师不等同于资深程序员" target="_blank">软件架构师不等同于资深程序员</a>
                                    <span class="text-muted">bijian1013</span>
<a class="tag" taget="_blank" href="/search/%E7%A8%8B%E5%BA%8F%E5%91%98/1.htm">程序员</a><a class="tag" taget="_blank" href="/search/%E6%9E%B6%E6%9E%84%E5%B8%88/1.htm">架构师</a><a class="tag" taget="_blank" href="/search/%E6%9E%B6%E6%9E%84%E8%AE%BE%E8%AE%A1/1.htm">架构设计</a>
                                    <div>        本文的作者Armel Nene是ETAPIX Global公司的首席架构师,他居住在伦敦,他参与过的开源项目包括 Apache Lucene,,Apache Nutch, Liferay 和 Pentaho等。 
        如今很多的公司</div>
                                </li>
                                <li><a href="/article/1509.htm"
                                       title="TeamForge Wiki Syntax & CollabNet User Information Center" target="_blank">TeamForge Wiki Syntax & CollabNet User Information Center</a>
                                    <span class="text-muted">sunjing</span>
<a class="tag" taget="_blank" href="/search/TeamForge/1.htm">TeamForge</a><a class="tag" taget="_blank" href="/search/How+do/1.htm">How do</a><a class="tag" taget="_blank" href="/search/Attachement/1.htm">Attachement</a><a class="tag" taget="_blank" href="/search/Anchor/1.htm">Anchor</a><a class="tag" taget="_blank" href="/search/Wiki+Syntax/1.htm">Wiki Syntax</a>
                                    <div>the CollabNet user information center http://help.collab.net/ 
  
How do I create a new Wiki page? 
A CollabNet TeamForge project can have any number of Wiki pages. All Wiki pages are linked, and</div>
                                </li>
                                <li><a href="/article/1636.htm"
                                       title="【Redis四】Redis数据类型" target="_blank">【Redis四】Redis数据类型</a>
                                    <span class="text-muted">bit1129</span>
<a class="tag" taget="_blank" href="/search/redis/1.htm">redis</a>
                                    <div>概述 
Redis是一个高性能的数据结构服务器,称之为数据结构服务器的原因是,它提供了丰富的数据类型以满足不同的应用场景,本文对Redis的数据类型以及对这些类型可能的操作进行总结。 
Redis常用的数据类型包括string、set、list、hash以及sorted set.Redis本身是K/V系统,这里的数据类型指的是value的类型,而不是key的类型,key的类型只有一种即string</div>
                                </li>
                                <li><a href="/article/1763.htm"
                                       title="SSH2整合-附源码" target="_blank">SSH2整合-附源码</a>
                                    <span class="text-muted">白糖_</span>
<a class="tag" taget="_blank" href="/search/eclipse/1.htm">eclipse</a><a class="tag" taget="_blank" href="/search/spring/1.htm">spring</a><a class="tag" taget="_blank" href="/search/tomcat/1.htm">tomcat</a><a class="tag" taget="_blank" href="/search/Hibernate/1.htm">Hibernate</a><a class="tag" taget="_blank" href="/search/Google/1.htm">Google</a>
                                    <div>今天用eclipse终于整合出了struts2+hibernate+spring框架。 
我创建的是tomcat项目,需要有tomcat插件。导入项目以后,鼠标右键选择属性,然后再找到“tomcat”项,勾选一下“Is a tomcat project”即可。具体方法见源码里的jsp图片,sql也在源码里。 
  
  
补充1:项目中部分jar包不是最新版的,可能导</div>
                                </li>
                                <li><a href="/article/1890.htm"
                                       title="[转]开源项目代码的学习方法" target="_blank">[转]开源项目代码的学习方法</a>
                                    <span class="text-muted">braveCS</span>
<a class="tag" taget="_blank" href="/search/%E5%AD%A6%E4%B9%A0%E6%96%B9%E6%B3%95/1.htm">学习方法</a>
                                    <div>转自: 
http://blog.sina.com.cn/s/blog_693458530100lk5m.html 
http://www.cnblogs.com/west-link/archive/2011/06/07/2074466.html 
  
1)阅读features。以此来搞清楚该项目有哪些特性2)思考。想想如果自己来做有这些features的项目该如何构架3)下载并安装d</div>
                                </li>
                                <li><a href="/article/2017.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>package beautyOfCoding;

import java.util.Arrays;
import java.util.Random;

public class MaxSubArraySum2 {

	/**
	 * 编程之美 子数组之和的最大值(二维)
	 */
	private static final int ROW = 5;
	private stat</div>
                                </li>
                                <li><a href="/article/2144.htm"
                                       title="读书笔记-3" target="_blank">读书笔记-3</a>
                                    <span class="text-muted">chengxuyuancsdn</span>
<a class="tag" taget="_blank" href="/search/jquery%E7%AC%94%E8%AE%B0/1.htm">jquery笔记</a><a class="tag" taget="_blank" href="/search/resultMap%E9%85%8D%E7%BD%AE/1.htm">resultMap配置</a><a class="tag" taget="_blank" href="/search/ibatis%E4%B8%80%E5%AF%B9%E5%A4%9A%E9%85%8D%E7%BD%AE/1.htm">ibatis一对多配置</a>
                                    <div>1、resultMap配置 
2、ibatis一对多配置 
3、jquery笔记 
 
1、resultMap配置
当<select resultMap="topic_data">
<resultMap id="topic_data">必须一一对应。
(1)<resultMap class="tblTopic&q</div>
                                </li>
                                <li><a href="/article/2271.htm"
                                       title="[物理与天文]物理学新进展" target="_blank">[物理与天文]物理学新进展</a>
                                    <span class="text-muted">comsci</span>

                                    <div> 
 
      如果我们必须获得某种地球上没有的矿石,才能够进行某些能量输出装置的设计和建造,而要获得这种矿石,又必须首先进行深空探测,而要进行深空探测,又必须获得这种能量输出装置,这个矛盾的循环,会导致地球联盟在与宇宙文明建立关系的时候,陷入困境 
 
      怎么办呢? 
 
 </div>
                                </li>
                                <li><a href="/article/2398.htm"
                                       title="Oracle 11g新特性:Automatic Diagnostic Repository" target="_blank">Oracle 11g新特性:Automatic Diagnostic Repository</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/ADR/1.htm">ADR</a>
                                    <div>Oracle Database 11g的FDI(Fault Diagnosability Infrastructure)是自动化诊断方面的又一增强。 
FDI的一个关键组件是自动诊断库(Automatic Diagnostic Repository-ADR)。 
 
在oracle 11g中,alert文件的信息是以xml的文件格式存在的,另外提供了普通文本格式的alert文件。 
这两份log文</div>
                                </li>
                                <li><a href="/article/2525.htm"
                                       title="简单排序:选择排序" target="_blank">简单排序:选择排序</a>
                                    <span class="text-muted">dieslrae</span>
<a class="tag" taget="_blank" href="/search/%E9%80%89%E6%8B%A9%E6%8E%92%E5%BA%8F/1.htm">选择排序</a>
                                    <div>
    public void selectSort(int[] array){
        int select;
        
        for(int i=0;i<array.length;i++){
            select = i;
            
            for(int k=i+1;k<array.leng</div>
                                </li>
                                <li><a href="/article/2652.htm"
                                       title="C语言学习六指针的经典程序,互换两个数字" target="_blank">C语言学习六指针的经典程序,互换两个数字</a>
                                    <span class="text-muted">dcj3sjt126com</span>
<a class="tag" taget="_blank" href="/search/c/1.htm">c</a>
                                    <div>示例程序,swap_1和swap_2都是错误的,推理从1开始推到2,2没完成,推到3就完成了 
# include <stdio.h>

void swap_1(int, int);
void swap_2(int *, int *);
void swap_3(int *, int *);

int main(void)
{
	int a = 3;
	int b = </div>
                                </li>
                                <li><a href="/article/2779.htm"
                                       title="php 5.4中php-fpm 的重启、终止操作命令" target="_blank">php 5.4中php-fpm 的重启、终止操作命令</a>
                                    <span class="text-muted">dcj3sjt126com</span>
<a class="tag" taget="_blank" href="/search/PHP/1.htm">PHP</a>
                                    <div>php 5.4中php-fpm 的重启、终止操作命令: 
查看php运行目录命令:which php/usr/bin/php 
查看php-fpm进程数:ps aux | grep -c php-fpm 
查看运行内存/usr/bin/php  -i|grep mem 
重启php-fpm/etc/init.d/php-fpm restart 
在phpinfo()输出内容可以看到php</div>
                                </li>
                                <li><a href="/article/2906.htm"
                                       title="线程同步工具类" target="_blank">线程同步工具类</a>
                                    <span class="text-muted">shuizhaosi888</span>
<a class="tag" taget="_blank" href="/search/%E5%90%8C%E6%AD%A5%E5%B7%A5%E5%85%B7%E7%B1%BB/1.htm">同步工具类</a>
                                    <div>同步工具类包括信号量(Semaphore)、栅栏(barrier)、闭锁(CountDownLatch) 
  
闭锁(CountDownLatch) 
public class RunMain {
	public long timeTasks(int nThreads, final Runnable task) throws InterruptedException {
		fin</div>
                                </li>
                                <li><a href="/article/3033.htm"
                                       title="bleeding edge是什么意思" target="_blank">bleeding edge是什么意思</a>
                                    <span class="text-muted">haojinghua</span>
<a class="tag" taget="_blank" href="/search/DI/1.htm">DI</a>
                                    <div>不止一次,看到很多讲技术的文章里面出现过这个词语。今天终于弄懂了——通过朋友给的浏览软件,上了wiki。  
我再一次感到,没有辞典能像WiKi一样,给出这样体贴人心、一清二楚的解释了。为了表达我对WiKi的喜爱,只好在此一一中英对照,给大家上次课。 
  
In computer science, bleeding edge is a term that </div>
                                </li>
                                <li><a href="/article/3160.htm"
                                       title="c中实现utf8和gbk的互转" target="_blank">c中实现utf8和gbk的互转</a>
                                    <span class="text-muted">jimmee</span>
<a class="tag" taget="_blank" href="/search/c/1.htm">c</a><a class="tag" taget="_blank" href="/search/iconv/1.htm">iconv</a><a class="tag" taget="_blank" href="/search/utf8%26gbk%E7%BC%96%E7%A0%81/1.htm">utf8&gbk编码</a>
                                    <div>#include <iconv.h>
#include <stdlib.h>
#include <stdio.h>
#include <unistd.h>
#include <fcntl.h>
#include <string.h>
#include <sys/stat.h>

int code_c</div>
                                </li>
                                <li><a href="/article/3287.htm"
                                       title="大型分布式网站架构设计与实践" target="_blank">大型分布式网站架构设计与实践</a>
                                    <span class="text-muted">lilin530</span>
<a class="tag" taget="_blank" href="/search/%E5%BA%94%E7%94%A8%E6%9C%8D%E5%8A%A1%E5%99%A8/1.htm">应用服务器</a><a class="tag" taget="_blank" href="/search/%E6%90%9C%E7%B4%A2%E5%BC%95%E6%93%8E/1.htm">搜索引擎</a>
                                    <div>1.大型网站软件系统的特点? 
a.高并发,大流量。 
b.高可用。 
c.海量数据。 
d.用户分布广泛,网络情况复杂。 
e.安全环境恶劣。 
f.需求快速变更,发布频繁。 
g.渐进式发展。 
 
2.大型网站架构演化发展历程? 
a.初始阶段的网站架构。 
应用程序,数据库,文件等所有的资源都在一台服务器上。 
b.应用服务器和数据服务器分离。 
c.使用缓存改善网站性能。 
d.使用应用</div>
                                </li>
                                <li><a href="/article/3414.htm"
                                       title="在代码中获取Android theme中的attr属性值" target="_blank">在代码中获取Android theme中的attr属性值</a>
                                    <span class="text-muted">OliveExcel</span>
<a class="tag" taget="_blank" href="/search/android/1.htm">android</a><a class="tag" taget="_blank" href="/search/theme/1.htm">theme</a>
                                    <div>Android的Theme是由各种attr组合而成, 每个attr对应了这个属性的一个引用, 这个引用又可以是各种东西. 
  
在某些情况下, 我们需要获取非自定义的主题下某个属性的内容 (比如拿到系统默认的配色colorAccent), 操作方式举例一则: 
int defaultColor = 0xFF000000;
int[] attrsArray = { andorid.r.</div>
                                </li>
                                <li><a href="/article/3541.htm"
                                       title="基于Zookeeper的分布式共享锁" target="_blank">基于Zookeeper的分布式共享锁</a>
                                    <span class="text-muted">roadrunners</span>
<a class="tag" taget="_blank" href="/search/zookeeper/1.htm">zookeeper</a><a class="tag" taget="_blank" href="/search/%E5%88%86%E5%B8%83%E5%BC%8F/1.htm">分布式</a><a class="tag" taget="_blank" href="/search/%E5%85%B1%E4%BA%AB%E9%94%81/1.htm">共享锁</a>
                                    <div>首先,说说我们的场景,订单服务是做成集群的,当两个以上结点同时收到一个相同订单的创建指令,这时并发就产生了,系统就会重复创建订单。等等......场景。这时,分布式共享锁就闪亮登场了。 
  
共享锁在同一个进程中是很容易实现的,但在跨进程或者在不同Server之间就不好实现了。Zookeeper就很容易实现。具体的实现原理官网和其它网站也有翻译,这里就不在赘述了。 
  
官</div>
                                </li>
                                <li><a href="/article/3668.htm"
                                       title="两个容易被忽略的MySQL知识" target="_blank">两个容易被忽略的MySQL知识</a>
                                    <span class="text-muted">tomcat_oracle</span>
<a class="tag" taget="_blank" href="/search/mysql/1.htm">mysql</a>
                                    <div>1、varchar(5)可以存储多少个汉字,多少个字母数字?     相信有好多人应该跟我一样,对这个已经很熟悉了,根据经验我们能很快的做出决定,比如说用varchar(200)去存储url等等,但是,即使你用了很多次也很熟悉了,也有可能对上面的问题做出错误的回答。     这个问题我查了好多资料,有的人说是可以存储5个字符,2.5个汉字(每个汉字占用两个字节的话),有的人说这个要区分版本,5.0</div>
                                </li>
                                <li><a href="/article/3795.htm"
                                       title="zoj 3827 Information Entropy(水题)" target="_blank">zoj 3827 Information Entropy(水题)</a>
                                    <span class="text-muted">阿尔萨斯</span>
<a class="tag" taget="_blank" href="/search/format/1.htm">format</a>
                                    <div> 题目链接:zoj 3827 Information Entropy 
 题目大意:三种底,计算和。 
 解题思路:调用库函数就可以直接算了,不过要注意Pi = 0的时候,不过它题目里居然也讲了。。。limp→0+plogb(p)=0,因为p是logp的高阶。 
#include <cstdio>
#include <cstring>
#include <cmath&</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>