RioTian
RioTian

Web开发初探（系统理解Web知识点）

一、Web开发介绍

我们看到的网页通过代码来实现的 ，这些代码由浏览器解释并渲染成你看到的丰富多彩的页面效果。 这个浏览器就相当于Python的解释器，专门负责解释和执行(渲染）网页代码。

写网页的代码是专门的语言， 主要分为Hmtl 、 CSS 和 JavaScript​, 被称为网页开发三剑客，分别作用如下：

Html

超文本标记语言（英语：HyperText Markup Language，简称：HTML）是一种用于创建网页的标准标记语言。

主要负责编写页面架构，有点像建房子时，造的毛坯房。

CSS

CSS (Cascading Style Sheets) 用于渲染HTML元素标签的样式。

让你的网页样式变的丰富多彩起来，可以改变字体、颜色、排列方式、背景颜色等

相当于给你的毛坯房做装修

JavaScript

网页脚本语言，可以让你的网页动起来，比如一张图片鼠标放上去自动变大、一个按钮自动变色、提交表单时少填或填错了字段会提示报错等，都是JavaScript实现的。

Web开发初探（系统理解Web知识点）_第1张图片

以上3个 组件 是做网站开发都必须掌握的技能 ，我们接下来依次体验下~吧

二、HTML

2.1 HTML简介



  
    
    路飞学城
  
  

    
我的第一个标题

    
我的第一个段落。
  • 声明为 HTML5 文档
  • 元素是 HTML 页面的根元素
  • 标签用于定义文档的头部，它是所有头部元素的容器。 中的元素可以引用脚本、指示浏览器在哪里找到样式表、提供元信息等等。
  • 元素包含文档的元数据， 如定义网页编码格式为 utf-8、关键词啥的
  • </code>元素里描述了文档的标题</li> <li><code><body></code>元素包含了可见的页面内容</li> <li><code><h1></code>元素定义一个大标题</li> <li><code><p></code>元素定义一个段落</li> </ul> <p><strong>注：</strong>在浏览器的页面上使用键盘上的 F12 按键开启调试模式，就可以看到组成标签。</p> <h3 id="22--什么是html">2.2 什么是HTML?</h3> <p>HTML 是用来描述网页的一种语言。</p> <ul> <li>HTML 指的是超文本标记语言: <strong>H</strong>yper<strong>T</strong>ext <strong>M</strong>arkup <strong>L</strong>anguage</li> <li>HTML 不是一种编程语言，而是一种<strong>标记</strong>语言</li> <li>标记语言是一套<strong>标记标签</strong> (markup tag)</li> <li>HTML 使用标记标签来<strong>描述</strong>网页</li> <li>HTML 文档包含了HTML <strong>标签</strong>及<strong>文本</strong>内容</li> <li>HTML文档也叫做 <strong>web 页面</strong></li> </ul> <h4 id="html-标签">HTML 标签</h4> <p>HTML 标记标签通常被称为 HTML 标签 (HTML tag)。</p> <ul> <li>HTML 标签是由<em>尖括号</em>包围的关键词，比如 </li> <li>HTML 标签通常是<strong>成对出现</strong>的，比如<code><b></code> 和 <code></b></code>,标签对中的第一个标签是开始标签，第二个标签是结束标签</li> </ul> <h3 id="23-html网页结构">2.3 HTML网页结构</h3> <p>下面是一个可视化的HTML页面结构：</p> <p><a href="http://img.e-com-net.com/image/info8/78d4a3adbdbf42bfb37d23093c410354.jpg" target="_blank"><img src="http://img.e-com-net.com/image/info8/78d4a3adbdbf42bfb37d23093c410354.jpg" alt="Web开发初探（系统理解Web知识点）_第2张图片" width="650" height="314" style="border:1px solid black;"></a></p> <p>注意： 只有 <body> 区域 (白色部分) 才会在浏览器中显示。</p> <h2 id="三、html常用元素入门">三、HTML常用元素入门</h2> <h3 id="31-html标题">3.1 HTML标题</h3> <p><a href="http://img.e-com-net.com/image/info8/6c3f3107066543f8b3b8531aebe21cb1.jpg" target="_blank"><img src="http://img.e-com-net.com/image/info8/6c3f3107066543f8b3b8531aebe21cb1.jpg" alt="Web开发初探（系统理解Web知识点）_第3张图片" width="650" height="366" style="border:1px solid black;"></a></p> <h3 id="32-段落">3.2 段落</h3> <p><a href="http://img.e-com-net.com/image/info8/909ffde1096b4c4c9b70c1d1413d7477.jpg" target="_blank"><img src="http://img.e-com-net.com/image/info8/909ffde1096b4c4c9b70c1d1413d7477.jpg" alt="Web开发初探（系统理解Web知识点）_第4张图片" width="650" height="330" style="border:1px solid black;"></a></p> <h3 id="33-超链接">3.3 超链接</h3> <pre><code class="language-html"><body> <a href="https://www.luffycity.com">这是一个链接使用了 href 属性</a> </body> </code></pre> <p><a href="http://img.e-com-net.com/image/info8/8da32d7f6fce49169119cacd28260405.jpg" target="_blank"><img src="http://img.e-com-net.com/image/info8/8da32d7f6fce49169119cacd28260405.jpg" alt="Web开发初探（系统理解Web知识点）_第5张图片" width="650" height="249" style="border:1px solid black;"></a></p> <pre><code class="language-html"><a href="https://www.luffycity.com" target="_blank" >访问路飞学城</a> </code></pre> <p><code>target="_blank"</code>会打开一个新窗口</p> <h3 id="34-显示图片">3.4 显示图片</h3> <pre><code class="language-html"><img src="black_girl.jpg" width="600" height="500" > </code></pre> <h3 id="35-html表格">3.5 HTML表格</h3> <p>想在页面上显示这种表格怎么做？</p> <table> <thead> <tr> <th style="text-align:left">First Name</th> <th style="text-align:left">Last Name</th> <th style="text-align:left">Points</th> </tr> </thead> <tbody> <tr> <td style="text-align:left">Jill</td> <td style="text-align:left">Smith</td> <td style="text-align:left">50</td> </tr> <tr> <td style="text-align:left">Eve</td> <td style="text-align:left">Jackson</td> <td style="text-align:left">94</td> </tr> <tr> <td style="text-align:left">John</td> <td style="text-align:left">Doe</td> <td style="text-align:left">80</td> </tr> <tr> <td style="text-align:left">Adam</td> <td style="text-align:left">Johnson</td> <td style="text-align:left">67</td> </tr> </tbody> </table> <h4 id="先做个最简单的">先做个最简单的</h4> <pre><code class="language-html"><table border="1"> <tr> <td>row 1, cell 1</td> <td>row 1, cell 2</td> </tr> <tr> <td>row 2, cell 1</td> <td>row 2, cell 2</td> </tr> </table> </code></pre> <p>输出</p> <p><a href="http://img.e-com-net.com/image/info8/c4c3b48ed16d48088b16917d15300759.jpg" target="_blank"><img src="http://img.e-com-net.com/image/info8/c4c3b48ed16d48088b16917d15300759.jpg" alt="" width="650" height="78"></a></p> <h4 id="表格的表头">表格的表头</h4> <p>表格的表头使用 <th> 标签进行定义。</p> <pre><code class="language-html"><table border="1"> <tr> <th>Header 1</th> <th>Header 2</th> </tr> <tr> <td>row 1, cell 1</td> <td>row 1, cell 2</td> </tr> <tr> <td>row 2, cell 1</td> <td>row 2, cell 2</td> </tr> </table> </code></pre> <p>大多数浏览器会把表头显示为粗体居中的文本</p> <p><a href="http://img.e-com-net.com/image/info8/efa7e92bf86045e2b2a08614e627bf01.jpg" target="_blank"><img src="http://img.e-com-net.com/image/info8/efa7e92bf86045e2b2a08614e627bf01.jpg" alt="" width="650" height="91"></a></p> <p>可以加上边距</p> <pre><code class="language-html"><table border="1" cellpadding="10"> </code></pre> <p><a href="http://img.e-com-net.com/image/info8/ae9a285ef54545ee8cf3aff5948e9000.jpg" target="_blank"><img src="http://img.e-com-net.com/image/info8/ae9a285ef54545ee8cf3aff5948e9000.jpg" alt="Web开发初探（系统理解Web知识点）_第6张图片" width="424" height="268" style="border:1px solid black;"></a></p> <h3 id="36-列表">3.6 列表</h3> <p>分为有序列表 和 无序列表</p> <h4 id="有序列表">有序列表</h4> <pre><code class="language-html"><ol> <li>Coffee</li> <li>Tea</li> <li>Milk</li> </ol> <ol start="50"> <li>Coffee</li> <li>Tea</li> <li>Milk</li> </ol> </code></pre> <p>效果</p> <p><a href="http://img.e-com-net.com/image/info8/5a3b3d59020d465fa6e4ef80f02a093e.jpg" target="_blank"><img src="http://img.e-com-net.com/image/info8/5a3b3d59020d465fa6e4ef80f02a093e.jpg" alt="Web开发初探（系统理解Web知识点）_第7张图片" width="362" height="340" style="border:1px solid black;"></a></p> <h4 id="无序列表">无序列表</h4> <pre><code class="language-html"><ul> <li>Coffee</li> <li>Tea</li> <li>Milk</li> </ul> </code></pre> <p><a href="http://img.e-com-net.com/image/info8/2b4cd52666fd47589cc0bee640bcd7c3.jpg" target="_blank"><img src="http://img.e-com-net.com/image/info8/2b4cd52666fd47589cc0bee640bcd7c3.jpg" alt="Web开发初探（系统理解Web知识点）_第8张图片" width="462" height="334" style="border:1px solid black;"></a></p> <h4 id="嵌套列表">嵌套列表</h4> <pre><code class="language-html"><ul> <li>Coffee</li> <li>Tea <ul> <li>Black tea</li> <li>Green tea</li> </ul> </li> <li>Milk</li> </ul> </code></pre> <p><a href="http://img.e-com-net.com/image/info8/c3ae261c489246288ddb4f9813c70b11.jpg" target="_blank"><img src="http://img.e-com-net.com/image/info8/c3ae261c489246288ddb4f9813c70b11.jpg" alt="Web开发初探（系统理解Web知识点）_第9张图片" width="650" height="181" style="border:1px solid black;"></a></p> <h3 id="37-div区块元素">3.7 div区块元素</h3> <h4 id="html-区块元素">HTML 区块元素</h4> <p>大多数 HTML 元素被定义为<strong>块级元素</strong>或<strong>内联元素</strong>。</p> <p>块级元素在浏览器显示时，通常会以新行来开始（和结束）。</p> <p>实例: <h1>,<p>, <ul>, <table></p> <h4 id="html-内联元素">HTML 内联元素</h4> <p>内联元素在显示时通常不会以新行开始。</p> <p>实例: <b>, <td>, <a>, <img></p> <h4 id="html-div-元素">HTML <code><div></code> 元素</h4> <p>HTML <div> 元素是块级元素，它可用于组合其他 HTML 元素的容器。</p> <p><code><div></code> 元素没有特定的含义。如果与 CSS 一同使用，<div> 元素可用于对大的内容块设置样式属性。</p> <p><code><div></code> 元素的另一个常见的用途是文档布局。它取代了使用表格定义布局的老式方法。使用 <table> 元素进行文档布局不是表格的正确用法。</p> <h4 id="span-元素"><code><span></code> 元素</h4> <p>HTML <span> 元素是内联元素，可用作文本的容器</p> <p><span> 元素也没有特定的含义。当与 CSS 一同使用时，<span> 元素可用于为部分文本设置样式属性。</p> <h3 id="38-css样式初识">3.8 CSS样式初识</h3> <p>CSS (Cascading Style Sheets) 用于渲染HTML元素标签的样式。</p> <p>CSS 可以通过以下方式添加到HTML中:</p> <ul> <li>内联样式- 在HTML元素中使用"style" <strong>属性</strong></li> <li>内部样式表 -在HTML文档头部 <head> 区域使用<style> <strong>元素</strong> 来包含CSS</li> <li>外部引用 - 使用外部 CSS <strong>文件</strong></li> </ul> <h4 id="381-内联样式">3.8.1 内联样式</h4> <p>当特殊的样式需要应用到个别元素时，就可以使用内联样式。 使用内联样式的方法是在相关的标签中使用样式属性。样式属性可以包含任何 CSS 属性。以下实例显示出如何改变段落的颜色和左外边距。</p> <pre><code class="language-html"><p style="color:blue;margin-left:20px;">这是一个段落。</p> </code></pre> <h5 id="设置背景颜色">设置背景颜色</h5> <pre><code class="language-html"><body style="background-color:yellow;"> <h2 style="background-color:red;">这是一个标题</h2> <p style="background-color:green;">这是一个段落。</p> </body> </code></pre> <p><a href="http://img.e-com-net.com/image/info8/074bb9e64c014372b26e68b8e1003430.jpg" target="_blank"><img src="http://img.e-com-net.com/image/info8/074bb9e64c014372b26e68b8e1003430.jpg" alt="Web开发初探（系统理解Web知识点）_第10张图片" width="650" height="311" style="border:1px solid black;"></a></p> <h5 id="设置字体-字体颜色-，字体大小">设置字体, 字体颜色 ，字体大小</h5> <p>我们可以使用font-family（字体），color（颜色），和font-size（字体大小）属性来定义字体的样式:</p> <pre><code class="language-html"><h1 style="font-family:verdana;">一个标题</h1> <p style="font-family:arial;color:red;font-size:20px;">一个段落。</p> </code></pre> <h4 id="382-内部样式表">3.8.2 内部样式表</h4> <p>当单个文件需要特别样式时，就可以使用内部样式表。你可以在<head> 部分通过 <style>标签定义内部样式表:</p> <pre><code class="language-html"><head> <style type="text/css"> body {background-color:yellow;} p {color:blue;} </style> </head> </code></pre> <p>CSS 规则由两个主要的部分构成：选择器，以及一条或多条声明:</p> <p><a href="http://img.e-com-net.com/image/info8/0de731fc80af4b86a0e1a442b12bd25e.jpg" target="_blank"><img src="http://img.e-com-net.com/image/info8/0de731fc80af4b86a0e1a442b12bd25e.jpg" alt="Web开发初探（系统理解Web知识点）_第11张图片" width="570" height="120" style="border:1px solid black;"></a></p> <p>选择器通常是您需要改变样式的 HTML 元素。</p> <p>每条声明由一个属性和一个值组成。</p> <p>属性（property）是你希望设置的样式属性（style attribute）。每个属性有一个值。属性和值被冒号分开</p> <h4 id="383-外部样式表">3.8.3 外部样式表</h4> <p>当样式需要被应用到很多页面的时候，外部样式表将是理想的选择。使用外部样式表，你就可以通过更改一个文件来改变整个站点的外观。</p> <pre><code class="language-html"><head> <link rel="stylesheet" type="text/css" href="mystyle.css"> </head> </code></pre> <h3 id="39-网页布局">3.9 网页布局</h3> <p>网页布局主要使用div</p> <pre><code class="language-html"><body> <div id="header" style="background: darkorange; height: 100px;text-align: center "> Menu </div> <div id="content" style="background: aliceblue; height: 600px"> <div id="left-menu" style="height: 100%; width: 15%; background: deepskyblue; float: left"> 菜单 <ol> <li>HMTL</li> <li>CSS</li> <li>Javascript</li> </ol> </div> <div id="content-panel" style="background: aqua; height: 95%; width: 85%;float: left"> <p>这里是真正写内容的地方。。。</p> </div> </div> <div style="background: greenyellow; height: 50px"> footer </div> </body> </code></pre> <p>效果</p> <p><a href="http://img.e-com-net.com/image/info8/ac6be8bf8a614b75a915ee31958c4a26.jpg" target="_blank"><img src="http://img.e-com-net.com/image/info8/ac6be8bf8a614b75a915ee31958c4a26.jpg" alt="Web开发初探（系统理解Web知识点）_第12张图片" width="650" height="415" style="border:1px solid black;"></a></p> <h3 id="310-html-表单">3.10 Html 表单</h3> <p>当你想收集用户数据，提交到后台服务器时，你就可以用html 表单元素</p> <p>表单元素分为 文本框、下拉列表、单选、复选 、按钮</p> <h4 id="用户注册示例">用户注册示例</h4> <pre><code class="language-html"><form action="baidu_url"> 姓名: <input type="text" name="name"> <br> 电话: <input type="number" name="phone"> <br> <button>注册</button> </form> </code></pre> <p>一点击按钮，<code><form>.....</form></code> 表单里的数据都会被提交到<code>action="baidu_url"</code> 这个地址</p> <h4 id="其它常用输入类型">其它常用输入类型</h4> <pre><code class="language-html"><body> <form action="baidu_url"> 姓名: <input type="text" name="name"> <br> 电话: <input type="number" name="phone"> <br> 姓别: <input type="radio" name="sex" value="男">男 <input type="radio" name="sex" value="女">女 <br> 爱好: <input type="checkbox" name="hobbie" value="girl">姑娘 <input type="checkbox" name="hobbie" value="潜水">潜水 <input type="checkbox" name="hobbie" value="Python">Python <br> 喜欢的姑娘类型：<br> <select name="gilr_type"> <option value="1">胸大貌美大长腿</option> <option value="2">气质小可爱</option> <option value="3">妖娆性感</option> <optgroup label="按区域"> <option value="4">欧美</option> <option value="5">日韩</option> <option value="6">河南开封</option> </optgroup> </select> <br> 个人简介: <br> <textarea name="intro" placeholder="输入不省于50字的个人介绍" rows="3" cols="50" ></textarea> <br> 输入密码：<input type="password" name="password"> <br> <button>注册</button> </form> </body> </code></pre> <p>输出效果</p> <p><a href="http://img.e-com-net.com/image/info8/6ca29be5234540e8a4a024fe17d0ceb6.jpg" target="_blank"><img src="http://img.e-com-net.com/image/info8/6ca29be5234540e8a4a024fe17d0ceb6.jpg" alt="Web开发初探（系统理解Web知识点）_第13张图片" width="650" height="425" style="border:1px solid black;"></a></p> <h4 id="fieldset-表单集合">Fieldset 表单集合</h4> <pre><code class="language-html"><form> <fieldset> <legend>Personalia:</legend> Name: <input type="text"><br> Email: <input type="text"><br> Date of birth: <input type="text"> </fieldset> </form> </code></pre> <p>效果</p> <p><a href="http://img.e-com-net.com/image/info8/d08730e2a7244bc2a78d18932b6290dd.jpg" target="_blank"><img src="http://img.e-com-net.com/image/info8/d08730e2a7244bc2a78d18932b6290dd.jpg" alt="Web开发初探（系统理解Web知识点）_第14张图片" width="650" height="184" style="border:1px solid black;"></a></p> <h2 id="四、css样式基础">四、CSS样式基础</h2> <h3 id="41-css-id--class-选择器">4.1 CSS id \ class 选择器</h3> <h4 id="id选择器">id选择器</h4> <p>id就像一个元素的身份证地址，可以在网页里，<strong>唯一代表某个元素</strong>，我们也可以通过这个id快速找到它对应的元素对象</p> <p><a href="http://img.e-com-net.com/image/info8/fdf3525eadde4526adfd3d3ef0fcba84.jpg" target="_blank"><img src="http://img.e-com-net.com/image/info8/fdf3525eadde4526adfd3d3ef0fcba84.jpg" alt="Web开发初探（系统理解Web知识点）_第15张图片" width="650" height="457" style="border:1px solid black;"></a></p> <p>输出</p> <p><a href="http://img.e-com-net.com/image/info8/7a5cf99e266f44ed9d690b305f5a4225.jpg" target="_blank"><img src="http://img.e-com-net.com/image/info8/7a5cf99e266f44ed9d690b305f5a4225.jpg" alt="Web开发初探（系统理解Web知识点）_第16张图片" width="650" height="338" style="border:1px solid black;"></a></p> <h4 id="class-类选择器">class 类选择器</h4> <p>当你想给多个元素批量设置同样的一个样式的话，就可以使用类选择器</p> <p><a href="http://img.e-com-net.com/image/info8/7532ecdfc0e04135bc2e2e5c3b02d7b2.jpg" target="_blank"><img src="http://img.e-com-net.com/image/info8/7532ecdfc0e04135bc2e2e5c3b02d7b2.jpg" alt="Web开发初探（系统理解Web知识点）_第17张图片" width="650" height="370" style="border:1px solid black;"></a></p> <p>输出</p> <p><a href="http://img.e-com-net.com/image/info8/dcbd39a5fa1b450b9ef5e76d78978c6a.jpg" target="_blank"><img src="http://img.e-com-net.com/image/info8/dcbd39a5fa1b450b9ef5e76d78978c6a.jpg" alt="Web开发初探（系统理解Web知识点）_第18张图片" width="650" height="395" style="border:1px solid black;"></a></p> <h3 id="42-直接通过元素名设置样式">4.2 直接通过元素名设置样式</h3> <p>若你想给页面所有的<p> 或<input>标签加上同样的样式，可以直接通过元素名批量设置</p> <p><a href="http://img.e-com-net.com/image/info8/097ff73573d243aa99389195a2ede88e.jpg" target="_blank"><img src="http://img.e-com-net.com/image/info8/097ff73573d243aa99389195a2ede88e.jpg" alt="Web开发初探（系统理解Web知识点）_第19张图片" width="650" height="373" style="border:1px solid black;"></a></p> <p><strong>注意：id & class 选择器的样式优先级大于 元素名选择器</strong></p> <h3 id="43-组合选择器">4.3 组合选择器</h3> <p>为了测试效果，先准备好3层div</p> <pre><code class="language-html"><div id="layer1"> <p>第1层</p> <div id="layer2"> <p>layer 2</p> <h2>layer 2 h2</h2> <div id="layer3"> <p>第3层</p> <h3>layer 3 h3</h3> </div> </div> </div> <p>我不在任何的div里</p> </code></pre> <p>设置好样式</p> <pre><code class="language-html"><head> <style type="text/css"> #layer1 { height: 500px; padding: 30px; border: 1px dashed blue; } #layer2 { height: 400px; padding: 30px; border: 1px dashed red; } #layer3 { height: 300px; padding: 30px; border: 1px dashed black; } </style> </head> </code></pre> <p>效果</p> <p><a href="http://img.e-com-net.com/image/info8/0e1bf5d3132742cc883c322fb3057c83.jpg" target="_blank"><img src="http://img.e-com-net.com/image/info8/0e1bf5d3132742cc883c322fb3057c83.jpg" alt="Web开发初探（系统理解Web知识点）_第20张图片" width="650" height="532" style="border:1px solid black;"></a></p> <h4 id="431-后代选择器">4.3.1 后代选择器</h4> <p>给指定元素的所有指定后代，设置样式</p> <p>比如 ，我给上图第一层div下面所有的</p> <p>标签设置颜色</p> <pre><code class="language-html">#layer1 p { color: red; background: yellow; } </code></pre> <p>效果</p> <p><a href="http://img.e-com-net.com/image/info8/17dc252ea29044afa9ce0fbb2f0f5717.jpg" target="_blank"><img src="http://img.e-com-net.com/image/info8/17dc252ea29044afa9ce0fbb2f0f5717.jpg" alt="Web开发初探（系统理解Web知识点）_第21张图片" width="650" height="489" style="border:1px solid black;"></a></p> <h4 id="432-子元素选择器">4.3.2 子元素选择器</h4> <p>又可称为儿子选择器，是指可给指定元素的下一层儿子元素设置格式 ，注意，只是儿子，孙子不管</p> <p>给<code>layer1</code>的div的儿子设置样式</p> <pre><code class="language-html">#layer1 > p { color: red; background: yellow; } </code></pre> <p><a href="http://img.e-com-net.com/image/info8/ec69b1fcf3d944c8af95d545f106b8c8.jpg" target="_blank"><img src="http://img.e-com-net.com/image/info8/ec69b1fcf3d944c8af95d545f106b8c8.jpg" alt="Web开发初探（系统理解Web知识点）_第22张图片" width="650" height="334" style="border:1px solid black;"></a></p> <h4 id="433-相邻兄弟选择器">4.3.3 相邻兄弟选择器</h4> <p>可选择紧接在另一元素后的元素，且二者有相同父元素。</p> <pre><code class="language-html">#layer2 > p+h2 { color: red; background: yellow; } </code></pre> <p>效果</p> <p><a href="http://img.e-com-net.com/image/info8/980f04ab273c4f7fb2dc5d3c01cbebc8.jpg" target="_blank"><img src="http://img.e-com-net.com/image/info8/980f04ab273c4f7fb2dc5d3c01cbebc8.jpg" alt="Web开发初探（系统理解Web知识点）_第23张图片" width="650" height="430" style="border:1px solid black;"></a></p> <h4 id="434-多个元素组合">4.3.4 多个元素组合</h4> <p>可同时给不相干的多个元素设置同一个样式</p> <p>比如 把整 个页面所有的</p> <p> 和</p> <h3>标签同时设置样式<p></p> <pre><code class="language-html">p,h3 { color: red; background: yellow; } </code></pre> <p>效果</p> <a href="http://img.e-com-net.com/image/info8/8d1e00e7dcf642b9a00551faae3c1bcd.jpg" target="_blank"><img src="http://img.e-com-net.com/image/info8/8d1e00e7dcf642b9a00551faae3c1bcd.jpg" alt="Web开发初探（系统理解Web知识点）_第24张图片" width="650" height="472" style="border:1px solid black;"></a> </h3> <h3 id="44-盒子模型">4.4 盒子模型</h3> <p>所有HTML元素可以看作盒子，在CSS中，"box model"这一术语是用来设计和布局时使用。</p> <p>CSS盒模型本质上是一个盒子，封装周围的HTML元素，它包括：边距，边框，填充，和实际内容。</p> <p>盒模型允许我们在其它元素和周围元素边框之间的空间放置元素。</p> <p>下面的图片说明了盒子模型(Box Model)：</p> <p><a href="http://img.e-com-net.com/image/info8/5a0d0c6fa1634701a103ca2f869495aa.gif" target="_blank"><img src="http://img.e-com-net.com/image/info8/5a0d0c6fa1634701a103ca2f869495aa.gif" alt="Web开发初探（系统理解Web知识点）_第25张图片" width="536" height="289" style="border:1px solid black;"></a></p> <p>不同部分的说明：</p> <ul> <li><strong>Margin(外边距)</strong> - 清除边框外的区域，外边距是透明的。</li> <li><strong>Border(边框)</strong> - 围绕在内边距和内容外的边框。</li> <li><strong>Padding(内边距)</strong> - 清除内容周围的区域，内边距是透明的。</li> <li><strong>Content(内容)</strong> - 盒子的内容，显示文本和图像。</li> </ul> <p>为了正确设置元素在所有浏览器中的宽度和高度，你需要知道的盒模型是如何工作的。</p> <h4 id="元素的宽度和高度">元素的宽度和高度</h4> <p><img src="http://img.e-com-net.com/image/info8/9590305a2bf44a22869bcc55ab18997a.gif" alt="" width="15" height="15"><strong>重要:</strong> 当指定一个 CSS 元素的宽度和高度属性时，你只是设置<strong>内容区域的宽度和高度</strong>。要知道，完整大小的元素，你还必须添加内边距，边框和边距。</p> <p>下面的例子中的元素的总宽度为300px：</p> <pre><code class="language-html">div { width: 300px; border: 25px dashed yellow; padding: 25px; margin: 25px; } </code></pre> <pre><code class="language-html"><body> <h2>盒子模型演示</h2> <p>CSS盒模型本质上是一个盒子，封装周围的HTML元素，它包括：边距，边框，填充，和实际内容。</p> <div>这里是盒子内的实际内容。有 25px 内间距，25px 外间距、5px 黄色边框。</div> </body> </code></pre> <p>效果</p> <a href="http://img.e-com-net.com/image/info8/85b291a169e14ed68a091889d1bbcfc8.jpg" target="_blank"><img src="http://img.e-com-net.com/image/info8/85b291a169e14ed68a091889d1bbcfc8.jpg" alt="Web开发初探（系统理解Web知识点）_第26张图片" width="650" height="366" style="border:1px solid black;"></a> <h3 id="45-常用css属性">4.5 常用CSS属性</h3> <p>css有很多属性，我们先只讲几个基本的</p> <p>更多的看这里：https://www.runoob.com/cssref/css-reference.html#box</p> <h4 id="451-background背景属性">4.5.1 background背景属性</h4> <table> <thead> <tr> <th style="text-align:left">属性</th> <th style="text-align:left">描述</th> <th style="text-align:left">CSS</th> </tr> </thead> <tbody> <tr> <td style="text-align:left">background</td> <td style="text-align:left">复合属性。设置对象的背景特性。</td> <td style="text-align:left">1</td> </tr> <tr> <td style="text-align:left">background-attachment</td> <td style="text-align:left">设置或检索背景图像是随对象内容滚动还是固定的。必须先指定background-image属性。</td> <td style="text-align:left">1</td> </tr> <tr> <td style="text-align:left">background-color</td> <td style="text-align:left">设置或检索对象的背景颜色。</td> <td style="text-align:left">1</td> </tr> <tr> <td style="text-align:left">background-image</td> <td style="text-align:left">设置或检索对象的背景图像。</td> <td style="text-align:left">1</td> </tr> <tr> <td style="text-align:left">background-position</td> <td style="text-align:left">设置或检索对象的背景图像位置。必须先指定background-image属性。</td> <td style="text-align:left">1</td> </tr> <tr> <td style="text-align:left">background-repeat</td> <td style="text-align:left">设置或检索对象的背景图像如何铺排填充。必须先指定background-image属性。</td> <td style="text-align:left">1</td> </tr> <tr> <td style="text-align:left">background-clip</td> <td style="text-align:left">指定对象的背景图像向外裁剪的区域。</td> <td style="text-align:left">3</td> </tr> <tr> <td style="text-align:left">background-origin</td> <td style="text-align:left">S设置或检索对象的背景图像计算background-position时的参考原点(位置)。</td> <td style="text-align:left">3</td> </tr> <tr> <td style="text-align:left">background-size</td> <td style="text-align:left">检索或设置对象的背景图像的尺寸大小。</td> <td style="text-align:left">3</td> </tr> </tbody> </table> <h4 id="452-边框border-和轮廓outline属性">4.5.2 边框Border 和轮廓Outline属性</h4> <table> <thead> <tr> <th style="text-align:left">属性</th> <th style="text-align:left">描述</th> <th style="text-align:left">CSS</th> </tr> </thead> <tbody> <tr> <td style="text-align:left">border</td> <td style="text-align:left">复合属性。设置对象边框的特性。</td> <td style="text-align:left">1</td> </tr> <tr> <td style="text-align:left">border-bottom</td> <td style="text-align:left">复合属性。设置对象底部边框的特性。</td> <td style="text-align:left">1</td> </tr> <tr> <td style="text-align:left">border-bottom-color</td> <td style="text-align:left">设置或检索对象的底部边框颜色。</td> <td style="text-align:left">1</td> </tr> <tr> <td style="text-align:left">border-bottom-style</td> <td style="text-align:left">设置或检索对象的底部边框样式。</td> <td style="text-align:left">1</td> </tr> <tr> <td style="text-align:left">border-bottom-width</td> <td style="text-align:left">设置或检索对象的底部边框宽度。</td> <td style="text-align:left">1</td> </tr> <tr> <td style="text-align:left">border-color</td> <td style="text-align:left">置或检索对象的边框颜色。</td> <td style="text-align:left">1</td> </tr> <tr> <td style="text-align:left">border-left</td> <td style="text-align:left">复合属性。设置对象左边边框的特性。</td> <td style="text-align:left">1</td> </tr> <tr> <td style="text-align:left">border-left-color</td> <td style="text-align:left">设置或检索对象的左边边框颜色。</td> <td style="text-align:left">1</td> </tr> <tr> <td style="text-align:left">border-left-style</td> <td style="text-align:left">设置或检索对象的左边边框样式。</td> <td style="text-align:left">1</td> </tr> <tr> <td style="text-align:left">border-left-width</td> <td style="text-align:left">设置或检索对象的左边边框宽度。</td> <td style="text-align:left">1</td> </tr> <tr> <td style="text-align:left">border-right</td> <td style="text-align:left">复合属性。设置对象右边边框的特性。</td> <td style="text-align:left">1</td> </tr> <tr> <td style="text-align:left">border-right-color</td> <td style="text-align:left">设置或检索对象的右边边框颜色。</td> <td style="text-align:left">1</td> </tr> <tr> <td style="text-align:left">border-right-style</td> <td style="text-align:left">设置或检索对象的右边边框样式。</td> <td style="text-align:left">1</td> </tr> <tr> <td style="text-align:left">border-right-width</td> <td style="text-align:left">设置或检索对象的右边边框宽度。</td> <td style="text-align:left">1</td> </tr> <tr> <td style="text-align:left">border-style</td> <td style="text-align:left">设置或检索对象的边框样式。</td> <td style="text-align:left">1</td> </tr> <tr> <td style="text-align:left">border-top</td> <td style="text-align:left">复合属性。设置对象顶部边框的特性。</td> <td style="text-align:left">1</td> </tr> <tr> <td style="text-align:left">border-top-color</td> <td style="text-align:left">设置或检索对象的顶部边框颜色</td> <td style="text-align:left">1</td> </tr> <tr> <td style="text-align:left">border-top-style</td> <td style="text-align:left">设置或检索对象的顶部边框样式。</td> <td style="text-align:left">1</td> </tr> <tr> <td style="text-align:left">border-top-width</td> <td style="text-align:left">设置或检索对象的顶部边框宽度。</td> <td style="text-align:left">1</td> </tr> <tr> <td style="text-align:left">border-width</td> <td style="text-align:left">设置或检索对象的边框宽度。</td> <td style="text-align:left">1</td> </tr> <tr> <td style="text-align:left">outline</td> <td style="text-align:left">复合属性。设置或检索对象外的线条轮廓。</td> <td style="text-align:left">2</td> </tr> <tr> <td style="text-align:left">outline-color</td> <td style="text-align:left">设置或检索对象外的线条轮廓的颜色。</td> <td style="text-align:left">2</td> </tr> <tr> <td style="text-align:left">outline-style</td> <td style="text-align:left">设置或检索对象外的线条轮廓的样式。</td> <td style="text-align:left">2</td> </tr> <tr> <td style="text-align:left">outline-width</td> <td style="text-align:left">设置或检索对象外的线条轮廓的宽度。</td> <td style="text-align:left">2</td> </tr> <tr> <td style="text-align:left">border-bottom-left-radius</td> <td style="text-align:left">设置或检索对象的左下角圆角边框。</td> <td style="text-align:left">3</td> </tr> <tr> <td style="text-align:left">border-bottom-right-radius</td> <td style="text-align:left">设置或检索对象的右下角圆角边框。</td> <td style="text-align:left">3</td> </tr> <tr> <td style="text-align:left">border-image</td> <td style="text-align:left">设置或检索对象的边框样式使用图像来填充。</td> <td style="text-align:left">3</td> </tr> <tr> <td style="text-align:left">border-image-outset</td> <td style="text-align:left">规定边框图像超过边框的量。</td> <td style="text-align:left">3</td> </tr> <tr> <td style="text-align:left">border-image-repeat</td> <td style="text-align:left">规定图像边框是否应该被重复（repeated）、拉伸（stretched）</td> <td style="text-align:left">3</td> </tr> <tr> <td style="text-align:left">border-image-slice</td> <td style="text-align:left">规定图像边框的向内偏移。</td> <td style="text-align:left">3</td> </tr> <tr> <td style="text-align:left">border-image-source</td> <td style="text-align:left">规定要使用的图像，代替 border-style 属性中设置的边框样式。</td> <td style="text-align:left">3</td> </tr> <tr> <td style="text-align:left">border-image-width</td> <td style="text-align:left">规定图像边框的宽度。</td> <td style="text-align:left">3</td> </tr> <tr> <td style="text-align:left">border-radius</td> <td style="text-align:left">设置或检索对象使用圆角边框。</td> <td style="text-align:left">3</td> </tr> <tr> <td style="text-align:left">border-top-left-radius</td> <td style="text-align:left">定义左上角边框的形状。</td> <td style="text-align:left">3</td> </tr> <tr> <td style="text-align:left">border-top-right-radius</td> <td style="text-align:left">定义右上角边框的形状。</td> <td style="text-align:left">3</td> </tr> <tr> <td style="text-align:left">box-decoration-break</td> <td style="text-align:left">规定行内元素被折行</td> <td style="text-align:left">3</td> </tr> <tr> <td style="text-align:left">box-shadow</td> <td style="text-align:left">向方框添加一个或多个阴影。</td> <td style="text-align:left">3</td> </tr> </tbody> </table> <h4 id="453-内边距padding属性">4.5.3 内边距Padding属性</h4> <table> <thead> <tr> <th style="text-align:left">属性</th> <th style="text-align:left">说明</th> <th style="text-align:left">CSS</th> </tr> </thead> <tbody> <tr> <td style="text-align:left">padding</td> <td style="text-align:left">在一个声明中设置所有填充属性</td> <td style="text-align:left">1</td> </tr> <tr> <td style="text-align:left">padding-bottom</td> <td style="text-align:left">设置元素的底填充</td> <td style="text-align:left">1</td> </tr> <tr> <td style="text-align:left">padding-left</td> <td style="text-align:left">设置元素的左填充</td> <td style="text-align:left">1</td> </tr> <tr> <td style="text-align:left">padding-right</td> <td style="text-align:left">设置元素的右填充</td> <td style="text-align:left">1</td> </tr> <tr> <td style="text-align:left">padding-top</td> <td style="text-align:left">设置元素的顶部填充</td> <td style="text-align:left">1</td> </tr> </tbody> </table> <h4 id="454-外边距margin-属性">4.5.4 外边距(Margin) 属性</h4> <table> <thead> <tr> <th style="text-align:left">属性</th> <th style="text-align:left">说明</th> <th style="text-align:left">CSS</th> </tr> </thead> <tbody> <tr> <td style="text-align:left">margin</td> <td style="text-align:left">在一个声明中设置所有外边距属性</td> <td style="text-align:left">1</td> </tr> <tr> <td style="text-align:left">margin-bottom</td> <td style="text-align:left">设置元素的下外边距</td> <td style="text-align:left">1</td> </tr> <tr> <td style="text-align:left">margin-left</td> <td style="text-align:left">设置元素的左外边距</td> <td style="text-align:left">1</td> </tr> <tr> <td style="text-align:left">margin-right</td> <td style="text-align:left">设置元素的右外边距</td> <td style="text-align:left">1</td> </tr> <tr> <td style="text-align:left">margin-top</td> <td style="text-align:left">设置元素的上外边距</td> <td style="text-align:left">1</td> </tr> </tbody> </table> <h4 id="455-position-定位属性">4.5.5 position 定位属性</h4> <p><a href="http://img.e-com-net.com/image/info8/d6506f7552c149fe97b87f995a9dbcf3.jpg" target="_blank"><img src="http://img.e-com-net.com/image/info8/d6506f7552c149fe97b87f995a9dbcf3.jpg" alt="Web开发初探（系统理解Web知识点）_第27张图片" width="650" height="264" style="border:1px solid black;"></a></p> <p>属性值</p> <table> <thead> <tr> <th style="text-align:left">值</th> <th style="text-align:left">描述</th> </tr> </thead> <tbody> <tr> <td style="text-align:left">absolute</td> <td style="text-align:left">生成绝对定位的元素，相对于 static 定位以外的第一个父元素进行定位。元素的位置通过 "left", "top", "right" 以及 "bottom" 属性进行规定。</td> </tr> <tr> <td style="text-align:left">fixed</td> <td style="text-align:left">生成固定定位的元素，相对于浏览器窗口进行定位。元素的位置通过 "left", "top", "right" 以及 "bottom" 属性进行规定。</td> </tr> <tr> <td style="text-align:left">relative</td> <td style="text-align:left">生成相对定位的元素，相对于其正常位置进行定位。因此，"left:20" 会向元素的 LEFT 位置添加 20 像素。</td> </tr> <tr> <td style="text-align:left">static</td> <td style="text-align:left">默认值。没有定位，元素出现在正常的流中（忽略 top, bottom, left, right 或者 z-index 声明）。</td> </tr> <tr> <td style="text-align:left">sticky</td> <td style="text-align:left">粘性定位，该定位基于用户滚动的位置。它的行为就像 position:relative; 而当页面滚动超出目标区域时，它的表现就像 position:fixed;，它会固定在目标位置。<strong>注意:</strong> Internet Explorer, Edge 15 及更早 IE 版本不支持 sticky 定位。 Safari 需要使用 -webkit- prefix (查看以下实例)。</td> </tr> <tr> <td style="text-align:left">inherit</td> <td style="text-align:left">规定应该从父元素继承 position 属性的值。</td> </tr> <tr> <td style="text-align:left"></td> <td style="text-align:left"></td> </tr> </tbody> </table> <h4 id="456-字体（font）-属性">4.5.6 字体（Font） 属性</h4> <table> <thead> <tr> <th style="text-align:left">属性</th> <th style="text-align:left">说明</th> <th style="text-align:left">CSS</th> </tr> </thead> <tbody> <tr> <td style="text-align:left">font</td> <td style="text-align:left">在一个声明中设置所有字体属性</td> <td style="text-align:left">1</td> </tr> <tr> <td style="text-align:left">font-family</td> <td style="text-align:left">规定文本的字体系列</td> <td style="text-align:left">1</td> </tr> <tr> <td style="text-align:left">font-size</td> <td style="text-align:left">规定文本的字体尺寸</td> <td style="text-align:left">1</td> </tr> <tr> <td style="text-align:left">font-style</td> <td style="text-align:left">规定文本的字体样式</td> <td style="text-align:left">1</td> </tr> <tr> <td style="text-align:left">font-variant</td> <td style="text-align:left">规定文本的字体样式</td> <td style="text-align:left">1</td> </tr> <tr> <td style="text-align:left">font-weight</td> <td style="text-align:left">规定字体的粗细</td> <td style="text-align:left">1</td> </tr> <tr> <td style="text-align:left">@font-face</td> <td style="text-align:left">一个规则，允许网站下载并使用其他超过"Web- safe"字体的字体</td> <td style="text-align:left">3</td> </tr> <tr> <td style="text-align:left">font-size-adjust</td> <td style="text-align:left">为元素规定 aspect 值</td> <td style="text-align:left">3</td> </tr> <tr> <td style="text-align:left">font-stretch</td> <td style="text-align:left">收缩或拉伸当前的字体系列</td> <td style="text-align:left">3</td> </tr> </tbody> </table> <h4 id="457-文本（text）-属性">4.5.7 文本（Text） 属性</h4> <table> <thead> <tr> <th style="text-align:left">属性</th> <th style="text-align:left">说明</th> <th style="text-align:left">CSS</th> </tr> </thead> <tbody> <tr> <td style="text-align:left">color</td> <td style="text-align:left">设置文本的颜色</td> <td style="text-align:left">1</td> </tr> <tr> <td style="text-align:left">direction</td> <td style="text-align:left">规定文本的方向 / 书写方向</td> <td style="text-align:left">2</td> </tr> <tr> <td style="text-align:left">letter-spacing</td> <td style="text-align:left">设置字符间距</td> <td style="text-align:left">1</td> </tr> <tr> <td style="text-align:left">line-height</td> <td style="text-align:left">设置行高</td> <td style="text-align:left">1</td> </tr> <tr> <td style="text-align:left">text-align</td> <td style="text-align:left">规定文本的水平对齐方式</td> <td style="text-align:left">1</td> </tr> <tr> <td style="text-align:left">text-decoration</td> <td style="text-align:left">规定添加到文本的装饰效果</td> <td style="text-align:left">1</td> </tr> <tr> <td style="text-align:left">text-indent</td> <td style="text-align:left">规定文本块首行的缩进</td> <td style="text-align:left">1</td> </tr> <tr> <td style="text-align:left">text-transform</td> <td style="text-align:left">控制文本的大小写</td> <td style="text-align:left">1</td> </tr> <tr> <td style="text-align:left">vertical-align</td> <td style="text-align:left">设置元素的垂直对齐方式</td> <td style="text-align:left">1</td> </tr> <tr> <td style="text-align:left">white-space</td> <td style="text-align:left">设置怎样给一元素控件留白</td> <td style="text-align:left">1</td> </tr> <tr> <td style="text-align:left">word-spacing</td> <td style="text-align:left">设置单词间距</td> <td style="text-align:left">1</td> </tr> <tr> <td style="text-align:left">text-emphasis</td> <td style="text-align:left">向元素的文本应用重点标记以及重点标记的前景色。</td> <td style="text-align:left">1</td> </tr> <tr> <td style="text-align:left">hanging-punctuation</td> <td style="text-align:left">指定一个标点符号是否可能超出行框</td> <td style="text-align:left">3</td> </tr> <tr> <td style="text-align:left">punctuation-trim</td> <td style="text-align:left">指定一个标点符号是否要去掉</td> <td style="text-align:left">3</td> </tr> <tr> <td style="text-align:left">text-align-last</td> <td style="text-align:left">当 text-align 设置为 justify 时，最后一行的对齐方式。</td> <td style="text-align:left">3</td> </tr> <tr> <td style="text-align:left">text-justify</td> <td style="text-align:left">当 text-align 设置为 justify 时指定分散对齐的方式。</td> <td style="text-align:left">3</td> </tr> <tr> <td style="text-align:left">text-outline</td> <td style="text-align:left">设置文字的轮廓。</td> <td style="text-align:left">3</td> </tr> <tr> <td style="text-align:left">text-overflow</td> <td style="text-align:left">指定当文本溢出包含的元素，应该发生什么</td> <td style="text-align:left">3</td> </tr> <tr> <td style="text-align:left">text-shadow</td> <td style="text-align:left">为文本添加阴影</td> <td style="text-align:left">3</td> </tr> <tr> <td style="text-align:left">text-wrap</td> <td style="text-align:left">指定文本换行规则</td> <td style="text-align:left">3</td> </tr> <tr> <td style="text-align:left">word-break</td> <td style="text-align:left">指定非CJK文字的断行规则</td> <td style="text-align:left">3</td> </tr> <tr> <td style="text-align:left">word-wrap</td> <td style="text-align:left">设置浏览器是否对过长的单词进行换行。</td> <td style="text-align:left">3</td> </tr> </tbody> </table> <h2 id="五、练习题">五、练习题</h2> <h3 id="51-开发登录注册页面">5.1 开发登录注册页面</h3> <p>请参考下面的注册页面，模仿开发一个一样的注册页面， 只写好静态页面样式就行，不需要能真的获取验证码等。</p> <p><a href="http://img.e-com-net.com/image/info8/28c720f36af945ad8f1b96f9a44ccaef.jpg" target="_blank"><img src="http://img.e-com-net.com/image/info8/28c720f36af945ad8f1b96f9a44ccaef.jpg" alt="Web开发初探（系统理解Web知识点）_第28张图片" width="650" height="502" style="border:1px solid black;"></a></p> <blockquote> <p>Ps：部分内容来自博主线上课程的教程的文件内容</p> </blockquote> </div> </div> </div> </div> <!--PC和WAP自适应版--> <div id="SOHUCS" sid="1305471151434141696"></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">你可能感兴趣的:(Web开发初探（系统理解Web知识点）)</h4> <div id="paradigm-article-related"> <div class="recommend-post mb30"> <ul class="widget-links"> <li><a href="/article/1896135591796469760.htm" title="浅谈冷水机组集群控制系统方案" target="_blank">浅谈冷水机组集群控制系统方案</a> <span class="text-muted">gd_wei</span> <a class="tag" taget="_blank" href="/search/%E9%AB%98%E6%95%88%E6%9C%BA%E6%88%BF%E6%96%B9%E6%A1%88/1.htm">高效机房方案</a><a class="tag" taget="_blank" href="/search/%E8%83%BD%E6%BA%90/1.htm">能源</a><a class="tag" taget="_blank" href="/search/%E8%87%AA%E5%8A%A8%E5%8C%96/1.htm">自动化</a><a class="tag" taget="_blank" href="/search/%E7%A8%8B%E5%BA%8F%E4%BA%BA%E7%94%9F/1.htm">程序人生</a> <div>冷水机组集群控制系统方案日期：2023.09.25一、项目信息：本项目为光伏产业园标准化厂房及配套设施建设项目高效冷热源站集群控制系统，项目内容包括低温冷水机组、中温冷水机组、热回收机组的高效冷热源集群控制系统。二、冷水机组设备概况高压离心单冷机组（变频），制冷量6329KW，共2台；高压离心单冷机组（定频），制冷量6153KW，共1台；高压离心单冷机组（定频），制冷量10548KW，共2台；全热</div> </li> <li><a href="/article/1896135465354981376.htm" title="自动驾驶的“大脑”：决策规划篇" target="_blank">自动驾驶的“大脑”：决策规划篇</a> <span class="text-muted">Yellow ?</span> <div>文章目录一、决策规划技术概述二、决策规划技术结构体系1.分层递阶式体系结构2.反应式体系结构3.混合式体系结构三、决策规划系统的关键环节1.传感信息融合2.任务决策3.轨迹规划4.异常处理四、决策规划技术方法1.全局规划(1)基于状态空间的最优控制轨迹规划方法(2)基于参数化曲线的轨迹规划方法(3)基于基于系统特征的轨迹规划方法2.局部规划方法(1)基于滚动时域优化的轨迹规划方法(2)基于轨迹片段</div> </li> <li><a href="/article/1896135365056589824.htm" title="Ubuntu系统下交叉编译nasm" target="_blank">Ubuntu系统下交叉编译nasm</a> <span class="text-muted"></span> <a class="tag" taget="_blank" href="/search/linux%E8%BF%90%E7%BB%B4%E4%BA%A4%E5%8F%89%E7%BC%96%E8%AF%91/1.htm">linux运维交叉编译</a> <div>一、交叉编译nasm1.下载源码下载nasm：https://www.nasm.us/pub/nasm/releasebuilds/下载并解压源码。wgethttps://www.nasm.us/pub/nasm/releasebuilds/2.16.03/nasm-2.16.03.tar.gztar-xvzfnasm-2.16.03.tar.gzcdnasm-2.16.03mkdirnasmbu</div> </li> <li><a href="/article/1896135235305795584.htm" title="HarmonyNext应用开发实战：ArkTS实现高性能动画引擎" target="_blank">HarmonyNext应用开发实战：ArkTS实现高性能动画引擎</a> <span class="text-muted"></span> <a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a> <div>本文面向具备HarmonyOS基础知识的开发者，通过实现一个复杂动画引擎案例，深入解析HarmonyNext中ArkTS的高级特性与性能优化策略。第一章：案例背景与核心技术解析本案例将构建一个可交互的粒子动画系统，包含以下技术栈：ArkUI声明式语法：通过组合式组件构建界面动画引擎架构：基于Canvas的底层渲染控制性能优化：Worker线程与渲染主线程协同数学计算：向量运算与三角函数应用技术选型</div> </li> <li><a href="/article/1896135106880401408.htm" title="2025年，微服务架构和大模型能“玩出”什么新花样？" target="_blank">2025年，微服务架构和大模型能“玩出”什么新花样？</a> <span class="text-muted"></span> <div>2025年开年，DeepSeek开源模型以“低成本、高性能”成功掀起AI平价化浪潮，并以惊人的速度渗透至各个领域。在AI平价化浪潮的推动下，微服务架构正迎来前所未有的变革机遇。微服务架构通过将系统拆解为多个小型、独立的服务，每个服务运行在自己的进程中，负责特定的业务功能。与单体架构相比，微服务架构实现了更高的灵活性、可扩展性和可维护性，这些特性使其成为现代软件开发的首选。然而，随着企业应用规模和复</div> </li> <li><a href="/article/1896135108126109696.htm" title="2025年，微服务架构和大模型能“玩出”什么新花样？" target="_blank">2025年，微服务架构和大模型能“玩出”什么新花样？</a> <span class="text-muted"></span> <div>2025年开年，DeepSeek开源模型以“低成本、高性能”成功掀起AI平价化浪潮，并以惊人的速度渗透至各个领域。在AI平价化浪潮的推动下，微服务架构正迎来前所未有的变革机遇。微服务架构通过将系统拆解为多个小型、独立的服务，每个服务运行在自己的进程中，负责特定的业务功能。与单体架构相比，微服务架构实现了更高的灵活性、可扩展性和可维护性，这些特性使其成为现代软件开发的首选。然而，随着企业应用规模和复</div> </li> <li><a href="/article/1896132058967764992.htm" title="cve-2025-25064漏洞分析" target="_blank">cve-2025-25064漏洞分析</a> <span class="text-muted">Werqy3</span> <a class="tag" taget="_blank" href="/search/%E7%BD%91%E7%BB%9C%E5%AE%89%E5%85%A8/1.htm">网络安全</a> <div>前言Zimbra提供一套开源协同办公套件包括WebMail，日历，通信录，Web文档管理和创作。漏洞描述漏洞原因漏洞的根本原因在于CancelPendingAccountOnlyRemoteWipe处理器中对用户输入（即设备ID）的处理方式不当漏洞代码//lib/ext/zimbrasync/zm-sync-store/com/zimbra/zimbrasync/service/CancelPen</div> </li> <li><a href="/article/1896131177610276864.htm" title="Express + MongoDB 实现 VOD 视频点播" target="_blank">Express + MongoDB 实现 VOD 视频点播</a> <span class="text-muted">yqcoder</span> <a class="tag" taget="_blank" href="/search/express/1.htm">express</a><a class="tag" taget="_blank" href="/search/mongodb/1.htm">mongodb</a><a class="tag" taget="_blank" href="/search/%E6%95%B0%E6%8D%AE%E5%BA%93/1.htm">数据库</a> <div>一、安装依赖npminstallexpressmongoosemulterffmpeg-staticfluent-ffmpegexpress：用于构建Web服务器。mongoose：用于与MongoDB进行交互。multer：用于处理文件上传。ffmpeg-static：提供FFmpeg的静态二进制文件。fluent-ffmpeg：用于视频处理。二、数据库连接与模型定义创建models目录并在其中</div> </li> <li><a href="/article/1896129812171386880.htm" title="通俗理解-L、-rpath和-rpath-link编译链接动态库" target="_blank">通俗理解-L、-rpath和-rpath-link编译链接动态库</a> <span class="text-muted"></span> <a class="tag" taget="_blank" href="/search/linux%E8%BF%90%E7%BB%B4/1.htm">linux运维</a> <div>一、参考资料链接选项rpath的应用和原理|BewareMyPower的博客使用rpath和rpath-link确保samba-util库正确链接-CSDN博客编译参数-Wl和rpath的理解_-wl,-rpath-CSDN博客UsingLD,theGNUlinker-OptionsDirectoryOptions(UsingtheGNUCompilerCollection(GCC))交叉编译时-</div> </li> <li><a href="/article/1896127901154209792.htm" title="ROM和RAM的区别" target="_blank">ROM和RAM的区别</a> <span class="text-muted">羊羊一洋</span> <a class="tag" taget="_blank" href="/search/%E6%99%BA%E8%83%BD%E8%B7%AF%E7%94%B1%E5%99%A8/1.htm">智能路由器</a> <div>ROM（Read-OnlyMemory，只读存储器）和RAM（RandomAccessMemory，随机存取存储器）是计算机系统中两种不同类型的存储技术，它们在功能、用途和特性上有显著的区别：1.存储数据的持久性：-ROM：通常用于存储固件或系统软件，这些数据在断电后依然可以保留。ROM中的数据是预先写入的，用户通常无法修改或只能在特定条件下修改（如固件升级）。-RAM：用于存储计算机运行时的数据</div> </li> <li><a href="/article/1896126387798994944.htm" title="嵌入式系统之GPIO" target="_blank">嵌入式系统之GPIO</a> <span class="text-muted">小陈头不秃</span> <a class="tag" taget="_blank" href="/search/%E5%B5%8C%E5%85%A5%E5%BC%8F%E7%B3%BB%E7%BB%9F/1.htm">嵌入式系统</a><a class="tag" taget="_blank" href="/search/%E6%95%B0%E5%AD%97%E4%BF%A1%E5%8F%B7%E5%A4%84%E7%90%86/1.htm">数字信号处理</a><a class="tag" taget="_blank" href="/search/%E6%9C%80%E5%B0%8F%E4%BA%8C%E4%B9%98%E6%B3%95/1.htm">最小二乘法</a><a class="tag" taget="_blank" href="/search/%E7%AE%97%E6%B3%95/1.htm">算法</a> <div>一、IO口基本结构和8种模式STM32F103ZET6一共有7组IO口（GPIOA--GPIOG），每组IO口有16个IO，一共有112个IO4种输入模式：(1)输入浮空(GPIO_Mode_IN_FLOATING):浮空输入，可以做Key识别，RX1(2)输入上拉(GPIO_Mode_IPU)：IO内部上拉电阻输入(3)输入下拉(GPIO_Mode_IPD)：IO内部下拉电阻输入(4)模拟输入(</div> </li> <li><a href="/article/1896125501399953408.htm" title="前端项目中脚本文件打包，vscode中如何正确使用gtar命令" target="_blank">前端项目中脚本文件打包，vscode中如何正确使用gtar命令</a> <span class="text-muted">今天吃了嘛o</span> <a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/vscode/1.htm">vscode</a><a class="tag" taget="_blank" href="/search/ide/1.htm">ide</a> <div>1、下载gtarhttps://gnuwin32.sourceforge.net/packages/libarchive.htm2、傻瓜式安装一路下一步即可。3、配置环境变量高级系统设置”在弹出的“系统属性”窗口中，点击“环境变量”。在“系统变量”列表中找到“Path”变量，点击“编辑”。点击“新建”，将gtar可执行文件所在的目录路径（例如C:\ProgramFiles(x86)\GnuWin3</div> </li> <li><a href="/article/1896125501865521152.htm" title="一篇文章搞懂C#中的泛型类/泛型方法/泛型接口" target="_blank">一篇文章搞懂C#中的泛型类/泛型方法/泛型接口</a> <span class="text-muted">方程式sunny</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> <div>一篇文章搞懂C#中的泛型类/泛型方法/泛型接口链接:源码提起泛型类，很多人就头疼，我也头疼。在C#中这个概念很重要，重要的向定义一个int数值类型一样，但是这个内容又不像if···else那样容易理解。我花费了两天的时间，把整个知识点梳理了一遍，希望讲清楚，也当给自己做个笔记。泛型类（GenericClasses）泛型类是一种可以处理多种数据类型的数据结构或算法模板。它允许在定义类时使用一个或多个</div> </li> <li><a href="/article/1896124997009731584.htm" title="【登月计划】DAY 4 中期 --《排产“阿尔法狗”大揭秘！美的如何用APS算法碾压对手》" target="_blank">【登月计划】DAY 4 中期 --《排产“阿尔法狗”大揭秘！美的如何用APS算法碾压对手》</a> <span class="text-muted">泛泛不谈</span> <a class="tag" taget="_blank" href="/search/0-2%E5%B2%81%E6%99%BA%E8%83%BD%E5%88%B6%E9%80%A0%E5%B7%A5%E7%A8%8B%E5%B8%88%E5%90%AF%E8%92%99/1.htm">0-2岁智能制造工程师启蒙</a><a class="tag" taget="_blank" href="/search/%E5%88%B6%E9%80%A0/1.htm">制造</a><a class="tag" taget="_blank" href="/search/%E7%BB%8F%E9%AA%8C%E5%88%86%E4%BA%AB/1.htm">经验分享</a><a class="tag" taget="_blank" href="/search/%E9%9C%80%E6%B1%82%E5%88%86%E6%9E%90/1.htm">需求分析</a> <div>目录四、乐高教学：APS系统核心模块与排产算法1.APS系统定位与价值2.APS核心模块拆解模块1：产能建模引擎（排产的“地基”）模块2：排产算法库（排产的“大脑”）模块3：动态响应模块（排产的“应急部队”）3.家电行业典型排产规则规则1：交货期优先（DueDateFirst）规则2：最小化换型时间（SMED优化）规则3：瓶颈资源最大化利用4.APS系统数据流（家电行业协同网络）5.APS实施避坑</div> </li> <li><a href="/article/1896124491579322368.htm" title="STM32堆和栈及变量的存储理解" target="_blank">STM32堆和栈及变量的存储理解</a> <span class="text-muted">༺༒至尊宝༒༻</span> <a class="tag" taget="_blank" href="/search/C%E8%AF%AD%E8%A8%80/1.htm">C语言</a><a class="tag" taget="_blank" href="/search/stm32/1.htm">stm32</a><a class="tag" taget="_blank" href="/search/STM32/1.htm">STM32</a><a class="tag" taget="_blank" href="/search/%E5%A0%86%E5%92%8C%E6%A0%88/1.htm">堆和栈</a> <div>STM32堆和栈及变量的存储理解转至：https://blog.csdn.net/shaynerain/article/details/71952754关于堆和栈已经是程序员的一个月经话题，大部分有是基于os层来聊的。那么，在赤裸裸的单片机下的堆和栈是什么样的分布呢？以下是网摘：刚接手STM32时，你只编写一个intmain(){while(1);}BUILD://ProgramSize:Code</div> </li> <li><a href="/article/1896123862257561600.htm" title="Android构建系统 - 03 编译执行流程" target="_blank">Android构建系统 - 03 编译执行流程</a> <span class="text-muted">Mr.pyZhang</span> <a class="tag" taget="_blank" href="/search/%E6%9E%84%E5%BB%BA%E7%B3%BB%E7%BB%9F/1.htm">构建系统</a><a class="tag" taget="_blank" href="/search/android/1.htm">android</a><a class="tag" taget="_blank" href="/search/linux/1.htm">linux</a> <div>文章目录执行编译Linux内核编译make编译系统选择编译命令makem..makemmmmma...其他命令代码搜索导航指令makeclean/update-apiMakefile分类解析过程树根节点droid`/Makefile``main.mk``droid`droidcore节点.imgfilesmodules_to_install`INSTALLED_ANDROID_INFO_TXT_T</div> </li> <li><a href="/article/1896122978760978432.htm" title="使用Semantic Kernel：对DeepSeek添加自定义插件" target="_blank">使用Semantic Kernel：对DeepSeek添加自定义插件</a> <span class="text-muted">归-途</span> <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/oneapi/1.htm">oneapi</a><a class="tag" taget="_blank" href="/search/%E6%9C%BA%E5%99%A8%E5%AD%A6%E4%B9%A0/1.htm">机器学习</a> <div>SemanticKernel介绍SemanticKernel是一个SDK，它将OpenAI、AzureOpenAI等大型语言模型与C#、Python和Java等传统编程语言集成在一起。SemanticKernel通过允许您定义插件来实现这一点。为什么需要添加插件？大语言模型虽然具有强大的自然语言理解和生成能力，但它们通常是基于预训练的模型，其功能受限于训练时所接触的数据和任务。为大语言模型添加插件</div> </li> <li><a href="/article/1896120205554282496.htm" title="【设计模式】（二）工厂方法模式详解" target="_blank">【设计模式】（二）工厂方法模式详解</a> <span class="text-muted">24K钛合金镭射眼</span> <a class="tag" taget="_blank" href="/search/%E8%AE%BE%E8%AE%A1%E6%A8%A1%E5%BC%8F/1.htm">设计模式</a><a class="tag" taget="_blank" href="/search/%E8%AE%BE%E8%AE%A1%E6%A8%A1%E5%BC%8F/1.htm">设计模式</a><a class="tag" taget="_blank" href="/search/%E5%B7%A5%E5%8E%82%E6%96%B9%E6%B3%95%E6%A8%A1%E5%BC%8F/1.htm">工厂方法模式</a><a class="tag" taget="_blank" href="/search/java/1.htm">java</a> <div>结合代码示例针对工厂方法模式进行详细讲解文章目录前言一、工厂方法模式的特点二、简单工厂模式2.1代码示例2.2优缺点分析三、工厂方法模式3.1代码示例3.2优缺点分析总结前言工厂方法模式是一种创建型设计模式，旨在提供一种统一的方式来创建对象，将对象的实例化过程封装在一个单独的类中。这种模式通过定义一个公共的接口来创建对象，但允许子类决定实例化哪个类，从而将调用者和实现类解耦，提高了系统的可扩展性和</div> </li> <li><a href="/article/1896120079142154240.htm" title="IT安全运维指南：手册、工具与资源速览" target="_blank">IT安全运维指南：手册、工具与资源速览</a> <span class="text-muted">兮动人</span> <a class="tag" taget="_blank" href="/search/%E7%BD%91%E7%BB%9C%E6%94%BB%E9%98%B2%E4%B8%8E%E8%BF%90%E7%BB%B4/1.htm">网络攻防与运维</a><a class="tag" taget="_blank" href="/search/%E5%AE%89%E5%85%A8/1.htm">安全</a><a class="tag" taget="_blank" href="/search/%E8%BF%90%E7%BB%B4/1.htm">运维</a> <div>1.IT安全运维手册飞塔防火墙手册：https://handbook.fortinet.com.cn/亿邮邮箱系统手册：https://mail.eyou.net/?q=help深信服上网行为管理手册：https://support.sangfor.com.cn/productDocument/read?product_id=22&version_id=943深信服VPN远程办公手册：https:</div> </li> <li><a href="/article/1896119196882890752.htm" title="Arduino雨水传感器接口教程：检测降雨并测量雨量强度" target="_blank">Arduino雨水传感器接口教程：检测降雨并测量雨量强度</a> <span class="text-muted">星际编程喵</span> <a class="tag" taget="_blank" href="/search/Python%E6%8E%A2%E7%B4%A2%E4%B9%8B%E6%97%85/1.htm">Python探索之旅</a><a class="tag" taget="_blank" href="/search/%E5%8D%95%E7%89%87%E6%9C%BA/1.htm">单片机</a><a class="tag" taget="_blank" href="/search/%E5%B5%8C%E5%85%A5%E5%BC%8F%E7%A1%AC%E4%BB%B6/1.htm">嵌入式硬件</a><a class="tag" taget="_blank" href="/search/python/1.htm">python</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/%E5%BC%80%E5%8F%91%E8%AF%AD%E8%A8%80/1.htm">开发语言</a><a class="tag" taget="_blank" href="/search/%E7%A1%AC%E4%BB%B6%E5%B7%A5%E7%A8%8B/1.htm">硬件工程</a> <div>前言你是否曾被突如其来的大雨困在门口，望着天上的乌云无奈叹气？或者在大雨滂沱时，想过“要是我能提前知道有雨该有多好”？又或者你想制作一个智能雨天报警系统，但又不知从何下手？别担心，Arduino雨水传感器来帮忙！本教程将带你轻松上手，从硬件接线到代码编写，实现降雨检测与雨量强度测量，让你的Arduino不仅能控制灯光和温度，还能“读懂”天气，成为你生活中的天气助手。在本文中，我们将详细介绍如何将雨</div> </li> <li><a href="/article/1896118944704557056.htm" title="深入解析SpringMVC中Http响应的实现机制" target="_blank">深入解析SpringMVC中Http响应的实现机制</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/%E7%BD%91%E7%BB%9C%E5%8D%8F%E8%AE%AE/1.htm">网络协议</a><a class="tag" taget="_blank" href="/search/%E7%BD%91%E7%BB%9C/1.htm">网络</a><a class="tag" taget="_blank" href="/search/java/1.htm">java</a> <div>在Web应用开发中，处理HTTP请求并返回相应的HTTP响应是核心任务之一。SpringMVC作为Java生态中广泛使用的Web框架，提供了灵活且强大的机制来处理HTTP请求和生成HTTP响应。本文将深入探讨SpringMVC中如何实现HTTP响应的返回，涵盖从控制器方法的返回值到最终生成HTTP响应的完整流程。1.SpringMVC处理HTTP请求的流程在SpringMVC中，HTTP请求的处理</div> </li> <li><a href="/article/1896118689166585856.htm" title="查询orace 表属性SQL" target="_blank">查询orace 表属性SQL</a> <span class="text-muted">元气满满的码农</span> <a class="tag" taget="_blank" href="/search/%E6%95%B0%E6%8D%AE%E5%BA%93/1.htm">数据库</a> <div>工作中要写系统文档，需要导出字段的说明，用这个sql导成excel很方便SELECTa.column_nameAS字段,a.data_typeAS数据类型,a.data_lengthAS长度,a.nullableAS是否为空,a.data_defaultAS默认值,b.commentsAS注释FROMuser_tab_columnsaLEFTJOINuser_col_commentsbONb.co</div> </li> <li><a href="/article/1896117554569605120.htm" title="第二九课：HarmonyOS Next设备特性访问与权限管理实践" target="_blank">第二九课：HarmonyOS Next设备特性访问与权限管理实践</a> <span class="text-muted">小_铁</span> <a class="tag" taget="_blank" href="/search/Harmony/1.htm">Harmony</a><a class="tag" taget="_blank" href="/search/OS/1.htm">OS</a><a class="tag" taget="_blank" href="/search/Next/1.htm">Next</a><a class="tag" taget="_blank" href="/search/harmonyos/1.htm">harmonyos</a><a class="tag" taget="_blank" href="/search/%E5%8D%8E%E4%B8%BA/1.htm">华为</a> <div>一、设备特性访问的技术实现HarmonyOSNext通过系统级能力重构设备访问模式，为开发者提供了安全高效的设备交互方案：‌统一设备接口调用‌基于ArkTS语言的@ohos.multimedia.camera等API模块，实现摄像头、麦克风等设备的标准化调用，支持4K视频流采集与AI降噪处理‌23。新增设备抽象层（DeviceAbstractionLayer），自动适配不同硬件厂商的驱动协议，降低</div> </li> <li><a href="/article/1896117175601655808.htm" title="FLASH与RAM" target="_blank">FLASH与RAM</a> <span class="text-muted">AARON_MJT</span> <a class="tag" taget="_blank" href="/search/STM32/1.htm">STM32</a><a class="tag" taget="_blank" href="/search/%E5%8D%95%E7%89%87%E6%9C%BA/1.htm">单片机</a><a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a><a class="tag" taget="_blank" href="/search/%E5%B5%8C%E5%85%A5%E5%BC%8F%E7%A1%AC%E4%BB%B6/1.htm">嵌入式硬件</a> <div>STM32内的FLASH与RAMFLASH1、什么是FLASH?FLASH的作用是什么?2、NandFlash&NorFlashRAM1、什么是RAM?RAM的作用?内存分区1、四区分配2、单片机的程序存储3、STM32有两部分内存空间4、为什么会有RAM1和RAM2？5、怎样将变量存储在CMM内存中？6、将实时操作系统的数据存放在CCM单片机的flash和RAM,相当于电脑的硬盘和内存条FLAS</div> </li> <li><a href="/article/1896115158724440064.htm" title="NXP Kinetis L系列：8.存储器系统：Flash与RAM" target="_blank">NXP Kinetis L系列：8.存储器系统：Flash与RAM</a> <span class="text-muted">chenlz2007</span> <a class="tag" taget="_blank" href="/search/STM32%E7%AD%89%E5%8D%95%E7%89%87%E6%9C%BA%E6%95%99%E7%A8%8B/1.htm">STM32等单片机教程</a><a class="tag" taget="_blank" href="/search/%E5%B5%8C%E5%85%A5%E5%BC%8F%E7%A1%AC%E4%BB%B6/1.htm">嵌入式硬件</a><a class="tag" taget="_blank" href="/search/%E5%8D%95%E7%89%87%E6%9C%BA/1.htm">单片机</a><a class="tag" taget="_blank" href="/search/arm%E5%BC%80%E5%8F%91/1.htm">arm开发</a> <div>8.存储器系统：Flash与RAM8.1Flash存储器8.1.1Flash存储器概述Flash存储器是一种非易失性存储器，用于存储程序代码和固定数据。在NXPKinetisL系列单片机中，Flash存储器具有多个特点，包括高可靠性和低功耗。Flash存储器的大小根据不同的型号有所不同，但通常在32KB到512KB之间。Flash存储器的访问速度相对较慢，但可以支持多次编程和擦除操作。8.1.2F</div> </li> <li><a href="/article/1896115159605243904.htm" title="【owt】构建m79的owt-client-native：使用vs2017" target="_blank">【owt】构建m79的owt-client-native：使用vs2017</a> <span class="text-muted">等风来不如迎风去</span> <a class="tag" taget="_blank" href="/search/WebRTC%E5%85%A5%E9%97%A8%E4%B8%8E%E5%AE%9E%E6%88%98/1.htm">WebRTC入门与实战</a><a class="tag" taget="_blank" href="/search/windows/1.htm">windows</a> <div>家里电脑换成了台式机，拷贝代码发现了三年前的owt客户端mfc工程。不用下载第三方库，试着构建下：owt-client-native我这里有3年前的代码，思索了下还是用vs2017构建吧：重新构建一下选用x86的vs2017vs的命令行控制台cls可以清理屏幕之前构建过vs2022的webrtc原版所以这里构建都在控制塔设置环境变量。遇到了一些问题，记录下来：可以看到默认使用了我电脑安装的最新的s</div> </li> <li><a href="/article/1896111128061210624.htm" title="ram与flash你知道多少？" target="_blank">ram与flash你知道多少？</a> <span class="text-muted">华维单片机编程</span> <a class="tag" taget="_blank" href="/search/%E5%8D%95%E7%89%87%E6%9C%BA/1.htm">单片机</a><a class="tag" taget="_blank" href="/search/ram/1.htm">ram</a><a class="tag" taget="_blank" href="/search/flash/1.htm">flash</a><a class="tag" taget="_blank" href="/search/%E5%86%85%E5%AD%98%E5%88%86%E9%85%8D%E4%B8%8Ec%E8%AF%AD%E8%A8%80%E5%8F%98%E9%87%8F%E7%9A%84%E5%AD%98%E5%82%A8%E4%BD%8D%E7%BD%AE/1.htm">内存分配与c语言变量的存储位置</a> <div>一电脑程序运行过程与单片机的区别我们平常使用的电脑的程序是存储在磁盘中的，由于磁盘的读取速度很慢，所以为了避免程序阻塞，电脑在程序执行之前，会把整个代码复制到内存中，CPU从内存中读取指令，然后去运行。为了合理利用和规划内存资源，除了操作系统的内存管理外，最重要的是内存的分段。对每一个进程，操作系统都会为其分配一片内存，同时将其分段为代码段、数据段、堆栈段等等，不同的段具有不同的属性。电脑的运行模</div> </li> <li><a href="/article/1896110363527671808.htm" title="清华出版 | DeepSeek使用手册（全）" target="_blank">清华出版 | DeepSeek使用手册（全）</a> <span class="text-muted">艾思科蓝 AiScholar</span> <a class="tag" taget="_blank" href="/search/%E4%BA%BA%E5%B7%A5%E6%99%BA%E8%83%BD%EF%BC%88AI%EF%BC%89%E7%B3%BB%E5%88%97/1.htm">人工智能（AI）系列</a><a class="tag" taget="_blank" href="/search/%E4%BA%BA%E5%B7%A5%E6%99%BA%E8%83%BD/1.htm">人工智能</a><a class="tag" taget="_blank" href="/search/%E5%A4%A7%E6%95%B0%E6%8D%AE/1.htm">大数据</a><a class="tag" taget="_blank" href="/search/ai/1.htm">ai</a><a class="tag" taget="_blank" href="/search/%E6%9C%BA%E5%99%A8%E4%BA%BA/1.htm">机器人</a><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%E5%86%99%E4%BD%9C/1.htm">AI写作</a><a class="tag" taget="_blank" href="/search/%E7%AE%97%E6%B3%95/1.htm">算法</a> <div>在科技迅猛发展的今天，人工智能技术正逐渐渗透到我们生活的每一个角落。清华大学新闻与传播学院-新媒体研究中心-元宇宙文化实验室团队最近发布了一份详尽的DeepSeek使用手册，该手册长达104页，堪称国产AI工具深度使用的标杆指南。这份教程不仅适合新手快速掌握基础操作，也为进阶用户提供了系统性方法论。免费领取104页【清华大学-DeepSeek使用手册】以下是主要内容及要点：一、DeepSeek概述</div> </li> <li><a href="/article/1896108977410863104.htm" title="深入理解C#中的属性和索引器：掌握封装与访问的艺术" target="_blank">深入理解C#中的属性和索引器：掌握封装与访问的艺术</a> <span class="text-muted">围垦</span> <a class="tag" taget="_blank" href="/search/C%23%E7%90%86%E8%A7%A3/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/visual/1.htm">visual</a><a class="tag" taget="_blank" href="/search/studio/1.htm">studio</a><a class="tag" taget="_blank" href="/search/windows/1.htm">windows</a> <div>深入理解C#中的属性和索引器：掌握封装与访问的艺术1.属性（Properties）1.1定义1.2语法1.3示例1.4使用1.5自动实现的属性（Auto-ImplementedProperties）2.索引器（Indexers）2.1定义2.2语法2.3示例2.4使用3.多参数索引器3.1定义3.2示例3.3使用4.属性和索引器的异同点4.1相同点4.2不同点5.注意事项5.1属性5.2索引器6.</div> </li> <li><a href="/article/1896108724112650240.htm" title="FreeRTOS空闲任务和钩子函数" target="_blank">FreeRTOS空闲任务和钩子函数</a> <span class="text-muted">古希腊掌握嵌入式的神</span> <a class="tag" taget="_blank" href="/search/%E5%B5%8C%E5%85%A5%E5%BC%8F%E7%A1%AC%E4%BB%B6/1.htm">嵌入式硬件</a><a class="tag" taget="_blank" href="/search/stm32/1.htm">stm32</a><a class="tag" taget="_blank" href="/search/%E6%93%8D%E4%BD%9C%E7%B3%BB%E7%BB%9F/1.htm">操作系统</a><a class="tag" taget="_blank" href="/search/freertos/1.htm">freertos</a><a class="tag" taget="_blank" href="/search/%E5%8D%95%E7%89%87%E6%9C%BA/1.htm">单片机</a><a class="tag" taget="_blank" href="/search/%E5%BC%80%E5%8F%91%E8%AF%AD%E8%A8%80/1.htm">开发语言</a> <div>FreeRTOS空闲任务（IdleTask）1.空闲任务的概念空闲任务是FreeRTOS中一个特殊的任务，由RTOS内核在调度器启动时自动创建。它的优先级是最低的，只有在系统中没有其他更高优先级的任务就绪时才会运行。2.空闲任务的作用防止CPU空转：当所有用户任务都处于阻塞或等待状态时，CPU会调度空闲任务运行，避免CPU空转，从而提高系统效率。资源回收：空闲任务负责清理被删除任务的资源，例如释放</div> </li> <li><a href="/article/89.htm" title="java责任链模式" target="_blank">java责任链模式</a> <span class="text-muted">3213213333332132</span> <a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/%E8%B4%A3%E4%BB%BB%E9%93%BE%E6%A8%A1%E5%BC%8F/1.htm">责任链模式</a><a class="tag" taget="_blank" href="/search/%E6%9D%91%E6%B0%91%E5%91%8A%E5%8E%BF%E9%95%BF/1.htm">村民告县长</a> <div>责任链模式，通常就是一个请求从最低级开始往上层层的请求，当在某一层满足条件时，请求将被处理，当请求到最高层仍未满足时，则请求不会被处理。 就是一个请求在这个链条的责任范围内，会被相应的处理，如果超出链条的责任范围外，请求不会被相应的处理。 下面代码模拟这样的效果： 创建一个政府抽象类,方便所有的具体政府部门继承它。 package 责任链模式; /** * </div> </li> <li><a href="/article/216.htm" title="linux、mysql、nginx、tomcat 性能参数优化" target="_blank">linux、mysql、nginx、tomcat 性能参数优化</a> <span class="text-muted">ronin47</span> <div>一、linux 系统内核参数 /etc/sysctl.conf文件常用参数 net.core.netdev_max_backlog = 32768 #允许送到队列的数据包的最大数目 net.core.rmem_max = 8388608 #SOCKET读缓存区大小 net.core.wmem_max = 8388608 #SOCKET写缓存区大</div> </li> <li><a href="/article/343.htm" title="php命令行界面" target="_blank">php命令行界面</a> <span class="text-muted">dcj3sjt126com</span> <a class="tag" taget="_blank" href="/search/PHP/1.htm">PHP</a><a class="tag" taget="_blank" href="/search/cli/1.htm">cli</a> <div>常用选项 php -v php -i PHP安装的有关信息 php -h 访问帮助文件 php -m 列出编译到当前PHP安装的所有模块 执行一段代码 php -r 'echo "hello, world!";' php -r 'echo "Hello, World!\n";' php -r '$ts = filemtime("</div> </li> <li><a href="/article/470.htm" title="Filter&Session" target="_blank">Filter&Session</a> <span class="text-muted">171815164</span> <a class="tag" taget="_blank" href="/search/session/1.htm">session</a> <div>Filter HttpServletRequest requ = (HttpServletRequest) req; HttpSession session = requ.getSession(); if (session.getAttribute("admin") == null) { PrintWriter out = res.ge</div> </li> <li><a href="/article/597.htm" title="连接池与Spring,Hibernate结合" target="_blank">连接池与Spring,Hibernate结合</a> <span class="text-muted">g21121</span> <a class="tag" taget="_blank" href="/search/Hibernate/1.htm">Hibernate</a> <div>        前几篇关于Java连接池的介绍都是基于Java应用的，而我们常用的场景是与Spring和ORM框架结合，下面就利用实例学习一下这方面的配置。         1.下载相关内容：     &nb</div> </li> <li><a href="/article/724.htm" title="[简单]mybatis判断数字类型" target="_blank">[简单]mybatis判断数字类型</a> <span class="text-muted">53873039oycg</span> <a class="tag" taget="_blank" href="/search/mybatis/1.htm">mybatis</a> <div>       昨天同事反馈mybatis保存不了int类型的属性,一直报错，错误信息如下:       Caused by: java.lang.NumberFormatException: For input string: "null" at sun.mis</div> </li> <li><a href="/article/851.htm" title="项目启动时或者启动后ava.lang.OutOfMemoryError: PermGen space" target="_blank">项目启动时或者启动后ava.lang.OutOfMemoryError: PermGen space</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/jvm/1.htm">jvm</a><a class="tag" taget="_blank" href="/search/tomcat/1.htm">tomcat</a><a class="tag" taget="_blank" href="/search/catalina.sh/1.htm">catalina.sh</a><a class="tag" taget="_blank" href="/search/eclipse.ini/1.htm">eclipse.ini</a> <div>   在启动比较大的项目时，因为存在大量的jsp页面，所以在编译的时候会生成很多的.class文件，.class文件是都会被加载到jvm的方法区中，如果要加载的class文件很多，就会出现方法区溢出异常 java.lang.OutOfMemoryError: PermGen space.     解决办法是点击eclipse里的tomcat，在</div> </li> <li><a href="/article/978.htm" title="我的crm小结" target="_blank">我的crm小结</a> <span class="text-muted">aijuans</span> <a class="tag" taget="_blank" href="/search/crm/1.htm">crm</a> <div>各种原因吧，crm今天才完了。主要是接触了几个新技术： Struts2、poi、ibatis这几个都是以前的项目中用过的。 Jsf、tapestry是这次新接触的，都是界面层的框架，用起来也不难。思路和struts不太一样，传说比较简单方便。不过个人感觉还是struts用着顺手啊，当然springmvc也很顺手，不知道是因为习惯还是什么。jsf和tapestry应用的时候需要知道他们的标签、主</div> </li> <li><a href="/article/1105.htm" title="spring里配置使用hibernate的二级缓存几步" target="_blank">spring里配置使用hibernate的二级缓存几步</a> <span class="text-muted">antonyup_2006</span> <a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/spring/1.htm">spring</a><a class="tag" taget="_blank" href="/search/Hibernate/1.htm">Hibernate</a><a class="tag" taget="_blank" href="/search/xml/1.htm">xml</a><a class="tag" taget="_blank" href="/search/cache/1.htm">cache</a> <div>．在spring的配置文件中 applicationContent.xml，hibernate部分加入 xml 代码 <prop key="hibernate.cache.provider_class">org.hibernate.cache.EhCacheProvider</prop> <prop key="hi</div> </li> <li><a href="/article/1232.htm" title="JAVA基础面试题" target="_blank">JAVA基础面试题</a> <span class="text-muted">百合不是茶</span> <a class="tag" taget="_blank" href="/search/%E6%8A%BD%E8%B1%A1%E5%AE%9E%E7%8E%B0%E6%8E%A5%E5%8F%A3/1.htm">抽象实现接口</a><a class="tag" taget="_blank" href="/search/String%E7%B1%BB/1.htm">String类</a><a class="tag" taget="_blank" href="/search/%E6%8E%A5%E5%8F%A3%E7%BB%A7%E6%89%BF/1.htm">接口继承</a><a class="tag" taget="_blank" href="/search/%E6%8A%BD%E8%B1%A1%E7%B1%BB%E7%BB%A7%E6%89%BF%E5%AE%9E%E4%BD%93%E7%B1%BB/1.htm">抽象类继承实体类</a><a class="tag" taget="_blank" href="/search/%E8%87%AA%E5%AE%9A%E4%B9%89%E5%BC%82%E5%B8%B8/1.htm">自定义异常</a> <div>/*   * 栈（stack）：主要保存基本类型（或者叫内置类型）（char、byte、short、   *int、long、 float、double、boolean）和对象的引用，数据可以共享，速度仅次于   * 寄存器（register），快于堆。堆（heap）：用于存储对象。   */  &</div> </li> <li><a href="/article/1359.htm" title="让sqlmap文件 "继承" 起来" target="_blank">让sqlmap文件 "继承" 起来</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/ibatis/1.htm">ibatis</a><a class="tag" taget="_blank" href="/search/sqlmap/1.htm">sqlmap</a> <div>        多个项目中使用ibatis , 和数据库表对应的 sqlmap文件（增删改查等基本语句)，dao, pojo 都是由工具自动生成的, 现在将这些自动生成的文件放在一个单独的工程中，其它项目工程中通过jar包来引用 ，并通过"继承"为基础的sqlmap文件，dao,pojo 添加新的方法来满足项</div> </li> <li><a href="/article/1486.htm" title="精通Oracle10编程SQL(13)开发触发器" target="_blank">精通Oracle10编程SQL(13)开发触发器</a> <span class="text-muted">bijian1013</span> <a class="tag" taget="_blank" href="/search/oracle/1.htm">oracle</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/plsql/1.htm">plsql</a> <div>/* *开发触发器 */ --得到日期是周几 select to_char(sysdate+4,'DY','nls_date_language=AMERICAN') from dual; select to_char(sysdate,'DY','nls_date_language=AMERICAN') from dual; --建立BEFORE语句触发器 CREATE O</div> </li> <li><a href="/article/1613.htm" title="【EhCache三】EhCache查询" target="_blank">【EhCache三】EhCache查询</a> <span class="text-muted">bit1129</span> <a class="tag" taget="_blank" href="/search/ehcache/1.htm">ehcache</a> <div>本文介绍EhCache查询缓存中数据，EhCache提供了类似Hibernate的查询API，可以按照给定的条件进行查询。   要对EhCache进行查询，需要在ehcache.xml中设定要查询的属性   数据准备 @Before public void setUp() { //加载EhCache配置文件 Inpu</div> </li> <li><a href="/article/1740.htm" title="CXF框架入门实例" target="_blank">CXF框架入门实例</a> <span class="text-muted">白糖_</span> <a class="tag" taget="_blank" href="/search/spring/1.htm">spring</a><a class="tag" taget="_blank" href="/search/Web/1.htm">Web</a><a class="tag" taget="_blank" href="/search/%E6%A1%86%E6%9E%B6/1.htm">框架</a><a class="tag" taget="_blank" href="/search/webservice/1.htm">webservice</a><a class="tag" taget="_blank" href="/search/servlet/1.htm">servlet</a> <div>CXF是apache旗下的开源框架，由Celtix + XFire这两门经典的框架合成，是一套非常流行的web service框架。 它提供了JAX-WS的全面支持，并且可以根据实际项目的需要，采用代码优先（Code First）或者 WSDL 优先（WSDL First）来轻松地实现 Web Services 的发布和使用，同时它能与spring进行完美结合。 在apache cxf官网提供</div> </li> <li><a href="/article/1867.htm" title="angular.equals" target="_blank">angular.equals</a> <span class="text-muted">boyitech</span> <a class="tag" taget="_blank" href="/search/AngularJS/1.htm">AngularJS</a><a class="tag" taget="_blank" href="/search/AngularJS+API/1.htm">AngularJS API</a><a class="tag" taget="_blank" href="/search/AnguarJS+%E4%B8%AD%E6%96%87API/1.htm">AnguarJS 中文API</a><a class="tag" taget="_blank" href="/search/angular.equals/1.htm">angular.equals</a> <div>angular.equals   描述: 比较两个值或者两个对象是不是 相等。还支持值的类型，正则表达式和数组的比较。   两个值或对象被认为是 相等的前提条件是以下的情况至少能满足一项： 两个值或者对象能通过=== （恒等） 的比较 两个值或者对象是同样类型，并且他们的属性都能通过angular</div> </li> <li><a href="/article/1994.htm" title="java-腾讯暑期实习生-输入一个数组A[1,2,...n]，求输入B，使得数组B中的第i个数字B[i]=A[0]*A[1]*...*A[i-1]*A[i+1]" target="_blank">java-腾讯暑期实习生-输入一个数组A[1,2,...n]，求输入B，使得数组B中的第i个数字B[i]=A[0]*A[1]*...*A[i-1]*A[i+1]</a> <span class="text-muted">bylijinnan</span> <a class="tag" taget="_blank" href="/search/java/1.htm">java</a> <div>这道题的具体思路请参看 何海涛的微博：http://weibo.com/zhedahht import java.math.BigInteger; import java.util.Arrays; public class CreateBFromATencent { /** * 题目：输入一个数组A[1,2,...n]，求输入B，使得数组B中的第i个数字B[i]=A</div> </li> <li><a href="/article/2121.htm" title="FastDFS 的安装和配置 修订版" target="_blank">FastDFS 的安装和配置 修订版</a> <span class="text-muted">Chen.H</span> <a class="tag" taget="_blank" href="/search/linux/1.htm">linux</a><a class="tag" taget="_blank" href="/search/fastDFS/1.htm">fastDFS</a><a class="tag" taget="_blank" href="/search/%E5%88%86%E5%B8%83%E5%BC%8F%E6%96%87%E4%BB%B6%E7%B3%BB%E7%BB%9F/1.htm">分布式文件系统</a> <div>FastDFS Home:http://code.google.com/p/fastdfs/ 1. 安装 http://code.google.com/p/fastdfs/wiki/Setup http://hi.baidu.com/leolance/blog/item/3c273327978ae55f93580703.html 安装libevent (对libevent的版本要求为1.4.</div> </li> <li><a href="/article/2248.htm" title="[强人工智能]拓扑扫描与自适应构造器" target="_blank">[强人工智能]拓扑扫描与自适应构造器</a> <span class="text-muted">comsci</span> <a class="tag" taget="_blank" href="/search/%E4%BA%BA%E5%B7%A5%E6%99%BA%E8%83%BD/1.htm">人工智能</a> <div>       当我们面对一个有限拓扑网络的时候,在对已知的拓扑结构进行分析之后,发现在连通点之后,还存在若干个子网络,且这些网络的结构是未知的,数据库中并未存在这些网络的拓扑结构数据....这个时候,我们该怎么办呢?       那么,现在我们必须设计新的模块和代码包来处理上面的问题</div> </li> <li><a href="/article/2375.htm" title="oracle merge into的用法" target="_blank">oracle merge into的用法</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/sql/1.htm">sql</a><a class="tag" taget="_blank" href="/search/merget+into/1.htm">merget into</a> <div>Oracle中merge into的使用 http://blog.csdn.net/yuzhic/article/details/1896878 http://blog.csdn.net/macle2010/article/details/5980965 该命令使用一条语句从一个或者多个数据源中完成对表的更新和插入数据. ORACLE 9i 中，使用此命令必须同时指定UPDATE 和INSE</div> </li> <li><a href="/article/2502.htm" title="不适合使用Hadoop的场景" target="_blank">不适合使用Hadoop的场景</a> <span class="text-muted">datamachine</span> <a class="tag" taget="_blank" href="/search/hadoop/1.htm">hadoop</a> <div>转自：http://dev.yesky.com/296/35381296.shtml。 　　Hadoop通常被认定是能够帮助你解决所有问题的唯一方案。 当人们提到“大数据”或是“数据分析”等相关问题的时候，会听到脱口而出的回答：Hadoop!  实际上Hadoop被设计和建造出来，是用来解决一系列特定问题的。对某些问题来说，Hadoop至多算是一个不好的选择，对另一些问题来说，选择Ha</div> </li> <li><a href="/article/2629.htm" title="YII findAll的用法" target="_blank">YII findAll的用法</a> <span class="text-muted">dcj3sjt126com</span> <a class="tag" taget="_blank" href="/search/yii/1.htm">yii</a> <div>看文档比较糊涂，其实挺简单的： $predictions=Prediction::model()->findAll("uid=:uid",array(":uid"=>10));   第一个参数是选择条件：”uid=10″。其中:uid是一个占位符，在后面的array(“:uid”=>10)对齐进行了赋值； 更完善的查询需要</div> </li> <li><a href="/article/2756.htm" title="vim 常用 NERDTree 快捷键" target="_blank">vim 常用 NERDTree 快捷键</a> <span class="text-muted">dcj3sjt126com</span> <a class="tag" taget="_blank" href="/search/vim/1.htm">vim</a> <div>下面给大家整理了一些vim NERDTree的常用快捷键了，这里几乎包括了所有的快捷键了，希望文章对各位会带来帮助。 切换工作台和目录 ctrl + w + h 光标 focus 左侧树形目录ctrl + w + l 光标 focus 右侧文件显示窗口ctrl + w + w 光标自动在左右侧窗口切换ctrl + w + r 移动当前窗口的布局位置 o 在已有窗口中打开文件、目录或书签，并跳</div> </li> <li><a href="/article/2883.htm" title="Java把目录下的文件打印出来" target="_blank">Java把目录下的文件打印出来</a> <span class="text-muted">蕃薯耀</span> <a class="tag" taget="_blank" href="/search/%E5%88%97%E5%87%BA%E7%9B%AE%E5%BD%95%E4%B8%8B%E7%9A%84%E6%96%87%E4%BB%B6/1.htm">列出目录下的文件</a><a class="tag" taget="_blank" href="/search/%E6%96%87%E4%BB%B6%E5%A4%B9%E4%B8%8B%E9%9D%A2%E7%9A%84%E6%96%87%E4%BB%B6/1.htm">文件夹下面的文件</a><a class="tag" taget="_blank" href="/search/%E7%9B%AE%E5%BD%95%E4%B8%8B%E7%9A%84%E6%96%87%E4%BB%B6/1.htm">目录下的文件</a> <div>Java把目录下的文件打印出来 >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> 蕃薯耀 2015年7月11日 11:02:</div> </li> <li><a href="/article/3010.htm" title="linux远程桌面----VNCServer与rdesktop" target="_blank">linux远程桌面----VNCServer与rdesktop</a> <span class="text-muted">hanqunfeng</span> <a class="tag" taget="_blank" href="/search/Desktop/1.htm">Desktop</a> <div>windows远程桌面到linux，需要在linux上安装vncserver，并开启vnc服务，同时需要在windows下使用vnc-viewer访问Linux。vncserver同时支持linux远程桌面到linux。   linux远程桌面到windows，需要在linux上安装rdesktop，同时开启windows的远程桌面访问。   下面分别介绍，以windo</div> </li> <li><a href="/article/3137.htm" title="guava中的join和split功能" target="_blank">guava中的join和split功能</a> <span class="text-muted">jackyrong</span> <a class="tag" taget="_blank" href="/search/java/1.htm">java</a> <div>guava库中，包含了很好的join和split的功能，例子如下： 1） 将LIST转换为使用字符串连接的字符串    List<String> names = Lists.newArrayList("John", "Jane", "Adam", "Tom"); </div> </li> <li><a href="/article/3264.htm" title="Web开发技术十年发展历程" target="_blank">Web开发技术十年发展历程</a> <span class="text-muted">lampcy</span> <a class="tag" taget="_blank" href="/search/android/1.htm">android</a><a class="tag" taget="_blank" href="/search/Web/1.htm">Web</a><a class="tag" taget="_blank" href="/search/%E6%B5%8F%E8%A7%88%E5%99%A8/1.htm">浏览器</a><a class="tag" taget="_blank" href="/search/html5/1.htm">html5</a> <div>回顾web开发技术这十年发展历程： Ajax 03年的时候我上六年级，那时候网吧刚在小县城的角落萌生。传奇，大话西游第一代网游一时风靡。我抱着试一试的心态给了网吧老板两块钱想申请个号玩玩，然后接下来的一个小时我一直在，注，册，账，号。 彼时网吧用的512k的带宽，注册的时候，填了一堆信息，提交，页面跳转，嘣，”您填写的信息有误，请重填”。然后跳转回注册页面，以此循环。我现在时常想，如果当时a</div> </li> <li><a href="/article/3391.htm" title="架构师之mima-----------------mina的非NIO控制IOBuffer(说得比较好)" target="_blank">架构师之mima-----------------mina的非NIO控制IOBuffer(说得比较好)</a> <span class="text-muted">nannan408</span> <a class="tag" taget="_blank" href="/search/buffer/1.htm">buffer</a> <div>1.前言。   如题。 2.代码。   IoService IoService是一个接口，有两种实现：IoAcceptor和IoConnector；其中IoAcceptor是针对Server端的实现，IoConnector是针对Client端的实现；IoService的职责包括： 1、监听器管理 2、IoHandler 3、IoSession</div> </li> <li><a href="/article/3518.htm" title="ORA-00054:resource busy and acquire with NOWAIT specified" target="_blank">ORA-00054:resource busy and acquire with NOWAIT specified</a> <span class="text-muted">Everyday都不同</span> <a class="tag" taget="_blank" href="/search/oracle/1.htm">oracle</a><a class="tag" taget="_blank" href="/search/session/1.htm">session</a><a class="tag" taget="_blank" href="/search/Lock/1.htm">Lock</a> <div>[Oracle] 今天对一个数据量很大的表进行操作时，出现如题所示的异常。此时表明数据库的事务处于“忙”的状态，而且被lock了，所以必须先关闭占用的session。   step1，查看被lock的session：   select t2.username, t2.sid, t2.serial#, t2.logon_time from v$locked_obj</div> </li> <li><a href="/article/3645.htm" title="javascript学习笔记" target="_blank">javascript学习笔记</a> <span class="text-muted">tntxia</span> <a class="tag" taget="_blank" href="/search/JavaScript/1.htm">JavaScript</a> <div>  javascript里面有6种基本类型的值:number、string、boolean、object、function和undefined。number：就是数字值，包括整数、小数、NaN、正负无穷。string:字符串类型、单双引号引起来的内容。boolean:true、false object:表示所有的javascript对象，不用多说function:我们熟悉的方法，也就是</div> </li> <li><a href="/article/3772.htm" title="Java enum的用法详解" target="_blank">Java enum的用法详解</a> <span class="text-muted">xieke90</span> <a class="tag" taget="_blank" href="/search/enum/1.htm">enum</a><a class="tag" taget="_blank" href="/search/%E6%9E%9A%E4%B8%BE/1.htm">枚举</a> <div>Java中枚举实现的分析：     示例：  public static enum SEVERITY{ INFO,WARN,ERROR }     enum很像特殊的class，实际上enum声明定义的类型就是一个类。 而这些类都是类库中Enum类的子类      (java.l</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>