慕课网HTML+CSS基础笔记一

一、Html和CSS的关系

学习web前端开发基础技术需要掌握:HTML、CSS、JavaScript语言。下面我们就来了解下这三门技术都是用来实现什么的:

  1. HTML是网页内容的载体。内容就是网页制作者放在页面上想要让用户浏览的信息,可以包含文字、图片、视频等。
  2. CSS样式是表现。就像网页的外衣。比如,标题字体、颜色变化,或为标题加入背景图片、边框等。所有这些用来改变内容外观的东西称之为表现。
  3. JavaScript是用来实现网页上的特效效果。如:鼠标滑过弹出下拉菜单。或鼠标滑过表格的背景颜色改变。还有焦点新闻(新闻图片)的轮换。可以这么理解,有动画的,有交互的一般都是用JavaScript来实现的。
二、标签的语法
  1. 标签由英文尖括号<
    >
    括起来,如
    就是一个标签。
  2. html中的标签一般都是成对出现的,分开始标签结束标签。结束标签比开始标签多了一个/

    如:
    (1)

(2)

(3)

慕课网HTML+CSS基础笔记一_第1张图片

  1. 标签与标签之间是可以嵌套的,但先后顺序必须保持一致,如:
    里嵌套

    ,那么

    必须放在
    的前面。如下图所示。
    慕课网HTML+CSS基础笔记一_第2张图片
  2. HTML标签不区分大小写,



    是一样的,但建议小写,因为大部分程序员都以小写为准。

三、认识html文件基本结构

这一节中我们来学习html文件的结构:一个HTML文件是有自己固定的结构的。
... ...
代码讲解:


  1. 称为根标签,所有的网页标签都在中。

  2. 标签用于定义文档的头部,它是所有头部元素的容器。头部元素有<br> 、<script><br> 、 <style><br> 、<link><br> 、 <meta><br> 等标签,头部标签在下一小节中会有详细介绍。</li> <li>在<body><br> 和</body><br> 标签之间的内容是网页的主要内容,如<h1><br> 、<p><br> 、<a><br> 、<img><br> 等网页内容标签,在这里的标签中的内容会在浏览器中显示出来。</li> </ol> <h5>四、认识head标签</h5> <p>做得好,下面我们来了解一下<head></p> <p>标签的作用。文档的头部描述了文档的各种属性和信息,包括文档的标题等。绝大多数文档头部包含的数据都不会真正作为内容显示给读者。<br> 下面这些标签可用在 head 部分:<br> <head> <title>...
    <br> 标签<br> :在<title>和标签之间的文字内容是网页的标题信息,它会出现在浏览器的标题栏中。网页的title标签用于告诉用户和搜索引擎这个网页的主要内容是什么,搜索引擎可以通过网页标题,迅速的判断出网页的主题。每个网页的内容都是不同的,每个网页都应该有一个独一无二的title。
    例如:
    hello world
    <br> 标签的内容“hello world”会在浏览器中的标题栏上显示出来,如下图所示:<br> </p> <div class="image-package"> <div class="image-container" style="max-width: 410px; max-height: 215px;"> <div class="image-view"> <a href="http://img.e-com-net.com/image/info10/ff0fc1cd3f6c481c91b9bddd4bcc37d3.jpg" target="_blank"><img src="http://img.e-com-net.com/image/info10/ff0fc1cd3f6c481c91b9bddd4bcc37d3.jpg" width="410" height="215" alt="慕课网HTML+CSS基础笔记一_第3张图片" style="border:1px solid black;"></a> </div> </div> <div class="image-caption"></div> </div> <p></p> <h5>五、了解HTML的代码注释</h5> <p>什么是<strong>代码注释</strong>?<strong>代码注释的作用</strong>是帮助程序员标注代码的用途,过一段时间后再看你所编写的代码,就能很快想起这段代码的用途。<strong>代码注释</strong>不仅方便程序员自己回忆起以前代码的用途,还可以帮助其他程序员很快的读懂你的程序的功能,方便多人合作开发网页代码。<br> <strong>语法:</strong><br> ****</p> <h5>六、语义化,让你的网页更好的被搜索引擎理解</h5> <p>在这一章节我们要开始把网页中常用到的标签一 一向大家介绍,学习这一章节的时候要记住学习html标签过程中,主要注意两个方面的学习:标签的用途、标签在浏览器中的默认样式。<br> <strong>标签的用途</strong>:我们学习网页制作时,常常会听到一个词,<strong>语义化</strong>。那么什么叫做语义化呢,说的通俗点就是:明白每个标签的用途(在什么情况下使用此标签合理)比如,网页上的文章的<strong>标题</strong>就可以用标题标签,网页上的各个栏目的<strong>栏目名称</strong>也可以使用标题标签。文章中内容的段落就得放在<strong>段落标签</strong>中,在文章中有想强调的文本,就可以使用 em 标签表示强调等等。<br> 讲了这么多语义化,但是语义化可以给我们带来什么样的好处呢?</p> <ol> <li>更容易被搜索引擎收录。</li> <li>更容易让屏幕阅读器读出网页内容。</li> </ol> <h5>七、<body>标签,网页上显示的内容放在这里</h5> <pre><code> 还记得body标签吗,在上一章节我们简单介绍过:在网页上要展示出来的页面内容一定要放在body标签中。如下图是一个新闻文章的网页。 </code></pre> <p></p> <div class="image-package"> <div class="image-container" style="max-width: 700px; max-height: 564px;"> <div class="image-view"> <a href="http://img.e-com-net.com/image/info10/7f3a6aa8bb504a37b6766895f0ab5c8b.jpg" target="_blank"><img src="http://img.e-com-net.com/image/info10/7f3a6aa8bb504a37b6766895f0ab5c8b.jpg" width="650" height="334" alt="慕课网HTML+CSS基础笔记一_第4张图片" style="border:1px solid black;"></a> </div> </div> <div class="image-caption"></div> </div> <br> 在浏览器中的显示效果: <br> <div class="image-package"> <div class="image-container" style="max-width: 576px; max-height: 351px;"> <div class="image-view"> <a href="http://img.e-com-net.com/image/info10/820ff69cb40a4a15b9fc4af7bc7030fe.png" target="_blank"><img src="http://img.e-com-net.com/image/info10/820ff69cb40a4a15b9fc4af7bc7030fe.png" width="576" height="351" alt="慕课网HTML+CSS基础笔记一_第5张图片" style="border:1px solid black;"></a> </div> </div> <div class="image-caption"></div> </div> <p></p> <h5>八、开始学习<p>标签,添加段落</h5> <p>如果想在网页上显示文章,这时就需要<p>标签了,把文章的段落放到<p>标签中。<br> 语法:<br> <p>段落文本</p></p> <p>注意一段文字一个<p><br> 标签,如在一篇新闻文章中有3段文字,就要把这3个段落分别放到<strong>3</strong>个<p><br> 标签中。如下图所示。<br> </p> <div class="image-package"> <div class="image-container" style="max-width: 483px; max-height: 211px;"> <div class="image-view"> <a href="http://img.e-com-net.com/image/info10/ba87346a772f4ad0bddb7f85a1915644.png" target="_blank"><img src="http://img.e-com-net.com/image/info10/ba87346a772f4ad0bddb7f85a1915644.png" width="483" height="211" alt="慕课网HTML+CSS基础笔记一_第6张图片" style="border:1px solid black;"></a> </div> </div> <div class="image-caption"></div> </div> <br> 在浏览器中显示的效果: <br> <div class="image-package"> <div class="image-container" style="max-width: 596px; max-height: 399px;"> <div class="image-view"> <a href="http://img.e-com-net.com/image/info10/2d21273742464ff08dae42959ccebbe3.png" target="_blank"><img src="http://img.e-com-net.com/image/info10/2d21273742464ff08dae42959ccebbe3.png" width="596" height="399" alt="慕课网HTML+CSS基础笔记一_第7张图片" style="border:1px solid black;"></a> </div> </div> <div class="image-caption"></div> </div> <br> <p> <br> 标签的默认样式,可以在上图中看出来,段前段后都会有空白,如果不喜欢这个空白,可以用css样式来删除或改变它。 <p></p> <h5>九、了解<hx>标签,为你的网页添加标题</h5> <p>文章的段落用<p><br> 标签,那么文章的标题用什么标签呢?在本节我们将使用<hx><br> 标签来制作<strong>文章的标题</strong>。标题标签一共有6个,h1、h2、h3、h4、h5、h6<br> 分别为一级标题、二级标题、三级标题、四级标题、五级标题、六级标题。并且依据重要性递减。<h1><br> 是最高的等级。<strong>语法:</strong><hx>标题文本</hx><br> (x为1-6)文章的标题前面已经说过了,可以使用标题标签,另外网页上的各个<strong>栏目的标题</strong>也可使用它们。如下图为腾讯网站。<br> </p> <div class="image-package"> <div class="image-container" style="max-width: 700px; max-height: 572px;"> <div class="image-view"> <a href="http://img.e-com-net.com/image/info10/2ec1ce9006b848ac875f7cf11aa531c0.jpg" target="_blank"><img src="http://img.e-com-net.com/image/info10/2ec1ce9006b848ac875f7cf11aa531c0.jpg" width="650" height="292" alt="慕课网HTML+CSS基础笔记一_第8张图片" style="border:1px solid black;"></a> </div> </div> <div class="image-caption"></div> </div> <br> 注意:因为h1 <br> 标签在网页中比较重要,所以一般h1 <br> 标签被用在网站名称上。腾讯网站就是这样做的。如:<h1>腾讯网</h1> <p></p> <p><strong>h1-h6****标签的默认样式:</strong><br> 标签代码:<br> </p> <div class="image-package"> <div class="image-container" style="max-width: 172px; max-height: 125px;"> <div class="image-view"> <a href="http://img.e-com-net.com/image/info10/cd60cdf46e6144e4bcee3b839b0d833d.png" target="_blank"><img src="http://img.e-com-net.com/image/info10/cd60cdf46e6144e4bcee3b839b0d833d.png" width="172" height="125" alt="慕课网HTML+CSS基础笔记一_第9张图片" style="border:1px solid black;"></a> </div> </div> <div class="image-caption"></div> </div> <br> 在浏览器中显示的样式: <br> <div class="image-package"> <div class="image-container" style="max-width: 596px; max-height: 399px;"> <div class="image-view"> <a href="http://img.e-com-net.com/image/info10/e3688961e83f47e99182d0c444fde837.jpg" target="_blank"><img src="http://img.e-com-net.com/image/info10/e3688961e83f47e99182d0c444fde837.jpg" width="596" height="399" alt="慕课网HTML+CSS基础笔记一_第10张图片" style="border:1px solid black;"></a> </div> </div> <div class="image-caption"></div> </div> <br> 从上面的图片可以看出标题标签的样式都会加粗,h1 <br> 标签字号最大,h2 <br> 标签字号相对h1要小,以此类推h6 <br> 标签的字号最小。 <p></p> <h5>十、加入强调语气,使用<strong>和<em>标签</h5> <pre><code> 有了段落又有了标题,现在如果想在一段话中特别强调某几个文字,这时候就可以用到<em>或<strong>标签。 但两者在强调的语气上有区别:<em> 表示强调,<strong> 表示更强烈的强调。并且在浏览器中<em> 默认用**斜体**表示,<strong> 用**粗体**表示。两个标签相比,目前国内前端程序员更喜欢使用<strong>表示强调。 </code></pre> <p><strong>语法:</strong><br> <em>需要强调的文本</em></p> <p><strong>需要强调的文本</strong></p> <p>如,在网上商城中,某产品的打折后的价格是需要强调的。如下图。<br> </p> <div class="image-package"> <div class="image-container" style="max-width: 172px; max-height: 271px;"> <div class="image-view"> <a href="http://img.e-com-net.com/image/info10/77cb7975c11540269156f2bd12599c5a.jpg" target="_blank"><img src="http://img.e-com-net.com/image/info10/77cb7975c11540269156f2bd12599c5a.jpg" width="172" height="271" alt="慕课网HTML+CSS基础笔记一_第11张图片" style="border:1px solid black;"></a> </div> </div> <div class="image-caption"></div> </div> <br> 代码实现: <br> <div class="image-package"> <div class="image-container" style="max-width: 230px; max-height: 97px;"> <div class="image-view"> <a href="http://img.e-com-net.com/image/info10/99f1c9f6c9054a7aac49bb043ba55769.png" target="_blank"><img src="http://img.e-com-net.com/image/info10/99f1c9f6c9054a7aac49bb043ba55769.png" width="230" height="97"></a> </div> </div> <div class="image-caption"></div> </div> <br> <strong>在浏览器中默认样式是有区别的:</strong> <br> 原代码,如下图。 <br> <div class="image-package"> <div class="image-container" style="max-width: 700px; max-height: 314px;"> <div class="image-view"> <a href="http://img.e-com-net.com/image/info10/269861c0feb0478a8cb8e6cf1b367b3b.jpg" target="_blank"><img src="http://img.e-com-net.com/image/info10/269861c0feb0478a8cb8e6cf1b367b3b.jpg" width="650" height="209" alt="慕课网HTML+CSS基础笔记一_第12张图片" style="border:1px solid black;"></a> </div> </div> <div class="image-caption"></div> </div> <br> 浏览器中的样子,如下图。 <br> <div class="image-package"> <div class="image-container" style="max-width: 624px; max-height: 377px;"> <div class="image-view"> <a href="http://img.e-com-net.com/image/info10/ba7258de70014e90a91634b949ff9206.png" target="_blank"><img src="http://img.e-com-net.com/image/info10/ba7258de70014e90a91634b949ff9206.png" width="624" height="377" alt="慕课网HTML+CSS基础笔记一_第13张图片" style="border:1px solid black;"></a> </div> </div> <div class="image-caption"></div> </div> <br> <em>的内容在浏览中显示为斜体,<strong>显示为加粗。如果不喜欢这种样式,没有关系,以后可以使用css样式去改变它。 <p></p> <h5>十一、使用<span>标签为文字设置单独样式</h5> <p>这一小节讲解<span>标签,我们对<em><br> 、<strong><br> 、<span><br> 这三个标签进行一下总结:</p> <ol> <li><em><br> 和<strong><br> 标签是为了<strong>强调</strong>一段话中的关键字时使用,它们的语义是<strong>强调。</strong> </li> <li><span><br> 标签是没有语义的,它的作用就是为了设置单独的样式用的。<br> 如果现在我们想把上一小节的第一段话“美国梦”三个字设置成blue(蓝色),但注意不是为了<strong>强调</strong>“美国梦”,而只是想为它设置和其它文字不同的样式(并不想让屏幕阅读器对“美国梦”这三个字加重音读出),所以这样情况下就可以用到<span>标签了。<br> 如下面例子:<br> <p>1922年的春天,一个想要成名名叫<strong><em>尼克•卡拉威</em></strong>(托比•马奎尔Tobey Maguire 饰)的作家,离开了美国中西部,来到了纽约。那是一个道德感渐失,爵士乐流行,走私为王,<strong><strong>股票</strong></strong>飞涨的时代。为了追寻他的<strong><span>美国梦</span></strong>,他搬入纽约附近一海湾居住。</p><br> <strong>语法:</strong><br> <span>文本</span></li> </ol> <h5>十二、<q>标签,短文本引用</h5> <pre><code> 想在你的html中加一段引用吗?比如在你的网页的文章里想引用某个作家的一句诗,这样会使你的文章更加出彩,那么<q> </code></pre> <p>标签是你所需要的。<br> <strong>语法:</strong><br> <q>引用文本</q></p> <p>如下面例子:<br> <p>最初知道庄子,是从一首诗<strong><q>庄生晓梦迷蝴蝶。望帝春心托杜鹃。</q></strong>开始的。虽然当时不知道是什么意思,只是觉得诗句挺特别。后来才明白这个典故出自是庄子的《逍遥游》,《逍遥游》代表了庄子思想的最高境界,是对世俗社会的功名利禄及自己的舍弃。</p></p> <p><strong>讲解:</strong></p> <ol> <li>在上面的例子中,“<strong>庄生晓梦迷蝴蝶。望帝春心托杜鹃。</strong>” 这是一句诗歌,出自晚唐诗人李商隐的《锦瑟》 。因为不是作者自己的文字,所以需要使用<q></q><br> 实现引用。</li> <li>注意要引用的文本不用加<strong>双引号</strong>,浏览器会对q标签自动添加双引号。<br> 下图是代码显示结果:<br> <div class="image-package"> <div class="image-container" style="max-width: 575px; max-height: 340px;"> <div class="image-view"> <a href="http://img.e-com-net.com/image/info10/295cdec86c6e48b4a87013c0a234dc89.png" target="_blank"><img src="http://img.e-com-net.com/image/info10/295cdec86c6e48b4a87013c0a234dc89.png" width="575" height="340" alt="慕课网HTML+CSS基础笔记一_第14张图片" style="border:1px solid black;"></a> </div> </div> <div class="image-caption"></div> </div><br> 注意这里用<q>标签的真正关键点不是它的默认样式<strong>双引号</strong>(如果这样我们不如自己在键盘上输入双引号就行了),而是它的<strong>语义:引用别人的话</strong>。</li> </ol> <h5>十三、<blockquote>标签,长文本引用</h5> <pre><code> <blockquote>的作用也是引用别人的文本。但它是对**长文本**的引用,如在文章中引入大段某知名作家的文字,这时需要这个标签。 等等,上一节<q>标签不是也是对文本的引用吗?不要忘记<q> </code></pre> <p>标签是对<strong>简短文本</strong>的引用,比如说引用一句话就用到<q><br> 标签。<br> 如想在我的文章中引用李白《关山月》中的诗句,因为引用文本比较长,所以使用<strong><</strong>blockquote><br> 。<br> <strong>语法:</strong><br> <strong><</strong>blockquote>引用文本</blockquote></p> <p>如下面例子:<br> <strong><blockquote></strong>明月出天山,苍茫云海间。长风几万里,吹度玉门关。汉下白登道,胡窥青海湾。由来征战地,不见有人还。 戍客望边色,思归多苦颜。高楼当此夜,叹息未应闲。<strong></blockquote></strong></p> <p>浏览器对<strong><</strong>blockquote>标签的解析是<strong>缩进样式。如下图所示:</strong><br> <strong></strong></p> <div class="image-package"> <div class="image-container" style="max-width: 552px; max-height: 264px;"> <div class="image-view"> <a href="http://img.e-com-net.com/image/info10/c3643821ca8c4dd3be59ab424ac5333b.jpg" target="_blank"><img src="http://img.e-com-net.com/image/info10/c3643821ca8c4dd3be59ab424ac5333b.jpg" width="552" height="264" alt="慕课网HTML+CSS基础笔记一_第15张图片" style="border:1px solid black;"></a> </div> </div> <strong> <div class="image-caption"></div></strong> </div> <p></p> <h5>十四、使用<br>标签分行显示文本</h5> <p>对于上一小节的例子,我们想让那首诗显示得更美观些,如显示下面效果:<br> </p> <div class="image-package"> <div class="image-container" style="max-width: 626px; max-height: 408px;"> <div class="image-view"> <a href="http://img.e-com-net.com/image/info10/5de1fdc260634e60b6651df05ea55cdd.jpg" target="_blank"><img src="http://img.e-com-net.com/image/info10/5de1fdc260634e60b6651df05ea55cdd.jpg" width="626" height="408" alt="慕课网HTML+CSS基础笔记一_第16张图片" style="border:1px solid black;"></a> </div> </div> <div class="image-caption"></div> </div> <br> 怎么可以让每一句诗词后面加入一个折行呢?那就可以用到<br /> <br> 标签了,在需要加回车换行的地方加入<br />,<br />标签作用相当于word文档中的回车。 <br> 上节的代码改为: <br> <div class="image-package"> <div class="image-container" style="max-width: 333px; max-height: 194px;"> <div class="image-view"> <a href="http://img.e-com-net.com/image/info10/7801e629b29c4800bd0cc34145540581.png" target="_blank"><img src="http://img.e-com-net.com/image/info10/7801e629b29c4800bd0cc34145540581.png" width="333" height="194" alt="慕课网HTML+CSS基础笔记一_第17张图片" style="border:1px solid black;"></a> </div> </div> <div class="image-caption"></div> </div> <br> <strong>语法:</strong> <br> <strong>xhtml1.0写法:</strong> <br> <br /> <p></p> <p><strong>html4.01写法:</strong><br> <br></p> <p>大家注意,现在一般使用 xhtml1.0 的版本的写法(其它标签也是),这种版本比较规范。<br> 与以前我们学过的标签不一样,<br /><br> 标签是一个空标签,没有HTML内容的标签就是空标签,空标签只需要写一个开始标签,这样的标签有<br /><br> 、<hr /><br> 和<img /><br> 。<br> 讲到这里,你是不是有个疑问,想折行还不好说嘛,就像在 word 文件档或记事本中,在想要折行的前面输入回车不就行了吗?很遗憾,在 html 中是忽略<strong>回车</strong>和<strong>空格</strong>的,你输入的再多回车和空格也是显示不出来的。如下边的代码。<br> </p> <div class="image-package"> <div class="image-container" style="max-width: 337px; max-height: 176px;"> <div class="image-view"> <a href="http://img.e-com-net.com/image/info10/b41efc94d52a42e8bc8d2cc6fc36e950.png" target="_blank"><img src="http://img.e-com-net.com/image/info10/b41efc94d52a42e8bc8d2cc6fc36e950.png" width="337" height="176" alt="慕课网HTML+CSS基础笔记一_第18张图片" style="border:1px solid black;"></a> </div> </div> <div class="image-caption"></div> </div> <br> 上面的代码在浏览中显示是没有回车效果的。如下图所示: <br> <div class="image-package"> <div class="image-container" style="max-width: 581px; max-height: 242px;"> <div class="image-view"> <a href="http://img.e-com-net.com/image/info10/73e7c300812f49f0a95faa287d22df74.jpg" target="_blank"><img src="http://img.e-com-net.com/image/info10/73e7c300812f49f0a95faa287d22df74.jpg" width="581" height="242" alt="慕课网HTML+CSS基础笔记一_第19张图片" style="border:1px solid black;"></a> </div> </div> <div class="image-caption"></div> </div> <br> <strong>总结:在 html 代码中输入回车、空格都是没有作用的。在html文本中想输入回车换行,就必须输入<br /><br> 。</strong> <p></p> <h5>十五、为你的网页中添加一些空格</h5> <p>在上一节的例子,我们已经讲解过在html代码中输入<strong>空格</strong>、<strong>回车</strong>都是没有作用的。要想输入空格,必须写入<br> 。<br> <strong>语法:</strong></p> <p>在html代码中输入空格是不起作用的,如下代码。<br> </p> <div class="image-package"> <div class="image-container" style="max-width: 700px; max-height: 258px;"> <div class="image-view"> <a href="http://img.e-com-net.com/image/info10/d951b1625e4848dcaa7efb5c15e0dc18.jpg" target="_blank"><img src="http://img.e-com-net.com/image/info10/d951b1625e4848dcaa7efb5c15e0dc18.jpg" width="650" height="180" alt="慕课网HTML+CSS基础笔记一_第20张图片" style="border:1px solid black;"></a> </div> </div> <div class="image-caption"></div> </div> <br> 在浏览中显示,还是没有空格效果。 <br> <div class="image-package"> <div class="image-container" style="max-width: 575px; max-height: 340px;"> <div class="image-view"> <a href="http://img.e-com-net.com/image/info10/1455f64f65c34d3a84164068f5a73c92.jpg" target="_blank"><img src="http://img.e-com-net.com/image/info10/1455f64f65c34d3a84164068f5a73c92.jpg" width="575" height="340" alt="慕课网HTML+CSS基础笔记一_第21张图片" style="border:1px solid black;"></a> </div> </div> <div class="image-caption"></div> </div> <br> <strong>输入空格的正确方法:</strong> <br> <div class="image-package"> <div class="image-container" style="max-width: 494px; max-height: 133px;"> <div class="image-view"> <a href="http://img.e-com-net.com/image/info10/55ec542ab14c4fdea0cd5f1d37404437.png" target="_blank"><img src="http://img.e-com-net.com/image/info10/55ec542ab14c4fdea0cd5f1d37404437.png" width="494" height="133" alt="慕课网HTML+CSS基础笔记一_第22张图片" style="border:1px solid black;"></a> </div> </div> <div class="image-caption"></div> </div> <br> 在浏览器中的显示出来的空格效果。如下图所示。 <br> <div class="image-package"> <div class="image-container" style="max-width: 459px; max-height: 266px;"> <div class="image-view"> <a href="http://img.e-com-net.com/image/info10/dae0c197a2dc4c9c9ed3eeb9bda227c9.jpg" target="_blank"><img src="http://img.e-com-net.com/image/info10/dae0c197a2dc4c9c9ed3eeb9bda227c9.jpg" width="459" height="266" alt="慕课网HTML+CSS基础笔记一_第23张图片" style="border:1px solid black;"></a> </div> </div> <div class="image-caption"></div> </div> <p></p> <h5>十六、认识 <hr>标签,添加水平横线</h5> <p>在信息展示时,有时会需要加一些用于分隔的横线,这样会使文章看起来整齐些。如下图所示:<br> </p> <div class="image-package"> <div class="image-container" style="max-width: 662px; max-height: 372px;"> <div class="image-view"> <a href="http://img.e-com-net.com/image/info10/224f2cd7e8dd4cbaa8d6873ca0f1ac74.jpg" target="_blank"><img src="http://img.e-com-net.com/image/info10/224f2cd7e8dd4cbaa8d6873ca0f1ac74.jpg" width="650" height="365" alt="慕课网HTML+CSS基础笔记一_第24张图片" style="border:1px solid black;"></a> </div> </div> <div class="image-caption"></div> </div> <br> <strong>语法:</strong> <br> html4.01版本** ** <hr> <p></p> <p>xhtml1.0版本 <hr /></p> <p><strong>注意:</strong></p> <ol> <li><hr /><br> 标签和<br /><br> 标签一样也是一个<strong>空标签</strong>,所以只有一个开始标签,没有结束标签。</li> <li><hr /><br> 标签的在浏览器中的默认样式线条比较粗,颜色为灰色,可能有些人觉得这种样式不美观,没有关系,这些外在样式在我们以后学习了css样式表之后,都可以对其修改。</li> <li>大家注意,现在一般使用 xhtml1.0 的版本(其它标签也是),这种版本比较规范。</li> </ol> <h5>十六、<address>标签,为网页加入地址信息</h5> <p>一般网页中会有一些网站的联系地址信息需要在网页中展示出来,这些联系地址信息如公司的地址就可以<address>标签。也可以定义一个地址(比如电子邮件地址)、签名或者文档的作者身份。<br> <strong>语法:</strong><br> <address>联系地址信息</address></p> <p>如:<br> <address>文档编写:lilian 北京市西城区德外大街10号</address></p> <p><address>本文的作者:<a href="mailto:lilian@imooc.com">lilian</a></address><br> 在浏览器上显示的样式为<strong>斜体</strong>,如果不喜欢斜体,当然可以,可以在后面的课程中使用 css 样式来修改它<address><br> 标签的默认样式。<br> </p> <div class="image-package"> <div class="image-container" style="max-width: 478px; max-height: 355px;"> <div class="image-view"> <a href="http://img.e-com-net.com/image/info10/c18064b00c0f4ff59aa0217b4c3d5f82.jpg" target="_blank"><img src="http://img.e-com-net.com/image/info10/c18064b00c0f4ff59aa0217b4c3d5f82.jpg" width="478" height="355" alt="慕课网HTML+CSS基础笔记一_第25张图片" style="border:1px solid black;"></a> </div> </div> <div class="image-caption"></div> </div> <p></p> <h5>十七、想加入一行代码吗?使用<code>标签</h5> <p>在介绍语言技术的网站中,避免不了在网页中显示一些计算机专业的编程代码,当代码为一行代码时,你就可以使用<code>标签了,如下面例子:<br> <code>var i=i+300;</code></p> <p>注意:在文章中一般如果要插入多行代码时不能使用<code>标签了。<br> <strong>语法:</strong><br> <code>代码语言</code></p> <p>注:如果是多行代码,可以使用<code><pre></code>标签。<br> 我们可能知道水平渐变的实现,类似这样:<br> <code>{background-image:linear-gradient(left, red 100px, yellow 200px);}</code></p> <h5>十八、使用<pre>标签为你的网页加入大段代码</h5> <p>在上节中介绍加入一行代码的标签为<code>,但是在大多数情况下是需要加入大段代码的,如下图:<br> </p> <div class="image-package"> <div class="image-container" style="max-width: 471px; max-height: 369px;"> <div class="image-view"> <a href="http://img.e-com-net.com/image/info10/ee19e6ba8b004ed287df11d1b38c76d0.jpg" target="_blank"><img src="http://img.e-com-net.com/image/info10/ee19e6ba8b004ed287df11d1b38c76d0.jpg" width="471" height="369" alt="慕课网HTML+CSS基础笔记一_第26张图片" style="border:1px solid black;"></a> </div> </div> <div class="image-caption"></div> </div> <br> 怎么办?不会是每一代码都加入一个<code>标签吧,没有这么复杂,这时候就可以使用<pre>标签。 <br> <strong>语法:</strong> <br> <pre>语言代码段</pre> <p></p> <p><pre> 标签的主要作用:预格式化的文本。被包围在 pre 元素中的文本通常会保留空格和换行符。<br> 如下代码:<br> <pre> var message="欢迎"; for(var i=1;i<=10;i++) { alert(message); }</pre><br> 在浏览器中的显示结果为:<br> </p> <div class="image-package"> <div class="image-container" style="max-width: 379px; max-height: 224px;"> <div class="image-view"> <a href="http://img.e-com-net.com/image/info10/4c73822c002444aa85cfa94931e8cc42.jpg" target="_blank"><img src="http://img.e-com-net.com/image/info10/4c73822c002444aa85cfa94931e8cc42.jpg" width="379" height="224" alt="慕课网HTML+CSS基础笔记一_第27张图片" style="border:1px solid black;"></a> </div> </div> <div class="image-caption"></div> </div> <br> 在上面的例子中可以看到代码中的空格,换行符都保留下来。如果用以前的方法,回车需要输入 <br> <br> 签,空格需要输入 <p></p> <p><strong>注意:</strong><pre><br> 标签不只是为显示计算机的源代码时用的,在你需要在网页中预显示格式时都可以使用它,只是<pre><br> 标签的一个常见应用就是用来展示计算机的源代码。</p> <h5>十九、使用ul,添加新闻信息列表</h5> <p>在浏览网页时,你会发现网页上有很多信息的列表,如新闻列表、图片列表,如下图所示。<br> </p> <div class="image-package"> <div class="image-container" style="max-width: 332px; max-height: 216px;"> <div class="image-view"> <a href="http://img.e-com-net.com/image/info10/acb08fff5f964423aa6d9553ede1076a.png" target="_blank"><img src="http://img.e-com-net.com/image/info10/acb08fff5f964423aa6d9553ede1076a.png" width="332" height="216" alt="慕课网HTML+CSS基础笔记一_第28张图片" style="border:1px solid black;"></a> </div> </div> <div class="image-caption"></div> </div> <br> 新闻列表 <br> <div class="image-package"> <div class="image-container" style="max-width: 326px; max-height: 138px;"> <div class="image-view"> <a href="http://img.e-com-net.com/image/info10/7ddc1590cc564d38b3d6aaf8d78d7a72.jpg" target="_blank"><img src="http://img.e-com-net.com/image/info10/7ddc1590cc564d38b3d6aaf8d78d7a72.jpg" width="326" height="138" alt="慕课网HTML+CSS基础笔记一_第29张图片" style="border:1px solid black;"></a> </div> </div> <div class="image-caption"></div> </div> <br> 图片列表 <br> 这些列表就可以使用ul-li标签来完成。ul-li是 <strong>没有前后顺序</strong>的信息列表。 <br> <strong>语法:</strong> <br> <ul> <li> 信息</li> <li> 信息</li> ......</ul> <br> <strong>举例:</strong> <br> <ul> <li> 精彩少年</li> <li> 美丽突然出现</li> <li> 触动心灵的旋律</li></ul> <br> ul-li在网页中显示的默认样式一般为:每项li前都自带一个圆点,如下图所示: <br> <div class="image-package"> <div class="image-container" style="max-width: 387px; max-height: 284px;"> <div class="image-view"> <a href="http://img.e-com-net.com/image/info10/5a924bb92ec44f6fa6af3aa2abe72ee9.jpg" target="_blank"><img src="http://img.e-com-net.com/image/info10/5a924bb92ec44f6fa6af3aa2abe72ee9.jpg" width="387" height="284" alt="慕课网HTML+CSS基础笔记一_第30张图片" style="border:1px solid black;"></a> </div> </div> <div class="image-caption"></div> </div> <p></p> <h5>二十、使用ol,添加图书销售排行榜</h5> <p>如果想在网页中展示<strong>有前后顺序</strong>的信息列表,怎么办呢?如,当当网上的书籍热卖排行榜,如下图所示。这类信息展示就可以使用<ol><br> 标签来制作<strong>有序列表</strong>来展示。<br> </p> <div class="image-package"> <div class="image-container" style="max-width: 227px; max-height: 264px;"> <div class="image-view"> <a href="http://img.e-com-net.com/image/info10/184260a1d1fb4190a004dfea5d8660f5.png" target="_blank"><img src="http://img.e-com-net.com/image/info10/184260a1d1fb4190a004dfea5d8660f5.png" width="227" height="264" alt="慕课网HTML+CSS基础笔记一_第31张图片" style="border:1px solid black;"></a> </div> </div> <div class="image-caption"></div> </div> <br> <strong>语法:</strong> <br> <ol> <li> 信息</li> <li> 信息</li> ......</ol> <br> <strong>举例:</strong> <br> 下面是一个热点课程下载排行榜: <br> <ol> <li>前端开发面试心法 </li> <li> 零基础学习html</li> <li>JavaScript全攻略</li></ol> <br> <ol> <br> 在网页中显示的默认样式一般为:每项<li> <br> 前都自带一个序号,序号默认从1 <br> 开始,如下图所示: <br> <div class="image-package"> <div class="image-container" style="max-width: 383px; max-height: 208px;"> <div class="image-view"> <a href="http://img.e-com-net.com/image/info10/e9a905ae944d40edbe81ea403e3a065c.jpg" target="_blank"><img src="http://img.e-com-net.com/image/info10/e9a905ae944d40edbe81ea403e3a065c.jpg" width="383" height="208" alt="慕课网HTML+CSS基础笔记一_第32张图片" style="border:1px solid black;"></a> </div> </div> <div class="image-caption"></div> </div> <p></p> <h5>二十一、认识div在排版中的作用</h5> <p>在网页制作过程过中,可以把一些独立的逻辑部分划分出来,放在一个<div><br> 标签中,这个<div>标签的作用就相当于一个容器。<br> <strong>语法:</strong><br> <div>…</div></p> <p><strong>确定逻辑部分:</strong><br> 什么是逻辑部分?它是页面上相互关联的一组元素。如网页中的独立的<strong>栏目版块</strong>,就是一个典型的逻辑部分。如下图所示:图中用红色边框标出的部分就是一个逻辑部分,就可以使用<div><br> 标签作为容器。<br> </p> <div class="image-package"> <div class="image-container" style="max-width: 700px; max-height: 455px;"> <div class="image-view"> <a href="http://img.e-com-net.com/image/info10/0a461daedca24c2d9264754a5e8e4b12.jpg" target="_blank"><img src="http://img.e-com-net.com/image/info10/0a461daedca24c2d9264754a5e8e4b12.jpg" width="650" height="292" alt="慕课网HTML+CSS基础笔记一_第33张图片" style="border:1px solid black;"></a> </div> </div> <div class="image-caption"></div> </div>、 <p></p> <h5>二十二、给div命名,使逻辑更加清晰</h5> <p>在上一小节中,我们把一些标签放进<div>里,划分出一个独立的逻辑部分。为了使逻辑更加清晰,我们可以为这一个独立的逻辑部分设置一个名称,用id<br> 属性来为<div><br> 提供唯一的名称,这个就像我们每个人都有一个身份证号,这个身份证号是唯一标识我们的身份的,也是必须唯一的。<br> 如下两图进行比较,如果设计师把两个图给你,哪个图你看上去能更快的理解呢?是不是右边的那幅图呢。<br> </p> <div class="image-package"> <div class="image-container" style="max-width: 480px; max-height: 357px;"> <div class="image-view"> <a href="http://img.e-com-net.com/image/info10/beca15c67f4a493d80e2037ceeb71372.jpg" target="_blank"><img src="http://img.e-com-net.com/image/info10/beca15c67f4a493d80e2037ceeb71372.jpg" width="480" height="357" alt="慕课网HTML+CSS基础笔记一_第34张图片" style="border:1px solid black;"></a> </div> </div> <div class="image-caption"></div> </div> <br> <strong>语法:</strong> <br> <div id="版块名称">…</div> <p></p> <h5>二十三、table标签,认识网页上的表格</h5> <p>有时候我们需要在网页上展示一些数据,如某公司想在网页上展示公司的库存清单。如下表:<br> </p> <div class="image-package"> <div class="image-container" style="max-width: 506px; max-height: 133px;"> <div class="image-view"> <a href="http://img.e-com-net.com/image/info10/f2ce1dd11b434d0da9f0eff4efe90e6a.png" target="_blank"><img src="http://img.e-com-net.com/image/info10/f2ce1dd11b434d0da9f0eff4efe90e6a.png" width="506" height="133" alt="慕课网HTML+CSS基础笔记一_第35张图片" style="border:1px solid black;"></a> </div> </div> <div class="image-caption"></div> </div> <br> 想在网页上展示上述表格效果可以使用以下代码: <br> <div class="image-package"> <div class="image-container" style="max-width: 292px; max-height: 445px;"> <div class="image-view"> <a href="http://img.e-com-net.com/image/info10/55b448eca4974b6e99c9b776b200343c.png" target="_blank"><img src="http://img.e-com-net.com/image/info10/55b448eca4974b6e99c9b776b200343c.png" width="292" height="445" alt="慕课网HTML+CSS基础笔记一_第36张图片" style="border:1px solid black;"></a> </div> </div> <div class="image-caption"></div> </div> <br> 创建表格的四个元素: <br> table、tbody、tr、th、td <br> 1、<table>…</table>:整个表格以<table> <br> 标记开始、</table> <br> 标记结束。 <br> 2、<tbody>…</tbody>:当表格内容非常多时,表格会下载一点显示一点,但如果加上<tbody>标签后,这个表格就要等表格内容全部下载完才会显示。如右侧代码编辑器中的代码。 <br> 3、<tr>…</tr>:表格的一行,所以有几对tr 表格就有几行。 <br> 4、<td>…</td>:表格的一个单元格,一行中包含几对<td>...</td> <br> ,说明一行中就有几列。 <br> 5、<th>…</th>:表格的头部的一个单元格, <strong>表格表头。</strong> <br> 6、表格中列的个数,取决于一行中数据单元格的个数。 <br> 上述代码在浏览器中显示的默认的样式为: <br> <div class="image-package"> <div class="image-container" style="max-width: 373px; max-height: 239px;"> <div class="image-view"> <a href="http://img.e-com-net.com/image/info10/1f933a80aef9460dbfc93fddc064da39.jpg" target="_blank"><img src="http://img.e-com-net.com/image/info10/1f933a80aef9460dbfc93fddc064da39.jpg" width="373" height="239" alt="慕课网HTML+CSS基础笔记一_第37张图片" style="border:1px solid black;"></a> </div> </div> <div class="image-caption"></div> </div> <br> 总结: <br> 1、table表格在没有添加css样式之前,在浏览器中显示是没有表格线的 <br> 2、表头,也就是th标签中的文本默认为 <strong>粗体</strong>并且 <strong>居中</strong>显示 <p></p> <h5>二十三、用css样式,为表格加入边框</h5> <p>Table 表格在没有添加 css 样式之前,是没有边框的。这样不便于我们后期<strong>合并单元格</strong>知识点的讲解,所以在这一节中我们为表格添加一些样式,为它添加边框。<br> 在右侧代码编辑器中添加如下代码:<br> <style type="text/css">table tr td,th{border:1px solid #000;}</style><br> 上述代码是用 css 样式代码(<strong>后面章节会详细讲解</strong>),为th<br> ,td<br> 单元格添加粗细为一个像素的黑色边框。<br> 结果窗口显示出结果样式:<br> </p> <div class="image-package"> <div class="image-container" style="max-width: 390px; max-height: 285px;"> <div class="image-view"> <a href="http://img.e-com-net.com/image/info10/316d1fab13de4d04a0102aa7c76861d7.jpg" target="_blank"><img src="http://img.e-com-net.com/image/info10/316d1fab13de4d04a0102aa7c76861d7.jpg" width="390" height="285" alt="慕课网HTML+CSS基础笔记一_第38张图片" style="border:1px solid black;"></a> </div> </div> <div class="image-caption"></div> </div> <p></p> <h5>二十四、caption标签,为表格添加标题和摘要</h5> <p>表格还是需要添加一些标签进行优化,可以添加<strong>标题</strong>和<strong>摘要</strong>。代码如下:<br> </p> <div class="image-package"> <div class="image-container" style="max-width: 694px; max-height: 398px;"> <div class="image-view"> <a href="http://img.e-com-net.com/image/info10/02bf450b5ff9449cb5a06a1aab4b4423.png" target="_blank"><img src="http://img.e-com-net.com/image/info10/02bf450b5ff9449cb5a06a1aab4b4423.png" width="694" height="398" alt="慕课网HTML+CSS基础笔记一_第39张图片" style="border:1px solid black;"></a> </div> </div> <div class="image-caption"></div> </div> <br> <strong>摘要</strong> <br> 摘要的内容是不会在浏览器中显示出来的。它的作用是增加表格的可读性(语义化),使搜索引擎更好的读懂表格内容,还可以使屏幕阅读器更好的帮助特殊用户读取表格内容。 <br> <strong>语法:</strong><table summary="表格简介文本"> <p></p> <p><strong>标题</strong><br> 用以描述表格内容,标题的显示位置:表格上方。<br> <strong>语法:</strong><br> <table> <strong><caption>****标题文本</caption></strong> <tr> <td>…</td> <td>…</td> … </tr>…</table></p> <h5>二十五、使用<a>标签,链接到另一个页面</h5> <p>使用<a><br> 标签可实现超链接,它在网页制作中可以说是无处不在,只要有链接的地方,就会有这个标签。<br> <strong>语法:</strong><br> <a href="目标网址" title="鼠标滑过显示的文本">链接显示的文本</a><br> <strong>例如:</strong><br> <a href="http://www.imooc.com" title="点击进入慕课网">click here!</a><br> 上面例子作用是单击<strong>click here!</strong><br> 文字,网页链接到<strong>http://www.imooc.com</strong><br> 这个网页。<br> title属性的作用,鼠标滑过链接文字时会显示这个属性的文本内容。这个属性在实际网页开发中作用很大,主要方便搜索引擎了解链接地址的内容(语义化更友好),如右侧案例代码(8-12行)。<br> <strong>注意:</strong>还有一个有趣的现象不知道小伙伴们发现了没有,只要为文本加入a标签后,文字的颜色就会自动变为蓝色(被点击过的文本颜色为紫色),颜色很难看吧,不过没有关系后面我们学习了css样子就可以设置过来(a{color:#000}),后面会详细讲解。</p> <h5>二十六、在新建浏览器窗口中打开链接</h5> <p><a><br> 标签在默认情况下,链接的网页是在当前浏览器窗口中打开,有时我们需要在新的浏览器窗口中打开。<br> 如下代码:<br> <a href="目标网址" <strong>target="_blank"</strong>>click here!</a></p> <h5>二十七、使用mailto在网页中链接Email地址</h5> <p><a><br> 标签还有一个作用是可以链接Email地址,使用mailto能让访问者便捷向网站管理者发送电子邮件。我们还可以利用mailto<br> 做许多其它事情。下面一一进行讲解,请看详细图示:<br> </p> <div class="image-package"> <div class="image-container" style="max-width: 700px; max-height: 550px;"> <div class="image-view"> <a href="http://img.e-com-net.com/image/info10/a72cc5ca9f284f66b7893eaa887f8b6a.png" target="_blank"><img src="http://img.e-com-net.com/image/info10/a72cc5ca9f284f66b7893eaa887f8b6a.png" width="1428" height="550" alt="慕课网HTML+CSS基础笔记一_第40张图片" style="border:1px solid black;"></a> </div> </div> <div class="image-caption"></div> </div> <br> <strong>注意</strong>:如果mailto后面同时有多个参数的话,第一个参数必须以“? <br> ”开头,后面的参数每一个都以“& <br> ”分隔。 <br> 下面是一个完整的实例: <br> <div class="image-package"> <div class="image-container" style="max-width: 700px; max-height: 61px;"> <div class="image-view"> <a href="http://img.e-com-net.com/image/info10/370ec327736747d892965e9696a9bf48.png" target="_blank"><img src="http://img.e-com-net.com/image/info10/370ec327736747d892965e9696a9bf48.png" width="793" height="61"></a> </div> </div> <div class="image-caption"></div> </div> <br> 在浏览器中显示的结果: <br> 发送 <br> 点击链接会打开电子邮件应用,并自动填写收件人等设置好的信息,如下图: <br> <div class="image-package"> <div class="image-container" style="max-width: 685px; max-height: 470px;"> <div class="image-view"> <a href="http://img.e-com-net.com/image/info10/1ae8a56f258e468585b9f95a23764f79.jpg" target="_blank"><img src="http://img.e-com-net.com/image/info10/1ae8a56f258e468585b9f95a23764f79.jpg" width="650" height="446" alt="慕课网HTML+CSS基础笔记一_第41张图片" style="border:1px solid black;"></a> </div> </div> <div class="image-caption"></div> </div> <p></p> <h5>二十八、认识<img>标签,为网页插入图片</h5> <p>在网页的制作中为使网页炫丽美观,肯定是缺少不了图片,可以使用<img><br> 标签来插入图片。<br> <strong>语法:</strong><br> </p> <div class="image-package"> <div class="image-caption"></div> </div> <p></p> <p><strong>举例:</strong><br> <img src = "myimage.gif" alt = "My Image" title = "My Image" /></p> <p><strong>讲解:</strong><br> <strong>1****、src:</strong>标识图像的位置;<br> <strong>2****、alt:</strong>指定图像的描述性文本,当图像不可见时(下载不成功时),可看到该属性指定的文本;<br> <strong>3****、title:</strong>提供在图像可见时对图像的描述(鼠标滑过图片时显示的文本);<br> <strong>4、</strong>图像可以是GIF,PNG,JPEG格式的图像文件。</p> <h5>二十九、使用表单标签,与用户交互</h5> <p>网站怎样与用户进行交互?答案是使用HTML表单(form)。表单是可以把浏览者输入的数据传送到服务器端,这样服务器端程序就可以处理表单传过来的数据。<br> 语法:<br> <form method="传送方式" action="服务器文件"><br> <strong>讲解:</strong><br> 1.<strong><form> :</strong><form>标签是成对出现的,以<form>开始,以</form>结束。<br> 2.<strong>action</strong> <strong>:</strong>浏览者输入的数据被传送到的地方,比如一个PHP页面(save.php)。<br> 3.<strong>method</strong> <strong>:</strong> 数据传送的方式(get/post)。<br> <form <strong>method="post" action="save.php"</strong>> <label for="username">用户名:</label> <input type="text" name="username" /> <label for="pass">密码:</label> <input type="password" name="pass" /></form><br> <strong>注意:</strong><br> <strong>1、所有表单控件(文本框、文本域、按钮、单选框、复选框等)都必须放在 <form></form> 标签之间(否则用户输入的信息可提交不到服务器上哦!)。</strong><br> <strong>2、method : post/get 的区别这一部分内容属于后端程序员考虑的问题。感兴趣的小伙伴可以查看本小节的 wiki,里面有详细介绍。</strong></p> <h5>三十、</h5> </article> </div> </div> </div> <!--PC和WAP自适应版--> <div id="SOHUCS" sid="1186581403249254400"></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+CSS基础笔记一)</h4> <div id="paradigm-article-related"> <div class="recommend-post mb30"> <ul class="widget-links"> <li><a href="/article/1902654122935513088.htm" title="List 和 Set 的区别" target="_blank">List 和 Set 的区别</a> <span class="text-muted">不会搬砖的淡水鱼</span> <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/list/1.htm">list</a><a class="tag" taget="_blank" href="/search/windows/1.htm">windows</a><a class="tag" taget="_blank" href="/search/%E6%95%B0%E6%8D%AE%E7%BB%93%E6%9E%84/1.htm">数据结构</a> <div>List和Set的区别在Java中,List和Set都是Collection接口的子接口,但它们的存储结构、特点、使用场景不同。对比项List(有序、可重复)Set(无序、不可重复)是否允许重复元素✅允许❌不允许是否有序✅按插入顺序排序❌无序(TreeSet除外)是否可以有null✅允许多个null✅只允许一个null底层数据结构数组、链表哈希表、红黑树访问方式通过索引访问通过iterator遍历</div> </li> <li><a href="/article/1902653870694264832.htm" title="RSA加密算法" target="_blank">RSA加密算法</a> <span class="text-muted">不会搬砖的淡水鱼</span> <a class="tag" taget="_blank" href="/search/%E7%BD%91%E7%BB%9C/1.htm">网络</a><a class="tag" taget="_blank" href="/search/%E6%9C%8D%E5%8A%A1%E5%99%A8/1.htm">服务器</a><a class="tag" taget="_blank" href="/search/%E5%AE%89%E5%85%A8/1.htm">安全</a> <div>RSA加密算法:数学魔术背后的安全守护者RSA加密算法(Rivest-Shamir-Adleman)是一种广泛使用的公钥加密算法,它在信息安全领域具有重要作用。RSA是由罗纳德·李维斯特(RonRivest)、阿迪·萨莫尔(AdiShamir)和伦纳德·阿德曼(LeonardAdleman)在1977年一起提出的。当时他们三人都在麻省理工学院工作。RSA就是他们三人姓氏开头字母拼在一起组成的。RS</div> </li> <li><a href="/article/1902653743145480192.htm" title="基础算法--背包问题" target="_blank">基础算法--背包问题</a> <span class="text-muted">不会搬砖的淡水鱼</span> <a class="tag" taget="_blank" href="/search/%E5%9F%BA%E7%A1%80%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/%E5%8A%A8%E6%80%81%E8%A7%84%E5%88%92/1.htm">动态规划</a><a class="tag" taget="_blank" href="/search/%E8%B4%AA%E5%BF%83%E7%AE%97%E6%B3%95/1.htm">贪心算法</a> <div>背包问题概念完全背包(无限背包)0-1背包概念背包问题是一个经典的组合优化问题,其目标是在给定的一组物品中选择一些物品放入背包中,使得物品的总价值最大化,同时要求背包的总重量不超过背包的容量限制。背包问题有两种常见的变体:完全背包和0-1背包。鉴于完全背包计算过程相对0-1背包简单,这里先讲完全背包。完全背包(无限背包)在完全背包问题中,每个物品可以选择放入背包中的次数是无限的,即可以重复选择。每</div> </li> <li><a href="/article/1902653744336662528.htm" title="基础算法--欧拉函数" target="_blank">基础算法--欧拉函数</a> <span class="text-muted">不会搬砖的淡水鱼</span> <a class="tag" taget="_blank" href="/search/%E5%9F%BA%E7%A1%80%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%95%B0%E6%8D%AE%E7%BB%93%E6%9E%84/1.htm">数据结构</a> <div>欧拉函数(Euler’stotientfunction),也称为费马函数,是一个与正整数相关的数论函数,用符号φ(n)表示。欧拉函数φ(n)定义为小于或等于n的正整数中与n互质的数的个数。RSA加密算法(Rivest-Shamir-Adleman)就是通过欧拉函数进行公钥加密。具体而言,对于给定的正整数n,欧拉函数φ(n)计算满足以下条件的k的个数:1≤k≤n,且k与n互质(即k和n的最大公约数为</div> </li> <li><a href="/article/1902653616892735488.htm" title="python练习3:输入某年某月某日,判断这一天是这一年的第几天?" target="_blank">python练习3:输入某年某月某日,判断这一天是这一年的第几天?</a> <span class="text-muted">柯.姐姐</span> <a class="tag" taget="_blank" href="/search/python/1.htm">python</a> <div>#输入某年某月某日,判断这一天是这一年的第几天?list=[0,31,59,90,120,151,181,212,243,273,304,334]year=int(input('请输入年份:'))month=int(input('请输入月份:'))day=int(input('请输入天:'))ifmonth>0andmonth2:result=result+1print("这是第%d天"%resu</div> </li> <li><a href="/article/1902653364714401792.htm" title="数据操作与事务:确保数据一致性的关键" target="_blank">数据操作与事务:确保数据一致性的关键</a> <span class="text-muted">qcidyu</span> <a class="tag" taget="_blank" href="/search/%E8%BD%AF%E4%BB%B6%E5%BC%80%E5%8F%91/1.htm">软件开发</a><a class="tag" taget="_blank" href="/search/%E6%95%B0%E6%8D%AE%E5%BA%93%E8%A7%84%E5%88%99/1.htm">数据库规则</a> <div>title:数据操作与事务:确保数据一致性的关键date:2025/2/11updated:2025/2/11author:cmdragonexcerpt:在现代数据管理中,事务处理是确保数据完整性和一致性的重要机制。本文将深入探讨事务的ACID特性、锁机制及其种类(行级锁与表级锁)以及事务隔离级别(READUNCOMMITTED、READCOMMITTED、REPEATABLEREAD、SERI</div> </li> <li><a href="/article/1902653238423908352.htm" title="Java WebSocket与项目页面(通常是HTML + JavaScript)之间建立连接并传输数据" target="_blank">Java WebSocket与项目页面(通常是HTML + JavaScript)之间建立连接并传输数据</a> <span class="text-muted">hh_fine</span> <a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/websocket/1.htm">websocket</a><a class="tag" taget="_blank" href="/search/html/1.htm">html</a> <div>JavaWebSocket与项目页面(通常是HTML+JavaScript)之间建立连接并传输数据1.创建JavaWebSocket服务器:使用JavaWebSocketAPI创建一个WebSocket服务器端点。2.在HTML页面中使用JavaScript连接WebSocket:通过JavaScript的WebSocketAPI与JavaWebSocket服务器建立连接。3.双向数据传输:实现服</div> </li> <li><a href="/article/1902652985838727168.htm" title="SGM61230 同步降压转换器技术文档" target="_blank">SGM61230 同步降压转换器技术文档</a> <span class="text-muted">慎独yfs</span> <a class="tag" taget="_blank" href="/search/%E7%94%B5%E5%AD%90%E5%85%83%E5%99%A8%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/%E5%B5%8C%E5%85%A5%E5%BC%8F%E7%A1%AC%E4%BB%B6/1.htm">嵌入式硬件</a> <div>第一章概述SGM61230是一款宽输入电压范围(4.5V至28V)的同步降压转换器,可提供高达3A的输出电流。该器件集成功率开关和峰值电流模式控制补偿电路,采用6引脚TSOT-23封装,内置5ms软启动功能以抑制浪涌电流。关键特性:-**智能保护机制**:逐周期峰值电流限制、输出过压保护(OVP)、带自动恢复的热关断-**高效模式切换**:轻载时进入脉冲跳过模式(PSM),重载时自动切换至PWM模</div> </li> <li><a href="/article/1902652859506290688.htm" title="深入解析 MySQL 数据库:隔离级别的选择" target="_blank">深入解析 MySQL 数据库:隔离级别的选择</a> <span class="text-muted">幽兰的天空</span> <a class="tag" taget="_blank" href="/search/MYSQL%E6%95%B0%E6%8D%AE%E5%BA%93/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><a class="tag" taget="_blank" href="/search/oracle/1.htm">oracle</a> <div>在数据库中,创建事务一般包含几个简单的步骤。以下是如何在MySQL中创建事务的基本指南,包括相关的SQL语句和操作流程:1.启动事务在MySQL中,你可以使用STARTTRANSACTION或BEGIN语句来启动一个新的事务。这表示你将开始执行一系列操作,这些操作要么全部成功(提交),要么全部失败(回滚)。STARTTRANSACTION;--或者使用BEGIN;2.执行操作在事务被启动后,你可以</div> </li> <li><a href="/article/1902651725907554304.htm" title="C++11智能指针" target="_blank">C++11智能指针</a> <span class="text-muted">Peter_chq</span> <a class="tag" taget="_blank" href="/search/c%2B%2B/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> <div>一、指针管理的困境资源释放了,但指针没有置空(野指针、指针悬挂、踩内存)没有释放资源,产生内存泄漏问题;重复释放资源,引发coredump二、智能指针</div> </li> <li><a href="/article/1902651348034318336.htm" title="【C语言】交换函数" target="_blank">【C语言】交换函数</a> <span class="text-muted">Peter_chq</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/%E5%BC%80%E5%8F%91%E8%AF%AD%E8%A8%80/1.htm">开发语言</a><a class="tag" taget="_blank" href="/search/%E7%AE%97%E6%B3%95/1.htm">算法</a> <div>一、利用第三个变量交换1.错误的交换函数及原因voidswap1(intx,inty){intz=0;z=x;x=y;y=z;}inta=10;intb=20;printf("交换前:a=%d,b=%d\n",a,b);swap1(a,b);printf("swap1交换后:a=%d,b=%d\n",a,b);原因:传值调用函数,不可以改变实参的值。形参是实参的一份临时调用。调用swap1(a,b</div> </li> <li><a href="/article/1902651221613801472.htm" title="Ts学习笔记" target="_blank">Ts学习笔记</a> <span class="text-muted">初学者7.</span> <a class="tag" taget="_blank" href="/search/%E5%AD%A6%E4%B9%A0/1.htm">学习</a><a class="tag" taget="_blank" href="/search/%E7%AC%94%E8%AE%B0/1.htm">笔记</a><a class="tag" taget="_blank" href="/search/typescript/1.htm">typescript</a> <div>一、Ts与Js区别TsJsJavaScript的超集,用于解决大型项目的代码复杂性一种脚本语言,用于创建动态网页。强类型,支持静态和动态类型动态弱类型语言可以在编译期间发现并纠正错误只能在运行时发现错误不允许改变变量的数据类型变量可以被赋予不同类型的值二、Ts基础类型:boolean,number,string,undefined,null,any,unknown,void,neverany,un</div> </li> <li><a href="/article/1902650969435467776.htm" title="Lodash源码分析-every,some,size,includes" target="_blank">Lodash源码分析-every,some,size,includes</a> <span class="text-muted">初学者7.</span> <a class="tag" taget="_blank" href="/search/Loadsh%E6%BA%90%E7%A0%81%E5%88%86%E6%9E%90/1.htm">Loadsh源码分析</a><a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a> <div>collection相关的函数,collection指的是一组用于处理集合(如数组或对象)的工具函数。lodash源码研读之every,some,size,includes一、源码地址GitHub地址:GitHub-lodash/lodash:AmodernJavaScriptutilitylibrarydeliveringmodularity,performance,&extras.官方文档地址</div> </li> <li><a href="/article/1902650717357797376.htm" title="Lodash源码分析-uniq,uniqBy,uniqWith" target="_blank">Lodash源码分析-uniq,uniqBy,uniqWith</a> <span class="text-muted">初学者7.</span> <a class="tag" taget="_blank" href="/search/Loadsh%E6%BA%90%E7%A0%81%E5%88%86%E6%9E%90/1.htm">Loadsh源码分析</a><a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a> <div>lodash源码研读之uniq,uniqBy,uniqWith一、源码地址GitHub地址:GitHub-lodash/lodash:AmodernJavaScriptutilitylibrarydeliveringmodularity,performance,&extras.官方文档地址:Lodash官方文档二、结构分析uniq,uniqBy,uniqWith基于baseUniq模块。三、函数介</div> </li> <li><a href="/article/1902650591079886848.htm" title="H5语音识别功能(Web Speech API+科大讯飞)" target="_blank">H5语音识别功能(Web Speech API+科大讯飞)</a> <span class="text-muted">辣辣1</span> <a class="tag" taget="_blank" href="/search/%E8%AF%AD%E9%9F%B3%E8%AF%86%E5%88%AB/1.htm">语音识别</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a> <div>H5语音识别效果图:方案一:WebSpeechAPI(免费,IE浏览器可用,谷歌浏览器不可用)方案一:WebSpeechAPI开始停止识别结果:{{finalTranscript}}{{interimTranscript}}import{ref,onMounted,onBeforeUnmount}from"vue";constisSupported=ref(false);constisRecord</div> </li> <li><a href="/article/1902650464785199104.htm" title="CUDA编程基础" target="_blank">CUDA编程基础</a> <span class="text-muted">清 澜</span> <a class="tag" taget="_blank" href="/search/%E7%AE%97%E6%B3%95%E9%9D%A2%E8%AF%95/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/c%2B%2B/1.htm">c++</a><a class="tag" taget="_blank" href="/search/%E7%AE%97%E6%B3%95/1.htm">算法</a><a class="tag" taget="_blank" href="/search/nvidia/1.htm">nvidia</a><a class="tag" taget="_blank" href="/search/cuda%E7%BC%96%E7%A8%8B/1.htm">cuda编程</a> <div>一、快速理解CUDA编程1.1CUDA简介CUDA(ComputeUnifiedDeviceArchitecture)是由NVIDIA推出的并行计算平台和应用程序接口模型。它允许开发者利用NVIDIAGPU的强大计算能力来加速通用计算任务,而不仅仅是图形渲染。通过CUDA,开发者可以编写C、C++或Fortran代码,并将其扩展以在GPU上运行,从而显著提高性能,特别是在处理大规模数据集和复杂算法</div> </li> <li><a href="/article/1902649582874062848.htm" title="《Flutter从入门到实战:手把手构建跨平台应用(万字深度解析)》" target="_blank">《Flutter从入门到实战:手把手构建跨平台应用(万字深度解析)》</a> <span class="text-muted">前端极客探险家</span> <a class="tag" taget="_blank" href="/search/flutter/1.htm">flutter</a> <div>目录标题前言:为什么选择Flutter?一、Flutter基础篇:环境搭建与核心概念1.1开发环境配置1.2项目结构深度解析二、核心机制:Widget与渲染原理2.1Widget树构建原理2.2状态管理方案对比三、企业级开发实战3.1工程化架构设计3.2典型功能实现四、进阶开发技巧4.1性能优化方案4.2平台特定代码集成五、项目实战:开发企业级Todo应用(深度扩展版)5.1项目初始化与工程化配置</div> </li> <li><a href="/article/1902649330712506368.htm" title="Django系列教程(13)——Cookie和Session应用场景及案例" target="_blank">Django系列教程(13)——Cookie和Session应用场景及案例</a> <span class="text-muted">l软件定制开发工作室</span> <a class="tag" taget="_blank" href="/search/Django%E6%95%99%E7%A8%8B/1.htm">Django教程</a><a class="tag" taget="_blank" href="/search/django/1.htm">django</a> <div>目录什么是cookie,cookie的应用场景及缺点Django中如何使用cookieCookie使用示例什么是session及session的工作原理Django中如何使用会话sessionSession使用示例小结HTTP协议本身是”无状态”的,在一次请求和下一次请求之间没有任何状态保持,服务器无法识别来自同一用户的连续请求。有了cookie和session,服务器就可以利用它们记录客户端的访</div> </li> <li><a href="/article/1902649330234355712.htm" title="AI编程的心得体会" target="_blank">AI编程的心得体会</a> <span class="text-muted">猜测7</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/chatgpt/1.htm">chatgpt</a> <div>最近使用了三款AI软件进行编程,真的是一款比一款好用,很大程度提高了写代码的效率,真的非常方便。首先是豆包的插件Marscode,我知道它B站首页曾经见到一个推荐,标题大意是不写一行代码开发出一个打砖块的游戏。我对着视频试了一遍,在VSCode中可以直接搜索安装Marscode,用的phython写的小游戏,结果发现其实最核心的架构玩法其实都在它clonegithub那步,就是把已经能运行的游戏拿</div> </li> <li><a href="/article/1902648574685016064.htm" title="初学python100例-案例4 计算一年第几天 多种不同解法 少儿编程案例讲解" target="_blank">初学python100例-案例4 计算一年第几天 多种不同解法 少儿编程案例讲解</a> <span class="text-muted">小兔子编程</span> <a class="tag" taget="_blank" href="/search/%E5%88%9D%E5%AD%A6python100%E4%BE%8B/1.htm">初学python100例</a><a class="tag" taget="_blank" href="/search/python%E5%AD%A6%E4%B9%A0/1.htm">python学习</a><a class="tag" taget="_blank" href="/search/python100%E4%BE%8B/1.htm">python100例</a><a class="tag" taget="_blank" href="/search/python%E8%AE%A1%E7%AE%97%E5%A4%A9%E6%95%B0/1.htm">python计算天数</a><a class="tag" taget="_blank" href="/search/python%E7%AE%97%E6%B3%95/1.htm">python算法</a><a class="tag" taget="_blank" href="/search/python%E6%A1%88%E4%BE%8B/1.htm">python案例</a> <div>题目输入某年某月某日,判断这一天是这一年的第几天?解法1程序分析1、以5月2日为例,应该先把前四个月的加起来,2、然后再加上2天即本年的第几天,3、特殊情况,闰年且输入月份大于2时需考虑多加一天:4、闰年1、年份能被4整除;2、年份若是100的整数倍的话需被400整除,否则是平年。程序源代码:year=int(input('year:\n'))month=int(input('month:\n')</div> </li> <li><a href="/article/1902648321994977280.htm" title="推荐一个开源的高效头像生成工具,支持API调用" target="_blank">推荐一个开源的高效头像生成工具,支持API调用</a> <span class="text-muted">计算机小手</span> <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/%E5%BC%80%E6%BA%90%E8%BD%AF%E4%BB%B6/1.htm">开源软件</a> <div>一、简介集成多种头像生成方案,包括:ugly-avatar、multiavatar、jdenticon、facesjs、dicebear等支持docker部署,支持API调用项目开源地址:GitHub-luler/hello_avatar:轻松搭建生成简易头像的api服务二、安装准备好docker、docker-compose环境新建docker-compose.yml,配置内容如下:versio</div> </li> <li><a href="/article/1902648322510876672.htm" title="SAP-ABAP:SAP工厂(Plant)与公司代码(Company Code)关联查询指南" target="_blank">SAP-ABAP:SAP工厂(Plant)与公司代码(Company Code)关联查询指南</a> <span class="text-muted">爱喝水的鱼丶</span> <a class="tag" taget="_blank" href="/search/SAP/1.htm">SAP</a><a class="tag" taget="_blank" href="/search/ABAP/1.htm">ABAP</a><a class="tag" taget="_blank" href="/search/ERP/1.htm">ERP</a><a class="tag" taget="_blank" href="/search/%E5%BC%80%E5%8F%91%E8%BF%90%E7%BB%B4/1.htm">开发运维</a><a class="tag" taget="_blank" href="/search/%E8%BF%90%E7%BB%B4/1.htm">运维</a> <div>SAP工厂(Plant)与公司代码(CompanyCode)关联查询指南一、核心查询方法对比方法类型事务码/表名响应速度适用场景权限要求配置界面查询OX18快单工厂详细信息查看S_TCODE(OX18)数据表直查T001W/T001K极快批量导出或多系统对接S_TABU_DIS(T001W/T001K)组织结构浏览PPOME中企业架构全景分析S_TCODE(PPOME)二、详细操作指南方法1:配置</div> </li> <li><a href="/article/1902648069812449280.htm" title="Python 的类中,self 是一个特殊的参数" target="_blank">Python 的类中,self 是一个特殊的参数</a> <span class="text-muted">可可乐不加冰</span> <a class="tag" taget="_blank" href="/search/%E7%9F%A5%E8%AF%86%E5%AD%A6%E4%B9%A0%E4%B8%93%E6%A0%8F/1.htm">知识学习专栏</a><a class="tag" taget="_blank" href="/search/python/1.htm">python</a><a class="tag" taget="_blank" href="/search/%E5%BC%80%E5%8F%91%E8%AF%AD%E8%A8%80/1.htm">开发语言</a> <div>在Python的类中,self是一个特殊的参数,它代表类的实例本身。self是方法的第一个参数,用于访问实例的属性和方法。下面我将从多个角度解释self的含义、作用以及如何使用它。1.self表示类的实例本身在Python中,当你创建一个类的实例时,实际上是在内存中创建了一个对象。self参数代表的就是这个对象本身。通过self,你可以在类的方法中访问和修改实例的属性。2.为什么需要self?se</div> </li> <li><a href="/article/1902647313696878592.htm" title="Python入门程序练习004:输入某年某月某日,判断这一天是这一年的第几天?" target="_blank">Python入门程序练习004:输入某年某月某日,判断这一天是这一年的第几天?</a> <span class="text-muted">若北辰</span> <a class="tag" taget="_blank" href="/search/Python%E5%AE%9E%E6%88%98%E7%BB%83%E4%B9%A0/1.htm">Python实战练习</a> <div>【程序4】题目:输入某年某月某日,判断这一天是这一年的第几天?1.程序分析:其实这一题的难度不在于编程,而在于对闰年有没有一些基本的认识,相信很多人都知道闰年,但是又不太清楚具体怎么判断闰年。在下面两个条件中只要满足一个即是闰年:1、能被4整除但是不能被一百整除2、能被四百整除。为了方便记忆,总结为:四年一闰,百年不闰,四百年再闰那么判断出闰年和平年(除了闰年其他都是平年)之后呢,其实只要记住:闰</div> </li> <li><a href="/article/1902646431789936640.htm" title="前端开发:Webpack的使用总结" target="_blank">前端开发:Webpack的使用总结</a> <span class="text-muted">三掌柜666</span> <a class="tag" taget="_blank" href="/search/web%E5%89%8D%E7%AB%AF%E7%9F%A5%E8%AF%86%E6%B1%87%E6%80%BB/1.htm">web前端知识汇总</a><a class="tag" taget="_blank" href="/search/webpack/1.htm">webpack</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a> <div>前言在前端开发过程中,尤其是现在前端框架的频繁使用的当下,作为前端开发者想必对于Webpack并不陌生,尤其是在使用Vue框架做前端开发的时候,打包时候必用Webpack。还有就是在前端求职面试的时候,Webpack相关的知识点也是面试官必定考察的,那么本篇博文就来分享一下关于Webpack使用相关的知识点,记录下来,方便后期查阅使用。Webpack概念Webpack其实是一个前端资源加载/打包工</div> </li> <li><a href="/article/1902646305474277376.htm" title="Python后端学习系列(10):分布式系统与数据一致性(使用分布式锁、分布式事务等)" target="_blank">Python后端学习系列(10):分布式系统与数据一致性(使用分布式锁、分布式事务等)</a> <span class="text-muted">DoYangTan</span> <a class="tag" taget="_blank" href="/search/python/1.htm">python</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%88%86%E5%B8%83%E5%BC%8F/1.htm">分布式</a> <div>Python后端学习系列(10):分布式系统与数据一致性(使用分布式锁、分布式事务等)前言随着业务规模的不断扩大以及对系统性能、可扩展性的更高要求,后端应用往往会朝着分布式系统的方向发展。然而,分布式系统带来诸多优势的同时,也面临着如数据一致性等复杂的挑战。本期我们就聚焦于分布式系统中的关键问题——数据一致性,深入探讨分布式锁、分布式事务等相关知识以及保障数据一致性的策略与实践,让我们一起深入学习</div> </li> <li><a href="/article/1902646179129257984.htm" title="如何使用C# 读写西门子PLC" target="_blank">如何使用C# 读写西门子PLC</a> <span class="text-muted">A_nanda</span> <a class="tag" taget="_blank" href="/search/%E8%A5%BF%E9%97%A8%E5%AD%90/1.htm">西门子</a> <div>在C#WPF应用程序中,与西门子S7系列PLC进行通信是一个常见的需求,尤其是在工业自动化领域。以下是三种实现WPF上位机与西门子S7系列PLC通信同步的方式,每种方式都提供了代码实例、优缺点和使用场景。1.使用S7.Net库代码示例://创建PLC连接varplc=newS7.Net.Plc(CpuType.S71500,"192.168.1.10",0,1);plc.Open();//读取PL</div> </li> <li><a href="/article/1902645926619574272.htm" title="《壹起航:15 年助力中国工厂海外获客,开启全球化新篇》" target="_blank">《壹起航:15 年助力中国工厂海外获客,开启全球化新篇》</a> <span class="text-muted">yiqijianzhan</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/%E5%A4%A7%E6%95%B0%E6%8D%AE/1.htm">大数据</a> <div>在全球化的汹涌浪潮中,无数中国工厂渴望在海外市场一展宏图。然而,一系列棘手的问题摆在他们面前:怎样成功塑造品牌形象?怎样稳定获取询盘?怎样合理控制营销成本?壹起航,凭借15年深厚的行业积累,整合外贸建站、搜索引擎优化(SEO)以及海外短视频营销等多元服务,为中国工厂开辟出一条轻松拓展海外市场、赢得更多精准订单的便捷之路。一、外贸独立站——企业出海的关键起点在海外市场这片广阔天地里,企业官网不仅是展</div> </li> <li><a href="/article/1902645422657171456.htm" title="大小仅54K,可是效果很棒" target="_blank">大小仅54K,可是效果很棒</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/%E7%94%B5%E8%84%91/1.htm">电脑</a><a class="tag" taget="_blank" href="/search/%E6%99%BA%E8%83%BD%E6%89%8B%E6%9C%BA/1.htm">智能手机</a> <div>大家在使用公众号编辑器时,都遇到过图片数量限制的问题。一旦达到50张或100张,编辑器就满了,只能手动删除。每次删这么多张图片,手都点麻了。为了提高效率,我之前一直用寒星鼠标连点器,它确实挺好用的。今天,我要给大家介绍一款更强大的鼠标连点器,功能比寒星更出色,有需要的小伙伴一定要及时收藏!软件介绍今天给大家介绍的这款软件叫**鼠标录制器**,它的体积非常小巧,只有54K,是一款绿色单文件版的鼠标连</div> </li> <li><a href="/article/1902644793004060672.htm" title="Spring使用@Async出现循环依赖原因以及解决方案" target="_blank">Spring使用@Async出现循环依赖原因以及解决方案</a> <span class="text-muted">2401_89793006</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/python/1.htm">python</a><a class="tag" taget="_blank" href="/search/java/1.htm">java</a> <div>场景复现1、首先项目需要打开spring的异步开关,在application主类上加@EnableAsync2、创建一个包含了@Async方法的异步类MessageService:@ServicepublicclassMessageService{@ResourceprivateTaskServicetaskService;@Asyncpublicvoidsend(){taskService.sh</div> </li> <li><a href="/article/20.htm" title="矩阵求逆(JAVA)初等行变换" target="_blank">矩阵求逆(JAVA)初等行变换</a> <span class="text-muted">qiuwanchi</span> <a class="tag" taget="_blank" href="/search/%E7%9F%A9%E9%98%B5%E6%B1%82%E9%80%86%EF%BC%88JAVA%EF%BC%89/1.htm">矩阵求逆(JAVA)</a> <div>package gaodai.matrix; import gaodai.determinant.DeterminantCalculation; import java.util.ArrayList; import java.util.List; import java.util.Scanner; /** * 矩阵求逆(初等行变换) * @author 邱万迟 *</div> </li> <li><a href="/article/147.htm" title="JDK timer" target="_blank">JDK timer</a> <span class="text-muted">antlove</span> <a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/jdk/1.htm">jdk</a><a class="tag" taget="_blank" href="/search/schedule/1.htm">schedule</a><a class="tag" taget="_blank" href="/search/code/1.htm">code</a><a class="tag" taget="_blank" href="/search/timer/1.htm">timer</a> <div>1.java.util.Timer.schedule(TimerTask task, long delay):多长时间(毫秒)后执行任务 2.java.util.Timer.schedule(TimerTask task, Date time):设定某个时间执行任务 3.java.util.Timer.schedule(TimerTask task, long delay,longperiod</div> </li> <li><a href="/article/274.htm" title="JVM调优总结 -Xms -Xmx -Xmn -Xss" target="_blank">JVM调优总结 -Xms -Xmx -Xmn -Xss</a> <span class="text-muted">coder_xpf</span> <a class="tag" taget="_blank" href="/search/jvm/1.htm">jvm</a><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> <div>堆大小设置JVM 中最大堆大小有三方面限制:相关操作系统的数据模型(32-bt还是64-bit)限制;系统的可用虚拟内存限制;系统的可用物理内存限制。32位系统下,一般限制在1.5G~2G;64为操作系统对内存无限制。我在Windows Server 2003 系统,3.5G物理内存,JDK5.0下测试,最大可设置为1478m。 典型设置: java -Xmx</div> </li> <li><a href="/article/401.htm" title="JDBC连接数据库" target="_blank">JDBC连接数据库</a> <span class="text-muted">Array_06</span> <a class="tag" taget="_blank" href="/search/jdbc/1.htm">jdbc</a> <div>package Util; import java.sql.Connection; import java.sql.DriverManager; import java.sql.ResultSet; import java.sql.SQLException; import java.sql.Statement; public class JDBCUtil { //完</div> </li> <li><a href="/article/528.htm" title="Unsupported major.minor version 51.0(jdk版本错误)" target="_blank">Unsupported major.minor version 51.0(jdk版本错误)</a> <span class="text-muted">oloz</span> <a class="tag" taget="_blank" href="/search/java/1.htm">java</a> <div>java.lang.UnsupportedClassVersionError: cn/support/cache/CacheType : Unsupported major.minor version 51.0 (unable to load class cn.support.cache.CacheType) at org.apache.catalina.loader.WebappClassL</div> </li> <li><a href="/article/655.htm" title="用多个线程处理1个List集合" target="_blank">用多个线程处理1个List集合</a> <span class="text-muted">362217990</span> <a class="tag" taget="_blank" href="/search/%E5%A4%9A%E7%BA%BF%E7%A8%8B/1.htm">多线程</a><a class="tag" taget="_blank" href="/search/thread/1.htm">thread</a><a class="tag" taget="_blank" href="/search/list/1.htm">list</a><a class="tag" taget="_blank" href="/search/%E9%9B%86%E5%90%88/1.htm">集合</a> <div>  昨天发了一个提问,启动5个线程将一个List中的内容,然后将5个线程的内容拼接起来,由于时间比较急迫,自己就写了一个Demo,希望对菜鸟有参考意义。。 import java.util.ArrayList; import java.util.List; import java.util.concurrent.CountDownLatch; public c</div> </li> <li><a href="/article/782.htm" title="JSP简单访问数据库" target="_blank">JSP简单访问数据库</a> <span class="text-muted">香水浓</span> <a class="tag" taget="_blank" href="/search/sql/1.htm">sql</a><a class="tag" taget="_blank" href="/search/mysql/1.htm">mysql</a><a class="tag" taget="_blank" href="/search/jsp/1.htm">jsp</a> <div>学习使用javaBean,代码很烂,仅为留个脚印 public class DBHelper { private String driverName; private String url; private String user; private String password; private Connection connection; privat</div> </li> <li><a href="/article/909.htm" title="Flex4中使用组件添加柱状图、饼状图等图表" target="_blank">Flex4中使用组件添加柱状图、饼状图等图表</a> <span class="text-muted">AdyZhang</span> <a class="tag" taget="_blank" href="/search/Flex/1.htm">Flex</a> <div>1.添加一个最简单的柱状图 ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 <?xml version= "1.0"&n</div> </li> <li><a href="/article/1036.htm" title="Android 5.0 - ProgressBar 进度条无法展示到按钮的前面" target="_blank">Android 5.0 - ProgressBar 进度条无法展示到按钮的前面</a> <span class="text-muted">aijuans</span> <a class="tag" taget="_blank" href="/search/android/1.htm">android</a> <div>在低于SDK < 21 的版本中,ProgressBar 可以展示到按钮前面,并且为之在按钮的中间,但是切换到android 5.0后进度条ProgressBar 展示顺序变化了,按钮再前面,ProgressBar 在后面了我的xml配置文件如下:   [html]  view plain copy   <RelativeLa</div> </li> <li><a href="/article/1163.htm" title="查询汇总的sql" target="_blank">查询汇总的sql</a> <span class="text-muted">baalwolf</span> <a class="tag" taget="_blank" href="/search/sql/1.htm">sql</a> <div>select   list.listname, list.createtime,listcount from dream_list as list ,   (select listid,count(listid) as listcount  from dream_list_user  group by listid  order by count(</div> </li> <li><a href="/article/1290.htm" title="Linux du命令和df命令区别" target="_blank">Linux du命令和df命令区别</a> <span class="text-muted">BigBird2012</span> <a class="tag" taget="_blank" href="/search/linux/1.htm">linux</a> <div>        1,两者区别             du,disk usage,是通过搜索文件来计算每个文件的大小然后累加,du能看到的文件只是一些当前存在的,没有被删除的。他计算的大小就是当前他认为存在的所有文件大小的累加和。        </div> </li> <li><a href="/article/1417.htm" title="AngularJS中的$apply,用还是不用?" target="_blank">AngularJS中的$apply,用还是不用?</a> <span class="text-muted">bijian1013</span> <a class="tag" taget="_blank" href="/search/JavaScript/1.htm">JavaScript</a><a class="tag" taget="_blank" href="/search/AngularJS/1.htm">AngularJS</a><a class="tag" taget="_blank" href="/search/%24apply/1.htm">$apply</a> <div>        在AngularJS开发中,何时应该调用$scope.$apply(),何时不应该调用。下面我们透彻地解释这个问题。         但是首先,让我们把$apply转换成一种简化的形式。         scope.$apply就像一个懒惰的工人。它需要按照命</div> </li> <li><a href="/article/1544.htm" title="[Zookeeper学习笔记十]Zookeeper源代码分析之ClientCnxn数据序列化和反序列化" target="_blank">[Zookeeper学习笔记十]Zookeeper源代码分析之ClientCnxn数据序列化和反序列化</a> <span class="text-muted">bit1129</span> <a class="tag" taget="_blank" href="/search/zookeeper/1.htm">zookeeper</a> <div>ClientCnxn是Zookeeper客户端和Zookeeper服务器端进行通信和事件通知处理的主要类,它内部包含两个类,1. SendThread 2. EventThread, SendThread负责客户端和服务器端的数据通信,也包括事件信息的传输,EventThread主要在客户端回调注册的Watchers进行通知处理   ClientCnxn构造方法   &</div> </li> <li><a href="/article/1671.htm" title="【Java命令一】jmap" target="_blank">【Java命令一】jmap</a> <span class="text-muted">bit1129</span> <a class="tag" taget="_blank" href="/search/Java%E5%91%BD%E4%BB%A4/1.htm">Java命令</a> <div>jmap命令的用法:   [hadoop@hadoop sbin]$ jmap Usage: jmap [option] <pid> (to connect to running process) jmap [option] <executable <core> (to connect to a </div> </li> <li><a href="/article/1798.htm" title="Apache 服务器安全防护及实战" target="_blank">Apache 服务器安全防护及实战</a> <span class="text-muted">ronin47</span> <div>此文转自IBM. Apache 服务简介 Web 服务器也称为 WWW 服务器或 HTTP 服务器 (HTTP Server),它是 Internet 上最常见也是使用最频繁的服务器之一,Web 服务器能够为用户提供网页浏览、论坛访问等等服务。 由于用户在通过 Web 浏览器访问信息资源的过程中,无须再关心一些技术性的细节,而且界面非常友好,因而 Web 在 Internet 上一推出就得到</div> </li> <li><a href="/article/1925.htm" title="unity 3d实例化位置出现布置?" target="_blank">unity 3d实例化位置出现布置?</a> <span class="text-muted">brotherlamp</span> <a class="tag" taget="_blank" href="/search/unity%E6%95%99%E7%A8%8B/1.htm">unity教程</a><a class="tag" taget="_blank" href="/search/unity/1.htm">unity</a><a class="tag" taget="_blank" href="/search/unity%E8%B5%84%E6%96%99/1.htm">unity资料</a><a class="tag" taget="_blank" href="/search/unity%E8%A7%86%E9%A2%91/1.htm">unity视频</a><a class="tag" taget="_blank" href="/search/unity%E8%87%AA%E5%AD%A6/1.htm">unity自学</a> <div>问:unity 3d实例化位置出现布置? 答:实例化的同时就可以指定被实例化的物体的位置,即 position  Instantiate (original : Object, position : Vector3, rotation : Quaternion) : Object 这样你不需要再用Transform.Position了,   如果你省略了第二个参数(</div> </li> <li><a href="/article/2052.htm" title="《重构,改善现有代码的设计》第八章 Duplicate Observed Data" target="_blank">《重构,改善现有代码的设计》第八章 Duplicate Observed Data</a> <span class="text-muted">bylijinnan</span> <a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/%E9%87%8D%E6%9E%84/1.htm">重构</a> <div> import java.awt.Color; import java.awt.Container; import java.awt.FlowLayout; import java.awt.Label; import java.awt.TextField; import java.awt.event.FocusAdapter; import java.awt.event.FocusE</div> </li> <li><a href="/article/2179.htm" title="struts2更改struts.xml配置目录" target="_blank">struts2更改struts.xml配置目录</a> <span class="text-muted">chiangfai</span> <a class="tag" taget="_blank" href="/search/struts.xml/1.htm">struts.xml</a> <div>struts2默认是读取classes目录下的配置文件,要更改配置文件目录,比如放在WEB-INF下,路径应该写成../struts.xml(非/WEB-INF/struts.xml) web.xml文件修改如下:   <filter> <filter-name>struts2</filter-name> <filter-class&g</div> </li> <li><a href="/article/2306.htm" title="redis做缓存时的一点优化" target="_blank">redis做缓存时的一点优化</a> <span class="text-muted">chenchao051</span> <a class="tag" taget="_blank" href="/search/redis/1.htm">redis</a><a class="tag" taget="_blank" href="/search/hadoop/1.htm">hadoop</a><a class="tag" taget="_blank" href="/search/pipeline/1.htm">pipeline</a> <div>        最近集群上有个job,其中需要短时间内频繁访问缓存,大概7亿多次。我这边的缓存是使用redis来做的,问题就来了。       首先,redis中存的是普通kv,没有考虑使用hash等解结构,那么以为着这个job需要访问7亿多次redis,导致效率低,且出现很多redi</div> </li> <li><a href="/article/2433.htm" title="mysql导出数据不输出标题行" target="_blank">mysql导出数据不输出标题行</a> <span class="text-muted">daizj</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%AF%BC%E5%87%BA/1.htm">数据导出</a><a class="tag" taget="_blank" href="/search/%E5%8E%BB%E6%8E%89%E7%AC%AC%E4%B8%80%E8%A1%8C/1.htm">去掉第一行</a><a class="tag" taget="_blank" href="/search/%E5%8E%BB%E6%8E%89%E6%A0%87%E9%A2%98/1.htm">去掉标题</a> <div>当想使用数据库中的某些数据,想将其导入到文件中,而想去掉第一行的标题是可以加上-N参数 如通过下面命令导出数据: mysql -uuserName -ppasswd -hhost -Pport -Ddatabase -e " select * from tableName"  > exportResult.txt 结果为: studentid</div> </li> <li><a href="/article/2560.htm" title="phpexcel导出excel表简单入门示例" target="_blank">phpexcel导出excel表简单入门示例</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/Excel/1.htm">Excel</a><a class="tag" taget="_blank" href="/search/phpexcel/1.htm">phpexcel</a> <div>先下载PHPEXCEL类文件,放在class目录下面,然后新建一个index.php文件,内容如下 <?php error_reporting(E_ALL); ini_set('display_errors', TRUE); ini_set('display_startup_errors', TRUE);   if (PHP_SAPI == 'cli') die('</div> </li> <li><a href="/article/2687.htm" title="爱情格言" target="_blank">爱情格言</a> <span class="text-muted">dcj3sjt126com</span> <a class="tag" taget="_blank" href="/search/%E6%A0%BC%E8%A8%80/1.htm">格言</a> <div> 1) I love you not because of who you are, but because of who I am when I am with you.    我爱你,不是因为你是一个怎样的人,而是因为我喜欢与你在一起时的感觉。   2) No man or woman is worth your tears, and the one who is, won‘t</div> </li> <li><a href="/article/2814.htm" title="转 Activity 详解——Activity文档翻译" target="_blank">转 Activity 详解——Activity文档翻译</a> <span class="text-muted">e200702084</span> <a class="tag" taget="_blank" href="/search/android/1.htm">android</a><a class="tag" taget="_blank" href="/search/UI/1.htm">UI</a><a class="tag" taget="_blank" href="/search/sqlite/1.htm">sqlite</a><a class="tag" taget="_blank" href="/search/%E9%85%8D%E7%BD%AE%E7%AE%A1%E7%90%86/1.htm">配置管理</a><a class="tag" taget="_blank" href="/search/%E7%BD%91%E7%BB%9C%E5%BA%94%E7%94%A8/1.htm">网络应用</a> <div>activity 展现在用户面前的经常是全屏窗口,你也可以将 activity 作为浮动窗口来使用(使用设置了 windowIsFloating 的主题),或者嵌入到其他的 activity (使用 ActivityGroup )中。 当用户离开 activity 时你可以在 onPause() 进行相应的操作 。更重要的是,用户做的任何改变都应该在该点上提交 ( 经常提交到 ContentPro</div> </li> <li><a href="/article/2941.htm" title="win7安装MongoDB服务" target="_blank">win7安装MongoDB服务</a> <span class="text-muted">geeksun</span> <a class="tag" taget="_blank" href="/search/mongodb/1.htm">mongodb</a> <div>1.  下载MongoDB的windows版本:mongodb-win32-x86_64-2008plus-ssl-3.0.4.zip,Linux版本也在这里下载,下载地址: http://www.mongodb.org/downloads   2.  解压MongoDB在D:\server\mongodb, 在D:\server\mongodb下创建d</div> </li> <li><a href="/article/3068.htm" title="Javascript魔法方法:__defineGetter__,__defineSetter__" target="_blank">Javascript魔法方法:__defineGetter__,__defineSetter__</a> <span class="text-muted">hongtoushizi</span> <a class="tag" taget="_blank" href="/search/js/1.htm">js</a> <div>转载自: http://www.blackglory.me/javascript-magic-method-definegetter-definesetter/ 在javascript的类中,可以用defineGetter和defineSetter_控制成员变量的Get和Set行为 例如,在一个图书类中,我们自动为Book加上书名符号: function Book(name){ </div> </li> <li><a href="/article/3195.htm" title="错误的日期格式可能导致走nginx proxy cache时不能进行304响应" target="_blank">错误的日期格式可能导致走nginx proxy cache时不能进行304响应</a> <span class="text-muted">jinnianshilongnian</span> <a class="tag" taget="_blank" href="/search/cache/1.htm">cache</a> <div>昨天在整合某些系统的nginx配置时,出现了当使用nginx cache时无法返回304响应的情况,出问题的响应头: Content-Type:text/html; charset=gb2312 Date:Mon, 05 Jan 2015 01:58:05 GMT Expires:Mon , 05 Jan 15 02:03:00 GMT Last-Modified:Mon, 05</div> </li> <li><a href="/article/3322.htm" title="数据源架构模式之行数据入口" target="_blank">数据源架构模式之行数据入口</a> <span class="text-muted">home198979</span> <a class="tag" taget="_blank" href="/search/PHP/1.htm">PHP</a><a class="tag" taget="_blank" href="/search/%E6%9E%B6%E6%9E%84/1.htm">架构</a><a class="tag" taget="_blank" href="/search/%E8%A1%8C%E6%95%B0%E6%8D%AE%E5%85%A5%E5%8F%A3/1.htm">行数据入口</a> <div>注:看不懂的请勿踩,此文章非针对java,java爱好者可直接略过。   一、概念 行数据入口(Row Data Gateway):充当数据源中单条记录入口的对象,每行一个实例。   二、简单实现行数据入口 为了方便理解,还是先简单实现: <?php /** * 行数据入口类 */ class OrderGateway { /*定义元数</div> </li> <li><a href="/article/3449.htm" title="Linux各个目录的作用及内容" target="_blank">Linux各个目录的作用及内容</a> <span class="text-muted">pda158</span> <a class="tag" taget="_blank" href="/search/linux/1.htm">linux</a><a class="tag" taget="_blank" href="/search/%E8%84%9A%E6%9C%AC/1.htm">脚本</a> <div>1)根目录“/”   根目录位于目录结构的最顶层,用斜线(/)表示,类似于 Windows 操作系统的“C:\“,包含Fedora操作系统中所有的目录和文件。   2)/bin   /bin   目录又称为二进制目录,包含了那些供系统管理员和普通用户使用的重要 linux命令的二进制映像。该目录存放的内容包括各种可执行文件,还有某些可执行文件的符号连接。常用的命令有:cp、d</div> </li> <li><a href="/article/3576.htm" title="ubuntu12.04上编译openjdk7" target="_blank">ubuntu12.04上编译openjdk7</a> <span class="text-muted">ol_beta</span> <a class="tag" taget="_blank" href="/search/HotSpot/1.htm">HotSpot</a><a class="tag" taget="_blank" href="/search/jvm/1.htm">jvm</a><a class="tag" taget="_blank" href="/search/jdk/1.htm">jdk</a><a class="tag" taget="_blank" href="/search/OpenJDK/1.htm">OpenJDK</a> <div>获取源码 从openjdk代码仓库获取(比较慢) 安装mercurial Mercurial是一个版本管理工具。 sudo apt-get install mercurial 将以下内容添加到$HOME/.hgrc文件中,如果没有则自己创建一个: [extensions] forest=/home/lichengwu/hgforest-crew/forest.py fe</div> </li> <li><a href="/article/3703.htm" title="将数据库字段转换成设计文档所需的字段" target="_blank">将数据库字段转换成设计文档所需的字段</a> <span class="text-muted">vipbooks</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/%E5%B7%A5%E4%BD%9C/1.htm">工作</a><a class="tag" taget="_blank" href="/search/%E6%AD%A3%E5%88%99%E8%A1%A8%E8%BE%BE%E5%BC%8F/1.htm">正则表达式</a> <div>        哈哈,出差这么久终于回来了,回家的感觉真好!         PowerDesigner的物理数据库一出来,设计文档中要改的字段就多得不计其数,如果要把PowerDesigner中的字段一个个Copy到设计文档中,那将会是一件非常痛苦的事情。</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>