喜欢c罗的小菜鸡

HTML、CSS知识点总结

文章目录

一，HTML+CSS基础

1-1 HTML和CSS的关系：
1-2 HTML的结构：

1.2.1 学习要点：
1.2.2 HTML的固定结构：

1.3HTML的文本：

1.3.1标题和段落

标题
段落

空白
换行符和水平线

1.3.2文本的格式化（语义化标记）：

1.4HTML的列表

1.4.1有序列表
1.4.2无序列表
1.4.3自定义列表

1.5HTML的链接

1.5.1 HTML 链接
1.5.2 HTML 超链接（链接）

1.5.2.1 绝对url
1.5.2.2 相对url

1.5.3HTML 空链接

1.5.3.1HTML 链接 - target 属性
1.5.3.2HTML 链接 -name 属性

1.6HTML的图像

1.6.1HTML 图像- 图像标签（``）和源属性（Src）
1.6.2图像格式
1.6.3HTML 图像- Alt属性
1.6.4HTML 图像- 设置图像的高度与宽度

1.7HTML的表格

1.7.1HTML 表格的基本结构：

HTML 表格表头单元格
表格标题
标题HTML表格高度和宽度
HTML表格背景
HTML表格空间
HTML合并单元格(跨行和跨列）
HTML表格头部、主体、页脚
HTML表格的嵌套

1.7HTML的表单

1.7.1HTML表单
1.7.2表单元素

1.8HTML其他标记

一，HTML+CSS基础

1-1 HTML和CSS的关系：

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

HTML是网页内容的载体。内容就是网页制作者放在页面上想要让用户浏览的信息，可以包含文字、图片、视频等。
CSS样式是表现。就像网页的外衣。比如，标题字体、颜色变化，或为标题加入背景图片、边框等。所有这些用来改变内容外观的东西称之为表现。
javaScript是用来实现网页上的特效效果。如：鼠标滑过弹出下拉菜单。或鼠标滑过表格的背景颜色改变。还有焦点新闻（新闻图片）的轮换。可以这么理解，有动画的，有交互的一般都是用JavaScript来实现的。

1-2 HTML的结构：

1.2.1 学习要点：

理解html的结构
学习标签
标签和元素

1.2.2 HTML的固定结构：


<html lang="en">
 <head>
	<meta charset="UTF-8">
	<title>title>
 head>
	<body>
		<h1>This is the Main Headingh1>
		<p>This text might be an introduction to the rest of the page. And if the page is a 
			 long one it might be split up into several sub-headings.<p>
		<h2>This is a Sub-Headingh2>
		<p>Many long articles have sub-headings so to help you follow the structure of what 
			 is being written. There may even be sub-sub-headings (or lower-level headings).
			 p>
		<h2>Another Sub-Headingh2>
		<p>Here you can see another sub-heading.p>
	body>
html>

代码讲解：

称为根标签，所有的网页标签都在中。
标签用于定义文档的头部，它是所有头部元素的容器。头部元素有</code>、<code><script>、 <style>、<link>、 <meta></code>等标签，头部标签在下一小节中会有详细介绍。</li> <li>在<code><body>和</body></code>标签之间的内容是网页的主要内容，如<code><h1>、、<a>、<img></code>等网页内容标签，在这里的标签中的内容会在浏览器中显示出来。</li> </ol> 在<code><head></head></code>中使用的标签 <pre><code><head> <title>...
声明部分：主要作用是用来告诉浏览器这个页面使用的是哪个标准。是HTML5标准。
head部分：将页面的一些额外信息告诉服务器。不会显示在页面上。

头标签都放在头部分之间。包括：、<base>、<meta>、<link></code> <code><title></code>：指定整个网页的标题，在浏览器最上方显示。 <code><base></code>：为页面上的所有链接规标题栏显示的内容定默认地址或默认目标。 <code><meta></code>：提供有关页面的基本信息 <code><body></code>：用于定义HTML文档所要显示的内容，也称为主体标签。我们所写的代码必须放在此标签內。 <code><link></code>：定义文档与外部资源的关系。 小结： <ul> <li>HTML文档是文本文档</li> <li>HTML使用标签为包含在其内的内容提供结构信息</li> <li>标签经常与元素互相换用</li> <li>标签通常成对出现。起始标签标示一段内容的开始；结束标签表示它的结束</li> <li>起始标签可以附带特性，特性告诉我们更多关于元素内容的信息</li> <li>特性由特性名称和特性值组成</li> <li>信息HTML就要学习哪些标签可用，它们有什么作用以及可以用在何处</li> </ul> <h2>1.3HTML的文本：</h2> 本节内容： <ul> <li>标题和段落</li> <li>粗体，斜体，强调</li> <li>结构化标记和语义化标记</li> </ul> <h3>1.3.1标题和段落</h3> <h4>标题</h4> 标题（Heading）是通过 <code><h1> - <h6></code> 标签进行定义的. <code><h1></code>定义最大的标题。<code><h6></code> 定义最小的标题。 实例 <pre><code><h1>这是一个标题。</h1> <h2>这是一个标题。</h2> <h3>这是一个标题。</h3> </code></pre> 注释: 浏览器会自动地在标题的前后添加空行。 注释：默认情况下，HTML 会自动地在块级元素前后添加一个额外的空行，比如段落、标题元素前后。 标题很重要 请确保将 HTML 标题标签只用于标题。不要仅仅是为了生成粗体或大号的文本而使用标题。 搜索引擎使用标题为您的网页的结构和内容编制索引。 因为用户可以通过标题来快速浏览您的网页，所以用标题来呈现文档结构是很重要的。 应该将 h1 用作主标题（最重要的），其后是 h2（次重要的），再其次是 h3，以此类推。 <h4>段落</h4> HTML 段落 HTML 可以将文档分割为若干段落。 默认情况下，浏览器会在显示段落时另起一行并与后续段落保持一定距离 段落是通过 <code></code> 标签定义的。 <hr> 实例 <pre><code class="prism language-html"><p>这是一个段落</p> <p>这是另外一个段落</p> </code></pre> 这是一个段落 这是另外一个段落 <hr> <h5>空白</h5> 对于空白，设计人员在写代码时为了增强代码的可读性会利用空格或者换行的形式来编写代码。 当浏览器遇到两个以上的空格，只会显示一个空格，同样换行也是一个空格 <h5>换行符和水平线</h5> <pre><code> 可以在文本中加入换行 <hr/>在不同主题中插入水平线来分割 </code></pre> <h3>1.3.2文本的格式化（语义化标记）：</h3> HTML 文本格式化 HTML 中存在一些格式化文本的标签，它们可以被直接使用，而不用您再去写样式进行调整。 实例 <pre><code>加粗文本 斜体文本 </code></pre> 这是 <code>下标</code> 和 <code>上标</code> HTML 格式化标签 HTML 使用标签 <code></code>(“bold”) 与 <code></code>(“italic”) 对输出的文本进行格式，如：粗体 or 斜体 这些 HTML 标签被称为格式化标签（请查看底部完整标签参考手册）。 lamp 通常标签 <code></code> 替换加粗标签 <code></code> 来使用， <code></code> 替换 <code></code>标签使用。 然而，这些标签的含义是不同的： <code></code> 与<code></code> 定义粗体或斜体文本。 <code></code> 或者 <code></code> 意味着你要呈现的文本是重要的，所以要突出显示。 现今所有主要浏览器都能渲染各种效果的字体。不过，未来浏览器可能会支持更好的渲染效果。 HTML 文本格式化标签 标签描述 <pre><code> 定义粗体文本 定义着重文字 定义斜体字 定义小号字 定义加重语气 定义下标字 定义上标字 <ins> 定义插入字 <del> 定义删除字 </code></pre> HTML “计算机输出” 标签 标签描述 <pre><code><code> 定义计算机代码 <kbd> 定义键盘码 <samp> 定义计算机代码样本 <var> 定义变量 <pre> 定义预格式文本 </code></pre> HTML 引文, 引用, 及标签定义 标签描述 <pre><code><abbr> 定义缩写 <address> 定义地址 <bdo> 定义文字方向 <blockquote> 定义长的引用 <q> 定义短的引用语 <cite> 定义引用、引证 <dfn> 定义一个定义项目。 </code></pre> 实例 <pre><code class="prism language-html"><html> <head> <title>Text</title> </head> <body> <h1>The Story in the Book</h1> <h2>Chapter 1</h2> <p>Molly had been staring out of her window for about an hour now. On her desk, lying between the copies of <i>Nature</i>, <i>New Scientist</i>, and all the other scientific journals her work had appeared in, was a well thumbed copy of <cite>On The Road</cite>. It had been Molly's favourite book since college, and the longer she spent in these four walls the more she felt she needed to be free.</p> <p>She had spent the last ten years in this room, sitting under a poster with an Oscar Wilde quote proclaiming that <q>Work is the refuge of people who have nothing better to do</q>. Although many considered her pioneering work, unraveling the secrets of the llama <abbr title="Deoxyribonucleic acid">DNA</abbr>, to be an outstanding achievement, Molly <em>did</em> think she had something better to do.</p> </body> </html> </code></pre> 小结 <ul> <li>HTML元素用来描述页面的结构（例如标题和段落）</li> <li>HTML元素还提供语义信息（例如在什么位置着重强调，所使用的的缩略词定义，给定的文本何时是引用）</li> </ul> <h2>1.4HTML的列表</h2> 本节内容 <ul> <li>有序列表</li> <li>无序列表</li> <li>自定义列表</li> </ul> <h3>1.4.1有序列表</h3> 有序列表也是一列项目，列表项目使用数字进行标记。有序列表始于 <code><ol></code> 标签。每个列表项始于 <code><li></code> 标签。 有序列表适合各项目之间存在顺序关系的情况。 <pre><code> <ol> </code></pre> 使用<code><ol>元素</code>来创建有序列表 <pre><code><li> </code></pre> 列表的每个项目都被置于<code><li></code>和<code></li></code>之间 <h3>1.4.2无序列表</h3> 无序列表是一个项目的列表，此列项目使用粗体圆点（典型的小黑圆圈）进行标记。 无序列表适合成员之间无级别顺序关系的情况。 无序列表使用 <code><ul></code> 标签，每个项目也是由<code><li></li></code>包裹 <h3>1.4.3自定义列表</h3> 自定义列表不仅仅是一列项目，而是项目及其注释的组合。 自定义列表以 <code><dl></code> 标签开始。每个自定义列表项以 <code><dt></code> 开始。每个自定义列表项的定义以 <code><dd></code> 开始。也就是<code><dt></code>包裹的是术语，而<code><dd></code>表示的是对术语的具体定义和内容 自定义列表中的一个术语名可以对应多重定义或者多个术语名对应同一个定义，如果只有也术语名或者只有定义也是可行的，也就是说 <code><dt> 与 <dd></code> 在其中数量不限、对应关系不限。 <dl> <dt> 嵌套列表 </dt> <dd> - 可以在中加入另一个列表来创建子列表，或者叫做嵌套列表 </dd> </dl> 实例 <pre><code class="prism language-html"><html> <head> <title>Lists</title> </head> <body> <h1>Scrambled Eggs</h1> <p>Eggs are one of my favorite foods. Here is a recipe for deliciously rich scrambled eggs.</p> <h2>Ingredients</h2>  <ul> <li>2 eggs</li> <li>1tbs butter</li> <li>2tbs cream</li> </ul> <h2>Method</h2>  <ol> <li>Melt butter in a frying pan over a medium heat</li> <li>Gently mix the eggs and cream in a bowl</li> <li>Once butter has melted add cream and eggs</li> <li>Using a spatula fold the eggs from the edge of the pan to the center every 20 seconds (as if you are making an omelette)</li> <li>When the eggs are still moist remove from the heat (it will continue to cook on the plate until served)</li> </ol>  <dl> <dt>Coffee</dt> <dd>- black hot drink</dd> <dt>Milk</dt> <dd>- white cold drink</dd> </dl>  <ul> <li>Mousses</li> <li>Pastries <ul> <li>Croissant</li> <li>Mille-feuille</li> <li>Palmier</li> <li>Profiterole</li> </ul> </li> <li>Tarts</li> </ul> </body> </html> </code></pre> 在浏览器中的显示 Lists <h1>Scrambled Eggs</h1> Eggs are one of my favorite foods. Here is a recipe for deliciously rich scrambled eggs. <h2>Ingredients</h2> <ul> <li>2 eggs</li> <li>1tbs butter</li> <li>2tbs cream</li> </ul> <h2>Method</h2> <ol> <li>Melt butter in a frying pan over a medium heat</li> <li>Gently mix the eggs and cream in a bowl</li> <li>Once butter has melted add cream and eggs</li> <li>Using a spatula fold the eggs from the edge of the pan to the center every 20 seconds (as if you are making an omelette)</li> <li>When the eggs are still moist remove from the heat (it will continue to cook on the plate until served)</li> </ol> <dl> <dt> Coffee </dt> <dd> - black hot drink </dd> <dt> Milk </dt> <dd> - white cold drink </dd> </dl> <ul> <li>Mousses</li> <li>Pastries <ul> <li>Croissant</li> <li>Mille-feuille</li> <li>Palmier</li> <li>Profiterole</li> </ul> </li> <li>Tarts</li> </ul> <ul> <li>小结 <ul> <li>HTML中有三种列表：有序列表、无序列表、定义列表</li> <li>有序列表使用数字编号</li> <li>无序列表使用项目符号</li> <li>定义列表用来定义专业术语</li> <li>列表可以嵌套在其他列表中</li> </ul> </li> </ul> <h2>1.5HTML的链接</h2> 本节内容 <ul> <li>HTML链接定义</li> <li>HTML超链接</li> <li>HTML空链接</li> </ul> <h3>1.5.1 HTML 链接</h3> <dt> HTML链接 </dt> <dd> HTML 使用超级链接与网络上的另一个文档相连。几乎可以在所有的网页中找到链接。点击链接可以从一张页面跳转到另一张页面。 </dd> <hr> <h3>1.5.2 HTML 超链接（链接）</h3> HTML使用标签 <code><a></code>来设置超文本链接，是可以从一个页面指向另一个目的端的链接。 超链接可以是一个字，一个词，或者一组词，也可以是一幅图像，您可以点击这些内容来跳转到新的文档或者当前文档中的某个部分。 当您把鼠标指针移动到网页中的某个链接上时，箭头会变为一只小手。 在标签<code><a></code> 中使用了href属性来描述链接的地址。 默认情况下，链接将以以下形式出现在浏览器中： <ul> <li>一个未访问过的链接显示为蓝色字体并带有下划线</li> <li>访问过的链接显示为紫色并带上下划线</li> <li>点击链接时，链接显示为红色并带上下划线</li> </ul> 注意：如果为这些超链接设置了CSS样式，展示样式会根据CSS的设定来显示 <h4>1.5.2.1 绝对url</h4> <dt> url </dt> <dd> url的全称是统一资源定位器。每个网页都有各自的url，网页的url就是在访问网站时需要输入网站的地址 </dd> <dt> 绝对url </dt> <dd> 绝对url以网站的域名开头，域名后面可以指定具体页面的路径，如果没有指定，网站则显示其主页，通常用来访问其他网站 </dd> <h4>1.5.2.2 相对url</h4> 相对url可以用于为网站内部页面之间建立链接。它用一种简单的方式告诉浏览器如何查找文件。 相对URL（relative URL）以包含URL本身的文件夹的位置为参考点，描述目标文件夹的位置。如果目标文件与当前页面（也就是包含URL的页面）在同一个目录，那么这个文件的相对URL仅仅是文件名和扩展名。 如果目标文件在当前目录的子目录中，那么它的相对URL是子目录名，后面是斜杠，然后是目标文件的文件名和扩展名。 如果要引用文件层次结构中更高层目录中的文件，那么使用两个句点和一条斜杠。可以组合和重复使用两个句点和一条斜杠，从而引用当前文件所在的硬盘上的任何文件。 <ul> <li>引用同目录：<code>文件名+扩展名</code></li> <li>引用子目录：<code>/+文件名+扩展名</code></li> <li>上层目录：每上一级就 <code>../+ 文件名+扩展名</code></li> <li>根相对URL：<code>/根文件夹/+文件名+扩展名</code></li> </ul> 一般来说，对于同一服务器上的文件，应该总是使用相对URL，它们更容易输入，而且在将页面从本地系统转移到服务器上时更方便，只要每个文件的相对位置保持不变，链接就仍然是有效地。 <hr> <h3>1.5.3HTML 空链接</h3> HTML 空链接：指指向链接后，鼠标变成手形，但单击后仍停留在当前页面。 临时加的空链接，主要为了能更好的看到最终的效果。 基本语法： <pre><code><a href="#">链接文字</a> </code></pre> 其中“ # ”表示空链接。 HTML 链接语法 链接的 HTML 代码很简单。它类似这样：: <pre><code><a href="url">Link text</a> </code></pre> href 属性描述了链接的目标。. 提示: “链接文本” 不必一定是文本。图片或其他 HTML 元素都可以成为链接。 <h4>1.5.3.1HTML 链接 - target 属性</h4> 使用 Target 属性，你可以定义被链接的文档在何处显示（在新的窗口打开，还是在原有的窗口中打开）。 提示：默认的被链接文档会在原有的窗口中打开的。如果将 target 属性设置为 “_blank” 则文档就会在新窗口打开。 <h4>1.5.3.2HTML 链接 -name 属性</h4> name 属性规定锚（anchor）的名称。 您可以使用 name 属性创建 HTML 页面中的书签。 书签不会以任何特殊方式显示，它对读者是不可见的。 当使用命名锚（named anchors）时，我们可以创建直接跳至该命名锚（比如页面中某个小节）的链接，这样使用者就无需不停地滚动页面来寻找他们需要的信息了。 命名锚的语法： <pre><code><a name="label">锚（显示在页面上的文本）</a> </code></pre> 提示：锚的名称可以是任何你喜欢的名字。 提示：您可以使用 id 属性来替代 name 属性，命名锚同样有效。 实例 首先，我们在 HTML 文档中对锚进行命名（创建一个书签）： <pre><code><a name="tips">基本的注意事项 - 有用的提示</a> </code></pre> 然后，我们在同一个文档中创建指向该锚的链接： <pre><code><a href="#tips">有用的提示</a> </code></pre> 您也可以在其他页面中创建指向该锚的链接： <pre><code><a href="http://www.w3school.com.cn/html/html_links.asp#tips">有用的提示</a> </code></pre> 在上面的代码中，我们将 # 符号和锚名称添加到 URL 的末端，就可以直接链接到 tips 这个命名锚了。 实例 <pre><code class="prism language-html"><html> <head> <title>Links</title> </head> <body> <h1 id="top">Film Folk</h1> <h2>Festival Diary</h2> <p>Here are some of the film festivals we will be attending this year.<br />Please <a href="mailto:filmfolk@example.org">contact us</a> if you would like more information.</p> <h3>January</h3> <p><a href="http://www.sundance.org">Sundance Film Festival</a><br />Park City, Utah, USA<br />20 - 30 January 2011</p> <h3>February</h3> <p><a href="http://www.tropfest.com">Tropfest</a><br />Sydney, Australia<br />20 February 2011</p> <h3>March</h3> <p><a href="http://sxsw.com">South by Southwest</a><br />Austin, Texas, USA<br />11 - 20 March 2011</p> <h3>April</h3> <p><a href="http://www.londonindependent.org">London Independent Film Festival</a><br />London, UK<br />15 - 24 April 2011</p> <h3>May</h3> <p><a href="http://www.festival-cannes.com">Cannes International Film Festival</a><br />Cannes, France<br />11 - 22 May 2011</p> <h3>June</h3> <p><a href="http://www.sff.org.au">Sydney Film Festival</a><br />Sydney, Australia<br />8 - 19 June 2011</p> <h3>July</h3> <p><a href="http://www.miff.com.au">Melbourne International Film Festival</a><br />Melbourne, Victoria, Australia<br />22 July - 7 August 2011</p> <h3>August</h3> <p><a href="http://www.nzff.co.nz">New Zealand International Film Festival</a><br />Dunedin, New Zealand<br />4 - 25 August 2011</p> <h3>September</h3> <p><a href="http://www.labiennale.org/en/cinema">Venice Film Festival</a><br />Venice, Italy<br />31 August - 10 September 2011</p> <h3>October</h3> <p><a href="http://www.bfi.org.uk/lff/">London Film Festival</a><br />London, UK<br />12 - 27 October 2011</p> <h3>November</h3> <p><a href="http://www.idfa.nl/industry.aspx">International Documentary Film Festival Amsterdam (IDFA)</a><br />Amsterdam, Netherlands<br />16 - 27 November 2011</p> <h3>December</h3> <p><a href="http://whistlerfilmfestival.com">Whistler Film Festival</a><br />Whistler, BC, Canada<br />30 November - 4 December 2011</p> <p><a href="about.html">About Film Folk</a></p> <p><a href="#top">Top of page</a></p> </body> </html> </code></pre> 在浏览器中的显示 Links <h1 id="top">Film Folk</h1> <h2>Festival Diary</h2> Here are some of the film festivals we will be attending this year. Please contact us if you would like more information. <h3>January</h3> Sundance Film Festival Park City, Utah, USA 20 - 30 January 2011 <h3>February</h3> Tropfest Sydney, Australia 20 February 2011 <h3>March</h3> South by Southwest Austin, Texas, USA 11 - 20 March 2011 <h3>April</h3> London Independent Film Festival London, UK 15 - 24 April 2011 <h3>May</h3> Cannes International Film Festival Cannes, France 11 - 22 May 2011 <h3>June</h3> Sydney Film Festival Sydney, Australia 8 - 19 June 2011 <h3>July</h3> Melbourne International Film Festival Melbourne, Victoria, Australia 22 July - 7 August 2011 <h3>August</h3> New Zealand International Film Festival Dunedin, New Zealand 4 - 25 August 2011 <h3>September</h3> Venice Film Festival Venice, Italy 31 August - 10 September 2011 <h3>October</h3> London Film Festival London, UK 12 - 27 October 2011 <h3>November</h3> International Documentary Film Festival Amsterdam (IDFA) Amsterdam, Netherlands 16 - 27 November 2011 <h3>December</h3> Whistler Film Festival Whistler, BC, Canada 30 November - 4 December 2011 About Film Folk Top of page 总结 <ul> <li>链接是由元素<code><a></code>创建的</li> <li><code><a></code>元素通过href特性来指明你所要链接的页面</li> <li>如果是链接到网站内部的某个页面，最好使用相对链接</li> <li>可以通过id特性将某个可链接的页面上的元素作为链接目标</li> </ul> <hr> <h2>1.6HTML的图像</h2> 本节内容 <ul> <li>HTML的图像及其重要属性src和alt</li> <li>图像格式</li> <li>设置图像大小</li> <li>优化图像显示</li> </ul> <h3>1.6.1HTML 图像- 图像标签（<code><img></code>）和源属性（Src）</h3> 在 HTML 中，图像由<code><img></code>标签定义。 <code><img></code>是空标签，意思是说，它只包含属性，并且没有闭合标签。 要在页面上显示图像，你需要使用源属性（src）。src指 “source”。源属性的值是图像的 URL 地址。 定义图像的语法是： <pre><code><img src="url" alt="some_text"> </code></pre> URL 指存储图像的位置。 浏览器将图像显示在文档中图像标签出现的地方。如果你将图像标签置于两个段落之间，那么浏览器会首先显示第一个段落，然后显示图片，最后显示第二段。 <h3>1.6.2图像格式</h3> 常见的图像格式有 <dl> <dt> JPG </dt> <dd> 一般为色彩鲜艳，内容丰富的图片 </dd> <dt> PNG </dt> <dd> 无损压缩、透明、交错、动画 </dd> <dt> GIF </dt> <dd> 简单动画、背景透明 </dd> <dt> 透明 </dt> <dd> 可以给图片指定一种颜色，使其不被显示而为透明 </dd> <dt> 交错 </dt> <dd> 在显示图片的过程中可以从概貌逐渐变化到全貌，看上去也就是清晰度由小到大 </dd> </dl> <h3>1.6.3HTML 图像- Alt属性</h3> alt属性用来为图像定义一串预备的可替换的文本。在编程测试中练习alt属性的使用方法。 替换文本属性的值是用户定义的。 <pre><code><img src="boat.gif" alt="Big Boat"> </code></pre> 在浏览器无法载入图像时，替换文本属性告诉读者他们失去的信息。此时，浏览器将显示这个替代性的文本而不是图像。为页面上的图像都加上替换文本属性是个好习惯，这样有助于更好的显示信息，并且对于那些使用纯文本浏览器的人来说是非常有用的。 <h3>1.6.4HTML 图像- 设置图像的高度与宽度</h3> height（高度）与width（宽度）属性用于设置图像的高度与宽度. 属性值默认单位为像素: <pre><code><img src="pulpit.jpg" alt="Pulpit rock" width="304" height="228"> </code></pre> 提示: 指定图像的高度和宽度的一个很好的习惯。如果图像指定了高度宽度，页面加载时就会保留指定的尺寸。如果没有指定图片的大小，加载页面时有可能会破坏HTML页面的整体布局。 设置图像边框 　在<img src="">标签中您可以使用border属性以像素为单位指定边框粗细。厚度为 0 表示图片周围没有边框。 <pre><code><img src="/statics/images/course/pulpit.jpg" alt="Pulpit rock" border = "3"> </code></pre> 设置图像对齐 　默认情况下，图像在页面中将显示为左侧对齐，在<img src="">标签中您可以使用align属性将设置图像的对齐方式：center(居中)或right(右侧)。 <pre><code><img src="/statics/images/course/pulpit.jpg" alt="Pulpit rock" align="right"> </code></pre> 基本的注意事项 - 有用的提示： 注意: 假如某个 HTML 文件包含十个图像，那么为了正确显示这个页面，需要加载 11 个文件。加载图片是需要时间的，所以我们的建议是：慎用图片。 注意: 加载页面时，要注意插入页面图像的路径，如果不能正确设置图像的位置，浏览器无法加载图片，图像标签就会显示一个破碎的图片。 <h2>1.7HTML的表格</h2> 本节内容 <ul> <li>HTML表格的基本结构</li> </ul> HTML 表格 <hr> 表格由<code><table></code>标签来定义。每个表格均有若干行（由<code><tr></code>标签定义），每行被分割为若干单元格（由<code><td></code>标签定义）。字母 td 指表格数据（table data），即数据单元格的内容。数据单元格可以包含文本、图片、列表、段落、表单、水平线、表格等等。 <h3>1.7.1HTML 表格的基本结构：</h3> <pre><code><table>…</table>：定义表格 <th>…</th>：定义表格的标题栏（文字加粗） <tr>…</tr>：定义表格的行 <td>…</td>：定义表格的列 </code></pre> <h4>HTML 表格表头单元格</h4> <hr> 　表格的表头单元格使用``标签进行定义。 表格的表头单元格属性主要是一些公共属性，如：align、dir、width、height。 　大多数浏览器会把表头显示为粗体居中的文本 <h4>表格标题</h4> <hr> 在<code><table></code>标签中我们可以使用<code><caption> ... </ caption></code>标签作为标题，并在表的顶部显示出来。 注：此标签在较新版本的HTML / XHTML中已弃用 <table border="1"> <caption> 这是标题 </caption> <tbody> <tr> <td>row 1, column 1</td> <td>row 1, columnn 2</td> </tr> <tr> <td>row 2, column 1</td> <td>row 2, columnn 2</td> </tr> </tbody> </table> <h4>标题HTML表格高度和宽度</h4> <hr> 在<code><table></code>标签中您可以使用width（宽）和height（高）属性设置表格宽度和高度。您可以按像素或可用屏幕区域的百分比来指定表格宽度或高度。 <table border="1" width="400" height="150"> <tbody> <tr> <td>Row 1, Column 1</td> <td>Row 1, Column 2</td> </tr> <tr> <td>Row 2, Column 1</td> <td>Row 2, Column 2</td> </tr> </tbody> </table> <h4>HTML表格背景</h4> <hr> 可以使用以下方法之一设置HTML表格的背景 <ul> <li>bgcolor属性 - 可以为整个表格或仅为一个单元格设置背景颜色。</li> <li>background属性 - 可以为整个表设置背景图像或仅为一个单元设置背景图像。</li> <li>bordercolor属性 - 可以设置边框颜色。</li> </ul> 注：HTML5中不推荐使用bgcolor，background和bordercolor属性。不要使用这些属性。 <table border="1"> <tbody> <tr> <th>Column 1</th> <th>Column 2</th> <th>Column 3</th> </tr> </tbody> </table> 　使用background属性需要提供图像 URL 地址： <table border="1"> <tbody> <tr> <th>Column 1</th> <th>Column 2</th> <th>Column 3</th> </tr> </tbody> </table> <h4>HTML表格空间</h4> <hr> 有以下两个属性，用于调整HTML表格中单元格的空间： <ul> <li>cellspacing属性-定义表格单元格之间的空间</li> <li>cellpadding属性-表示单元格边框与单元格内容之间的距离</li> </ul> <table border="1"> <tbody> <tr> <th>Name</th> <th>Salary</th> </tr> <tr> <td>其琛</td> <td>5000</td> </tr> <tr> <td>曼迪</td> <td>7000</td> </tr> </tbody> </table> <h4>HTML合并单元格(跨行和跨列）</h4> 如果要将两个或多个列合并为一个列，将使用colspan属性 如果要合并两行或更多行，则将使用rowspan属性。 <table border="1"> <tbody> <tr> <th>Column 1</th> <th>Column 2</th> <th>Column 3</th> </tr> <tr> <td rowspan="2">Row 1 Cell 1</td> <td>Row 1 Cell 2</td> <td>Row 1 Cell 3</td> </tr> <tr> <td>Row 2 Cell 2</td> <td>Row 2 Cell 3</td> </tr> <tr> <td colspan="3">Row 3 Cell 1</td> </tr> </tbody> </table> <h4>HTML表格头部、主体、页脚</h4> <hr> 表格可以分为三个部分 - 头部，主体和页脚，如同word文档中页面的页眉、正文、页脚。每个页面保持相同，而正文是表格的主要内容持有者。 头部，主体和页脚的对应的三个标签是： <pre><code><thead> - 创建单独的表头。 <tbody> - 表示表格的主体。 <tfoot> - 创建一个单独的表页脚。 </code></pre> 表可以包含多个<code><tbody></code>元素以指示不同的页面。 但值得注意的是<code><thead></code>和<code><tfoot></code>标签应出现在<code><tbody></code>之前： <table border="1" width="100%"> <thead> <tr> <td colspan="4">This is the head of the table</td> </tr> </thead> <tbody> <tr> <td>Cell 1</td> <td>Cell 2</td> <td>Cell 3</td> <td>Cell 4</td> </tr> </tbody> <tfoot> <tr> <td colspan="4">This is the foot of the table</td> </tr> </tfoot> </table> <h4>HTML表格的嵌套</h4> <hr> 可以在另一个表中使用一个表。可以使用<code><table></code>内的几乎所有标签。 <table border="1" width="100%"> <tbody> <tr> <td> <table border="1" width="100%"> <tbody> <tr> <th>Name</th> <th>Salary</th> </tr> <tr> <td>其琛</td> <td>5000</td> </tr> <tr> <td>曼迪</td> <td>7000</td> </tr> </tbody> </table> </td> </tr> </tbody> </table> 小结 <ul> <li><code><table></code>标签用来向网页中添加表格</li> <li>表格是逐行绘制的。行是由<code><tr></code>元素创建的。</li> <li>每一行都有一定数量的由<code><td></code>元素(表示标题时使用的<code><th></code>元素）表示的单元格</li> <li>可利用rowspan和colspan特性使表格中的单元跨越多行和多列</li> <li>对于长列表，可将列表分为<code><thead></code>、<code><tbody>、<tfoot></code>三个部分</li> </ul> <h2>1.7HTML的表单</h2> 本节内容 <ul> <li>HTML表单与表单元素</li> </ul> <h3>1.7.1HTML表单</h3> <hr> 表单是一个包含表单元素的区域，用来采集用户的信息。 表单元素是允许用户在表单中输入内容，比如：文本域(textarea)、下拉列表、单选框(radio-buttons)、复选框(checkboxes)等等。 表单使用表单标签 <code><form></code> 来设置: <pre><code><form action="数据处理网页"> 表单元素 </form> </code></pre> 每个表单都应该设置action特性，通常还要设置method特性和id特性 action <ul> <li>action特性值是服务器上一个页面的url，这个页面用来接收用户提交表单时的数据。</li> </ul> method <ul> <li>表单的提交可以采用两种方法：get或者post</li> </ul> 使用get方法时表单中的元素的值附加在action特性指定的url末尾 此方法适合于 <ul> <li>短表单例如搜索框</li> <li>只从web服务器上检索数据的情形（不用发送那些要在数据库中添加或者删除的东西）</li> </ul> 使用post方法时 <ul> <li>表单中的值被放在http头部信息中发送。从经验来说如果你的表单存在以下情形应该用post方法</li> <li>允许用户上传文件</li> <li>非常长</li> <li>包含敏感信息</li> <li>向数据库中添加信息或者删除信息</li> </ul> <h3>1.7.2表单元素</h3> <hr> <dt> 表单元素 </dt> <dd> 文本框、按钮、单选、复选、下拉列表、文本域 </dd> 文本框、密码框 <pre><code> <form> <input type="text|password"/> </form> </code></pre> 文本框type=text 密码框为password <hr> **提交按钮input——submit** <pre><code><form> 姓名： <input type="text" value=" " name="myname"/> <input type="submit" value="提交" name="submittn"/> </form> </code></pre> 重置按钮input——reset type：reset <pre><code><form> 爱好： <input type="text"/> <input type="submit" name="确定/> <input type="reset" name="重置"/> </form> </code></pre> <h2>1.8HTML其他标记</h2> 本节内容 </div> </div> </div> </div> </div>  <div id="SOHUCS" sid="1290979624041390080"></div> <script type="text/javascript" src="/views/front/js/chanyan.js"></script>  <div class="youdao-fixed-ad" id="detail_ad_bottom"></div> </div> <div class="col-md-3"> <div class="row" id="ad">  <div id="right-1" class="col-lg-12 col-md-12 col-sm-4 col-xs-4 ad"> <div class="youdao-fixed-ad" id="detail_ad_1"> </div> </div>  <div id="right-2" class="col-lg-12 col-md-12 col-sm-4 col-xs-4 ad"> <div class="youdao-fixed-ad" id="detail_ad_2"></div> </div>  <div id="right-3" class="col-lg-12 col-md-12 col-sm-4 col-xs-4 ad"> <div class="youdao-fixed-ad" id="detail_ad_3"></div> </div> </div> </div> </div> </div> </div> <div class="container"> <h4 class="pt20 mb15 mt0 border-top">你可能感兴趣的:(前端,学习笔记)</h4> <div id="paradigm-article-related"> <div class="recommend-post mb30"> <ul class="widget-links"> <li><a href="/article/1835509897106649088.htm" title="Long类型前后端数据不一致" target="_blank">Long类型前后端数据不一致</a> igotyback <a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a> <div>响应给前端的数据浏览器控制台中response中看到的Long类型的数据是正常的到前端数据不一致前后端数据类型不匹配是一个常见问题，尤其是当后端使用Java的Long类型（64位）与前端JavaScript的Number类型（最大安全整数为2^53-1，即16位）进行数据交互时，很容易出现精度丢失的问题。这是因为JavaScript中的Number类型无法安全地表示超过16位的整数。为了解决这个问</div> </li> <li><a href="/article/1835507248395284480.htm" title="【一起学Rust | 设计模式】习惯语法——使用借用类型作为参数、格式化拼接字符串、构造函数" target="_blank">【一起学Rust | 设计模式】习惯语法——使用借用类型作为参数、格式化拼接字符串、构造函数</a> 广龙宇 <a class="tag" taget="_blank" href="/search/%E4%B8%80%E8%B5%B7%E5%AD%A6Rust/1.htm">一起学Rust</a><a class="tag" taget="_blank" href="/search/%23/1.htm">#</a><a class="tag" taget="_blank" href="/search/Rust%E8%AE%BE%E8%AE%A1%E6%A8%A1%E5%BC%8F/1.htm">Rust设计模式</a><a class="tag" taget="_blank" href="/search/rust/1.htm">rust</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%BC%80%E5%8F%91%E8%AF%AD%E8%A8%80/1.htm">开发语言</a> <div>提示：文章写完后，目录可以自动生成，如何生成可参考右边的帮助文档文章目录前言一、使用借用类型作为参数二、格式化拼接字符串三、使用构造函数总结前言Rust不是传统的面向对象编程语言，它的所有特性，使其独一无二。因此，学习特定于Rust的设计模式是必要的。本系列文章为作者学习《Rust设计模式》的学习笔记以及自己的见解。因此，本系列文章的结构也与此书的结构相同（后续可能会调成结构），基本上分为三个部分</div> </li> <li><a href="/article/1835499615491813376.htm" title="四章-32-点要素的聚合" target="_blank">四章-32-点要素的聚合</a> 彩云飘过 <div>本文基于腾讯课堂老胡的课《跟我学Openlayers--基础实例详解》做的学习笔记，使用的openlayers5.3.xapi。源码见1032.html，对应的官网示例https://openlayers.org/en/latest/examples/cluster.htmlhttps://openlayers.org/en/latest/examples/earthquake-clusters.</div> </li> <li><a href="/article/1835498925755297792.htm" title="DIV+CSS+JavaScript技术制作网页（旅游主题网页设计与制作）云南大理" target="_blank">DIV+CSS+JavaScript技术制作网页（旅游主题网页设计与制作）云南大理</a> STU学生网页设计 <a class="tag" taget="_blank" href="/search/%E7%BD%91%E9%A1%B5%E8%AE%BE%E8%AE%A1/1.htm">网页设计</a><a class="tag" taget="_blank" href="/search/%E6%9C%9F%E6%9C%AB%E7%BD%91%E9%A1%B5%E4%BD%9C%E4%B8%9A/1.htm">期末网页作业</a><a class="tag" taget="_blank" href="/search/html%E9%9D%99%E6%80%81%E7%BD%91%E9%A1%B5/1.htm">html静态网页</a><a class="tag" taget="_blank" href="/search/html5%E6%9C%9F%E6%9C%AB%E5%A4%A7%E4%BD%9C%E4%B8%9A/1.htm">html5期末大作业</a><a class="tag" taget="_blank" href="/search/%E7%BD%91%E9%A1%B5%E8%AE%BE%E8%AE%A1/1.htm">网页设计</a><a class="tag" taget="_blank" href="/search/web%E5%A4%A7%E4%BD%9C%E4%B8%9A/1.htm">web大作业</a> <div>️精彩专栏推荐作者主页:【进入主页—获取更多源码】web前端期末大作业：【HTML5网页期末作业(1000套)】程序员有趣的告白方式：【HTML七夕情人节表白网页制作(110套)】文章目录二、网站介绍三、网站效果▶️1.视频演示2.图片演示四、网站代码HTML结构代码CSS样式代码五、更多源码二、网站介绍网站布局方面：计划采用目前主流的、能兼容各大主流浏览器、显示效果稳定的浮动网页布局结构。网站程</div> </li> <li><a href="/article/1835497792265613312.htm" title="【加密社】Solidity 中的事件机制及其应用" target="_blank">【加密社】Solidity 中的事件机制及其应用</a> 加密社 <a class="tag" taget="_blank" href="/search/%E9%97%B2%E4%BE%83/1.htm">闲侃</a><a class="tag" taget="_blank" href="/search/%E5%8C%BA%E5%9D%97%E9%93%BE/1.htm">区块链</a><a class="tag" taget="_blank" href="/search/%E6%99%BA%E8%83%BD%E5%90%88%E7%BA%A6/1.htm">智能合约</a><a class="tag" taget="_blank" href="/search/%E5%8C%BA%E5%9D%97%E9%93%BE/1.htm">区块链</a> <div>加密社引言在Solidity合约开发过程中，事件（Events）是一种非常重要的机制。它们不仅能够让开发者记录智能合约的重要状态变更，还能够让外部系统（如前端应用）监听这些状态的变化。本文将详细介绍Solidity中的事件机制以及如何利用不同的手段来触发、监听和获取这些事件。事件存储的地方当我们在Solidity合约中使用emit关键字触发事件时，该事件会被记录在区块链的交易收据中。具体而言，事件</div> </li> <li><a href="/article/1835496149843275776.htm" title="关于城市旅游的HTML网页设计——(旅游风景云南 5页)HTML+CSS+JavaScript" target="_blank">关于城市旅游的HTML网页设计——(旅游风景云南 5页)HTML+CSS+JavaScript</a> 二挡起步 <a class="tag" taget="_blank" href="/search/web%E5%89%8D%E7%AB%AF%E6%9C%9F%E6%9C%AB%E5%A4%A7%E4%BD%9C%E4%B8%9A/1.htm">web前端期末大作业</a><a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a><a class="tag" taget="_blank" href="/search/html/1.htm">html</a><a class="tag" taget="_blank" href="/search/css/1.htm">css</a><a class="tag" taget="_blank" href="/search/%E6%97%85%E6%B8%B8/1.htm">旅游</a><a class="tag" taget="_blank" href="/search/%E9%A3%8E%E6%99%AF/1.htm">风景</a> <div>⛵源码获取文末联系✈Web前端开发技术描述网页设计题材，DIV+CSS布局制作,HTML+CSS网页设计期末课程大作业|游景点介绍|旅游风景区|家乡介绍|等网站的设计与制作|HTML期末大学生网页设计作业，Web大学生网页HTML：结构CSS：样式在操作方面上运用了html5和css3，采用了div+css结构、表单、超链接、浮动、绝对定位、相对定位、字体样式、引用视频等基础知识JavaScrip</div> </li> <li><a href="/article/1835496148601761792.htm" title="HTML网页设计制作大作业（div+css）云南我的家乡旅游景点带文字滚动" target="_blank">HTML网页设计制作大作业（div+css）云南我的家乡旅游景点带文字滚动</a> 二挡起步 <a class="tag" taget="_blank" href="/search/web%E5%89%8D%E7%AB%AF%E6%9C%9F%E6%9C%AB%E5%A4%A7%E4%BD%9C%E4%B8%9A/1.htm">web前端期末大作业</a><a class="tag" taget="_blank" href="/search/web%E8%AE%BE%E8%AE%A1%E7%BD%91%E9%A1%B5%E8%A7%84%E5%88%92%E4%B8%8E%E8%AE%BE%E8%AE%A1/1.htm">web设计网页规划与设计</a><a class="tag" taget="_blank" href="/search/html/1.htm">html</a><a class="tag" taget="_blank" href="/search/css/1.htm">css</a><a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a><a class="tag" taget="_blank" href="/search/dreamweaver/1.htm">dreamweaver</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a> <div>Web前端开发技术描述网页设计题材，DIV+CSS布局制作,HTML+CSS网页设计期末课程大作业游景点介绍|旅游风景区|家乡介绍|等网站的设计与制作HTML期末大学生网页设计作业HTML：结构CSS：样式在操作方面上运用了html5和css3，采用了div+css结构、表单、超链接、浮动、绝对定位、相对定位、字体样式、引用视频等基础知识JavaScript：做与用户的交互行为文章目录前端学习路线</div> </li> <li><a href="/article/1835460528621842432.htm" title="语文主题教学学习笔记之87" target="_blank">语文主题教学学习笔记之87</a> 东哥杂谈 <div>“语文主题教学”学习笔记之八十七（0125）今天继续学习小学语文主题教学的实践样态。板块三：教学中体现“书艺”味道。作为四大名著之一的《水浒传》，堪称我国文学宝库之经典。对从《水浒传》中摘选的单元，教师就要了解其原生态，即评书体特点。这也要求教师要了解一些常用的评书行话术语，然后在教学时适时地加入一些，让学生体味其文本中原有的特色。学生也要尽可能地通过朗读的方式，而不单是分析讲解的方式进行学习。细</div> </li> <li><a href="/article/1835448238103162880.htm" title="springboot+vue项目实战一-创建SpringBoot简单项目" target="_blank">springboot+vue项目实战一-创建SpringBoot简单项目</a> 苹果酱0567 <a class="tag" taget="_blank" href="/search/%E9%9D%A2%E8%AF%95%E9%A2%98%E6%B1%87%E6%80%BB%E4%B8%8E%E8%A7%A3%E6%9E%90/1.htm">面试题汇总与解析</a><a class="tag" taget="_blank" href="/search/spring/1.htm">spring</a><a class="tag" taget="_blank" href="/search/boot/1.htm">boot</a><a class="tag" taget="_blank" href="/search/%E5%90%8E%E7%AB%AF/1.htm">后端</a><a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/%E4%B8%AD%E9%97%B4%E4%BB%B6/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>这段时间抽空给女朋友搭建一个个人博客，想着记录一下建站的过程，就当做笔记吧。虽然复制zjblog只要一个小时就可以搞定一个网站，或者用cms系统，三四个小时就可以做出一个前后台都有的网站，而且想做成啥样也都行。但是就是要从新做，自己做的意义不一样，更何况，俺就是专门干这个的，嘿嘿嘿要做一个网站，而且从零开始，首先呢就是技术选型了，经过一番思量决定选择-SpringBoot做后端，前端使用Vue做一</div> </li> <li><a href="/article/1835437775344726016.htm" title="博客网站制作教程" target="_blank">博客网站制作教程</a> 2401_85194651 <a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/maven/1.htm">maven</a> <div>首先就是技术框架：后端：Java+SpringBoot数据库：MySQL前端：Vue.js数据库连接：JPA(JavaPersistenceAPI)1.项目结构blog-app/├──backend/│├──src/main/java/com/example/blogapp/││├──BlogApplication.java││├──config/│││└──DatabaseConfig.java</div> </li> <li><a href="/article/1835429927567060992.htm" title="《转介绍方法论》学习笔记" target="_blank">《转介绍方法论》学习笔记</a> 小可乐的妈妈 <div>一、高效转介绍的流程：价值观---执行----方案一）转介绍发生的背景：1、对象：谁向谁转介绍？全员营销，人人参与。①员工的激励政策、客户的转介绍诱因制作客户画像：a信任；支付能力；意愿度；便利度（根据家长具备四个特征的个数分为四类）B性格分类C职业分类D年龄性别②执行：套路，策略，方法，流程2、诱因：为什么要转介绍？认同信任；多方共赢；传递美好；零风险承诺打动人心，超越期待。选择做教育，就是选择</div> </li> <li><a href="/article/1835429581205630976.htm" title="JAVA学习笔记之23种设计模式学习" target="_blank">JAVA学习笔记之23种设计模式学习</a> victorfreedom <a class="tag" taget="_blank" href="/search/Java%E6%8A%80%E6%9C%AF/1.htm">Java技术</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/android/1.htm">android</a><a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/%E5%B8%B8%E7%94%A8%E8%AE%BE%E8%AE%A1%E6%A8%A1%E5%BC%8F/1.htm">常用设计模式</a> <div>博主最近买了《设计模式》这本书来学习，无奈这本书是以C++语言为基础进行说明，整个学习流程下来效率不是很高，虽然有的设计模式通俗易懂，但感觉还是没有充分的掌握了所有的设计模式。于是博主百度了一番，发现有大神写过了这方面的问题，于是博主迅速拿来学习。一、设计模式的分类总体来说设计模式分为三大类：创建型模式，共五种：工厂方法模式、抽象工厂模式、单例模式、建造者模式、原型模式。结构型模式，共七种：适配器</div> </li> <li><a href="/article/1835428317084348416.htm" title="最简单将静态网页挂载到服务器上(不用nginx)" target="_blank">最简单将静态网页挂载到服务器上(不用nginx)</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/nginx/1.htm">nginx</a><a class="tag" taget="_blank" href="/search/%E8%BF%90%E7%BB%B4/1.htm">运维</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/html/1.htm">html</a><a class="tag" taget="_blank" href="/search/%E7%AC%94%E8%AE%B0/1.htm">笔记</a> <div>最简单将静态网页挂载到服务器上(不用nginx)如果随便弄个静态网页挂在服务器都要用nignx就太麻烦了，所以直接使用Apache来搭建一些简单前端静态网页会相对方便很多检查Web服务器服务状态：sudosystemctlstatushttpd#ApacheWeb服务器如果发现没有安装web服务器：安装Apache：sudoyuminstallhttpd启动Apache：sudosystemctl</div> </li> <li><a href="/article/1835427057752961024.htm" title="补充元象二面" target="_blank">补充元象二面</a> Redstone Monstrosity <a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/%E9%9D%A2%E8%AF%95/1.htm">面试</a> <div>1.请尽可能详细地说明，防抖和节流的区别，应用场景？你的回答中不要写出示例代码。防抖（Debounce）和节流（Throttle）是两种常用的前端性能优化技术，它们的主要区别在于如何处理高频事件的触发。以下是防抖和节流的区别和应用场景的详细说明：防抖和节流的定义防抖：在一段时间内，多次执行变为只执行最后一次。防抖的原理是，当事件被触发后，设置一个延迟定时器。如果在这个延迟时间内事件再次被触发，则重</div> </li> <li><a href="/article/1835420753252675584.htm" title="微信小程序开发注意事项" target="_blank">微信小程序开发注意事项</a> jun778895 <a class="tag" taget="_blank" href="/search/%E5%BE%AE%E4%BF%A1%E5%B0%8F%E7%A8%8B%E5%BA%8F/1.htm">微信小程序</a><a class="tag" taget="_blank" href="/search/%E5%B0%8F%E7%A8%8B%E5%BA%8F/1.htm">小程序</a> <div>微信小程序开发是一个融合了前端开发、用户体验设计、后端服务（可选）以及微信小程序平台特性的综合性项目。这里，我将详细介绍一个典型的小程序开发项目的全过程，包括项目规划、设计、开发、测试及部署上线等各个环节，并尽量使内容达到或超过2000字的要求。一、项目规划1.1项目背景与目标假设我们要开发一个名为“智慧校园助手”的微信小程序，旨在为学生提供一站式校园生活服务，包括课程表查询、图书馆座位预约、食堂</div> </li> <li><a href="/article/1835411044768509952.htm" title="字节二面" target="_blank">字节二面</a> Redstone Monstrosity <a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/%E9%9D%A2%E8%AF%95/1.htm">面试</a> <div>1.假设你是正在面试前端开发工程师的候选人，面试官让你详细说出你上一段实习过程的收获和感悟。在上一段实习过程中，我获得了宝贵的实践经验和深刻的行业洞察，以下是我的主要收获和感悟：一、专业技能提升框架应用熟练度：通过实际项目，我深入掌握了React、Vue等前端框架的使用，不仅提升了编码效率，还学会了如何根据项目需求选择合适的框架。问题解决能力：在实习期间，我遇到了许多预料之外的技术难题。通过查阅文</div> </li> <li><a href="/article/1835406006264360960.htm" title="新能源汽车 BMS 学习笔记篇—BMS 基本定义及分类" target="_blank">新能源汽车 BMS 学习笔记篇—BMS 基本定义及分类</a> WPG大大通 <a class="tag" taget="_blank" href="/search/%E5%85%B6%E4%BB%96/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/%E6%B1%BD%E8%BD%A6/1.htm">汽车</a><a class="tag" taget="_blank" href="/search/BMS/1.htm">BMS</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/%E6%96%B0%E8%83%BD%E6%BA%90/1.htm">新能源</a><a class="tag" taget="_blank" href="/search/%E7%94%B5%E6%B1%A0/1.htm">电池</a> <div>一、BMS定义1、概念：BMS（BatteryManagementSystem）即电池管理系统，其管理对象是二次电池（充电电池或蓄电池），其主要目的是电池的利用率，防止电池出现过度充电和过度放电，可应用于电动汽车、电瓶车、机器人、无人机等图片来源：腾讯网https://new.qq.com《标准普尔警告，电动汽车电池生产面临供应链和地缘政治风险》2、四大功能①感知和测量：检测电池的电压、电流、温度</div> </li> <li><a href="/article/1835398064727224320.htm" title="前端代码上传文件" target="_blank">前端代码上传文件</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><a class="tag" taget="_blank" href="/search/%E5%BC%80%E5%8F%91%E8%AF%AD%E8%A8%80/1.htm">开发语言</a> <div>点击上传文件import{ElNotification}from'element-plus'import{API_CONFIG}from'../config/index.js'import{UploadFilled}from'@element-plus/icons-vue'import{reactive}from'vue'import{BASE_URL}from'../config/index'i</div> </li> <li><a href="/article/1835385458356482048.htm" title="uniapp实现动态标记效果详细步骤【前端开发】" target="_blank">uniapp实现动态标记效果详细步骤【前端开发】</a> 2401_85123349 <a class="tag" taget="_blank" href="/search/uni-app/1.htm">uni-app</a> <div>第二个点在于实现将已经被用户标记的内容在下一次获取后刷新它的状态为已标记。这是什么意思呢？比如说上面gif图中的这些人物对象，有一些已被该用户添加为关心，那么当用户下一次进入该页面时，这些已经被添加关心的对象需要以“红心”状态显现出来。这个点的难度还不算大，只需要在每一次获取后端的内容后对标记对象进行状态更新即可。II.动态标记效果实现思路和步骤首先，整体的思路是利用动态类名对不同的元素进行选择。</div> </li> <li><a href="/article/1835373236217540608.htm" title="360前端星计划-动画可以这么玩" target="_blank">360前端星计划-动画可以这么玩</a> 马小蜗 <div>动画的基本原理定时器改变对象的属性根据新的属性重新渲染动画functionupdate(context){//更新属性}constticker=newTicker();ticker.tick(update,context);动画的种类1、JavaScript动画操作DOMCanvas2、CSS动画transitionanimation3、SVG动画SMILJS动画的优缺点优点：灵活度、可控性、性能</div> </li> <li><a href="/article/1835368019430305792.htm" title="Vue + Express实现一个表单提交" target="_blank">Vue + Express实现一个表单提交</a> 九旬大爷的梦 <div>最近在折腾一个cms系统，用的vue+express，但是就一个表单提交就弄了好久，记录一下。环境：Node10+前端：Vue服务端：Express依赖包：vueexpressaxiosexpress-formidableelement-ui（可选）前言：axiosget请求参数是：paramsaxiospost请求参数是：dataexpressget接受参数是req.queryexpresspo</div> </li> <li><a href="/article/1835362538016043008.htm" title="吴恩达深度学习笔记(30)-正则化的解释" target="_blank">吴恩达深度学习笔记(30)-正则化的解释</a> 极客Array <div>正则化（Regularization）深度学习可能存在过拟合问题——高方差，有两个解决方法，一个是正则化，另一个是准备更多的数据，这是非常可靠的方法，但你可能无法时时刻刻准备足够多的训练数据或者获取更多数据的成本很高，但正则化通常有助于避免过拟合或减少你的网络误差。如果你怀疑神经网络过度拟合了数据，即存在高方差问题，那么最先想到的方法可能是正则化，另一个解决高方差的方法就是准备更多数据，这也是非常</div> </li> <li><a href="/article/1835356591562518528.htm" title="个人学习笔记7-6：动手学深度学习pytorch版-李沐" target="_blank">个人学习笔记7-6：动手学深度学习pytorch版-李沐</a> 浪子L <a class="tag" taget="_blank" href="/search/%E6%B7%B1%E5%BA%A6%E5%AD%A6%E4%B9%A0/1.htm">深度学习</a><a class="tag" taget="_blank" href="/search/%E6%B7%B1%E5%BA%A6%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/%E8%AE%A1%E7%AE%97%E6%9C%BA%E8%A7%86%E8%A7%89/1.htm">计算机视觉</a><a class="tag" taget="_blank" href="/search/python/1.htm">python</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/%E7%A5%9E%E7%BB%8F%E7%BD%91%E7%BB%9C/1.htm">神经网络</a><a class="tag" taget="_blank" href="/search/pytorch/1.htm">pytorch</a> <div>#人工智能##深度学习##语义分割##计算机视觉##神经网络#计算机视觉13.11全卷积网络全卷积网络（fullyconvolutionalnetwork，FCN）采用卷积神经网络实现了从图像像素到像素类别的变换。引入l转置卷积（transposedconvolution）实现的，输出的类别预测与输入图像在像素级别上具有一一对应关系：通道维的输出即该位置对应像素的类别预测。13.11.1构造模型下</div> </li> <li><a href="/article/1835354447627251712.htm" title="前端知识点" target="_blank">前端知识点</a> ZhangTao_zata <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><a class="tag" taget="_blank" href="/search/css/1.htm">css</a> <div>下面是一个最基本的html代码body{font-family:Arial,sans-serif;margin:20px;}//JavaScriptfunctionthatdisplaysanalertwhencalledfunctionshowMessage(){alert("Hello!Youclickedthebutton.");}MyFirstHTMLPageWelcometoMyPage</div> </li> <li><a href="/article/1835352325032603648.htm" title="第三十一节:Vue路由:前端路由vs后端路由的了解" target="_blank">第三十一节:Vue路由:前端路由vs后端路由的了解</a> 曹老师 <div>1.认识前端路由和后端路由前端路由相对于后端路由而言的,在理解前端路由之前先对于路由有一个基本的了解路由:简而言之,就是把信息从原地址传输到目的地的活动对于我们来说路由就是:根据不同的url地址展示不同的页面内容1.1后端路由以前咱们接触比较多的后端路由,当改变url地址时,浏览器会向服务器发送请求,服务器根据这个url,返回不同的资源内容后端路由的特点就是前端每次跳转到不同url地址,都会重新访</div> </li> <li><a href="/article/1835350917352878080.htm" title="华雁智科前端面试题" target="_blank">华雁智科前端面试题</a> 因为奋斗超太帅啦 <a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF%E7%AC%94%E8%AF%95%E9%9D%A2%E8%AF%95%E9%97%AE%E9%A2%98%E6%95%B4%E7%90%86/1.htm">前端笔试面试问题整理</a><a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</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/ecmascript/1.htm">ecmascript</a> <div>1.var变量的提升题目：vara=1functionfun(){console.log(b)varb=2}fun()console.log(a)正确输出结果：undefined、1答错了，给一个大嘴巴子，错误答案输出结果为：2,1此题主要考察var定义的变量，作用域提升的问题，相当于varaa=1functionfun(){varbconsole.log(b)b=2}fun()console.l</div> </li> <li><a href="/article/1835350535818014720.htm" title="如何建设数据中台（五）——数据汇集—打破企业数据孤岛" target="_blank">如何建设数据中台（五）——数据汇集—打破企业数据孤岛</a> weixin_47088026 <a class="tag" taget="_blank" href="/search/%E5%AD%A6%E4%B9%A0%E8%AE%B0%E5%BD%95%E5%92%8C%E6%80%BB%E7%BB%93/1.htm">学习记录和总结</a><a class="tag" taget="_blank" href="/search/%E4%B8%AD%E5%8F%B0/1.htm">中台</a><a class="tag" taget="_blank" href="/search/%E6%95%B0%E6%8D%AE%E4%B8%AD%E5%8F%B0/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><a class="tag" taget="_blank" href="/search/%E7%BB%8F%E9%AA%8C%E5%88%86%E4%BA%AB/1.htm">经验分享</a> <div>数据汇集——打破企业数据孤岛要构建企业级数据中台，第一步就是将企业内部各个业务系统的数据实现互通互联，打破数据孤岛，主要通过数据汇聚和交换来实现。企业采集的数据可以是线上采集、线下数据采集、互联网数据采集、内部数据采集等。线上数据采集主要载体分为互联网和移动互联网两种，对应有系统平台、网页、H5、小程序、App等，可以采用前端或后端埋点方式采集数据。线下数据采集主要是通过硬件来采集，例如：WiFi</div> </li> <li><a href="/article/1835343473629294592.htm" title="分布式锁和spring事务管理" target="_blank">分布式锁和spring事务管理</a> 暴躁的鱼 <a class="tag" taget="_blank" href="/search/%E9%94%81%E5%8F%8A%E4%BA%8B%E5%8A%A1/1.htm">锁及事务</a><a class="tag" taget="_blank" href="/search/%E5%88%86%E5%B8%83%E5%BC%8F/1.htm">分布式</a><a class="tag" taget="_blank" href="/search/spring/1.htm">spring</a><a class="tag" taget="_blank" href="/search/java/1.htm">java</a> <div>最近开发一个小程序遇到一个需求需要实现分布式事务管理业务需求用户在使用小程序的过程中可以查看景点，对景点地区或者城市标记是否想去，那么需要统计一个地点被标记的人数，以及记录某个用户对某个地点是否标记为想去，用两个表存储数据，一个地点表记录改地点被标记的次数，一个用户意向表记录某个用户对某个地点是否标记为想去。由于可能有多个用户同时标记一个地点，每个用户在前端点击想去按钮之后，后台接收到请求，从数据</div> </li> <li><a href="/article/1835340577596600320.htm" title="前端CSS面试常见题" target="_blank">前端CSS面试常见题</a> 剑亦未配妥 <a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF%E9%9D%A2%E8%AF%95/1.htm">前端面试</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/css/1.htm">css</a><a class="tag" taget="_blank" href="/search/%E9%9D%A2%E8%AF%95/1.htm">面试</a> <div>边界塌陷盒模型有两种：W3C盒模型和IE盒模型，区别在于宽度是否包含边框定义：同时给兄弟/父子盒模型设置上下边距，理论上边距值是两者之和，实际上不是注意：浮动和定位不会产生边界塌陷；只有块级元素垂直方向才会产生margin合并margin计算方案margin同为正负：取绝对值大的值一正一负：求和父子元素边界塌陷解决父元素可以通过调整padding处理；设置overflowhidden，触发BFC子</div> </li> <li><a href="/article/1835331376895848448.htm" title="【JS】前端文件读取FileReader操作总结" target="_blank">【JS】前端文件读取FileReader操作总结</a> 程序员-张师傅 <a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a><a class="tag" taget="_blank" href="/search/%E5%BC%80%E5%8F%91%E8%AF%AD%E8%A8%80/1.htm">开发语言</a> <div>前端文件读取FileReader操作总结FileReader是JavaScript中的一个WebAPI，它允许web应用程序异步读取用户计算机上的文件（或原始数据缓冲区）的内容，例如读取文件以获取其内容，并在不将文件发送到服务器的情况下在客户端使用它。这对于处理图片、文本文件等非常有用，尤其是当你想要在用户界面中即时显示文件内容或进行文件预览时。创建FileReader对象首先，你需要创建一个Fi</div> </li> <li><a href="/article/85.htm" title="ztree异步加载" target="_blank">ztree异步加载</a> 3213213333332132 <a class="tag" taget="_blank" href="/search/JavaScript/1.htm">JavaScript</a><a class="tag" taget="_blank" href="/search/Ajax/1.htm">Ajax</a><a class="tag" taget="_blank" href="/search/json/1.htm">json</a><a class="tag" taget="_blank" href="/search/Web/1.htm">Web</a><a class="tag" taget="_blank" href="/search/ztree/1.htm">ztree</a> <div>相信新手用ztree的时候,对异步加载会有些困惑，我开始的时候也是看了API花了些时间才搞定了异步加载，在这里分享给大家。我后台代码生成的是json格式的数据，数据大家按各自的需求生成，这里只给出前端的代码。设置setting，这里只关注async属性的配置 var setting = { //异步加载配置 </div> </li> <li><a href="/article/212.htm" title="thirft rpc 具体调用流程" target="_blank">thirft rpc 具体调用流程</a> BlueSkator <a class="tag" taget="_blank" href="/search/%E4%B8%AD%E9%97%B4%E4%BB%B6/1.htm">中间件</a><a class="tag" taget="_blank" href="/search/rpc/1.htm">rpc</a><a class="tag" taget="_blank" href="/search/thrift/1.htm">thrift</a> <div>Thrift调用过程中，Thrift客户端和服务器之间主要用到传输层类、协议层类和处理类三个主要的核心类，这三个类的相互协作共同完成rpc的整个调用过程。在调用过程中将按照以下顺序进行协同工作：（1）将客户端程序调用的函数名和参数传递给协议层（TProtocol），协议</div> </li> <li><a href="/article/339.htm" title="异或运算推导, 交换数据" target="_blank">异或运算推导, 交换数据</a> dcj3sjt126com <a class="tag" taget="_blank" href="/search/PHP/1.htm">PHP</a><a class="tag" taget="_blank" href="/search/%E5%BC%82%E6%88%96/1.htm">异或</a><a class="tag" taget="_blank" href="/search/%5E/1.htm">^</a> <div>/* * 5 0101 * 9 1010 * * 5 ^ 5 * 0101 * 0101 * ----- * 0000 * 得出第一个规律: 相同的数进行异或, 结果是0 * * 9 ^ 5 ^ 6 * 1010 * 0101 * ---- * 1111 * * 1111 * 0110 * ---- * 1001 </div> </li> <li><a href="/article/466.htm" title="事件源对象" target="_blank">事件源对象</a> 周华华 <a class="tag" taget="_blank" href="/search/JavaScript/1.htm">JavaScript</a> <div><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml&q</div> </li> <li><a href="/article/593.htm" title="MySql配置及相关命令" target="_blank">MySql配置及相关命令</a> g21121 <a class="tag" taget="_blank" href="/search/mysql/1.htm">mysql</a> <div> MySQL安装完毕后我们需要对它进行一些设置及性能优化，主要包括字符集设置，启动设置，连接优化，表优化，分区优化等等。一修改MySQL密码及用户 </div> </li> <li><a href="/article/720.htm" title="[简单]poi删除excel 2007超链接" target="_blank">[简单]poi删除excel 2007超链接</a> 53873039oycg <a class="tag" taget="_blank" href="/search/Excel/1.htm">Excel</a> <div> 采用解析sheet.xml方式删除超链接，缺点是要打开文件2次,代码如下: public void removeExcel2007AllHyperLink(String filePath) throws Exception { OPCPackage ocPkg = OPCPac</div> </li> <li><a href="/article/847.htm" title="Struts2添加 open flash chart" target="_blank">Struts2添加 open flash chart</a> 云端月影 <div>准备以下开源项目： 1. Struts 2.1.6 2. Open Flash Chart 2 Version 2 Lug Wyrm Charmer (28th, July 2009) 3. jofc2，这东西不知道是没做好还是什么意思，好像和ofc2不怎么匹配，最好下源码，有什么问题直接改。 4. log4j 用eclipse新建动态网站，取名OFC2Demo，将Struts2 l</div> </li> <li><a href="/article/974.htm" title="spring包详解" target="_blank">spring包详解</a> aijuans <a class="tag" taget="_blank" href="/search/spring/1.htm">spring</a> <div> 下载的spring包中文件及各种包众多，在项目中往往只有部分是我们必须的，如果不清楚什么时候需要什么包的话，看看下面就知道了。 aspectj目录下是在Spring框架下使用aspectj的源代码和测试程序文件。Aspectj是java最早的提供AOP的应用框架。 dist 目录下是Spring 的发布包，关于发布包下面会详细进行说明。 docs&nb</div> </li> <li><a href="/article/1101.htm" title="网站推广之seo概念" target="_blank">网站推广之seo概念</a> antonyup_2006 <a class="tag" taget="_blank" href="/search/%E7%AE%97%E6%B3%95/1.htm">算法</a><a class="tag" taget="_blank" href="/search/Web/1.htm">Web</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><a class="tag" taget="_blank" href="/search/%E6%90%9C%E7%B4%A2%E5%BC%95%E6%93%8E/1.htm">搜索引擎</a><a class="tag" taget="_blank" href="/search/Google/1.htm">Google</a> <div> 持续开发一年多的b2c网站终于在08年10月23日上线了。作为开发人员的我在修改bug的同时，准备了解下网站的推广分析策略。所谓网站推广，目的在于让尽可能多的潜在用户了解并访问网站，通过网站获得有关产品和服务等信息，为最终形成购买决策提供支持。网站推广策略有很多，seo，email，adv</div> </li> <li><a href="/article/1228.htm" title="单例模式,sql注入,序列" target="_blank">单例模式,sql注入,序列</a> 百合不是茶 <a class="tag" taget="_blank" href="/search/%E5%8D%95%E4%BE%8B%E6%A8%A1%E5%BC%8F/1.htm">单例模式</a><a class="tag" taget="_blank" href="/search/%E5%BA%8F%E5%88%97/1.htm">序列</a><a class="tag" taget="_blank" href="/search/sql%E6%B3%A8%E5%85%A5/1.htm">sql注入</a><a class="tag" taget="_blank" href="/search/%E9%A2%84%E7%BC%96%E8%AF%91/1.htm">预编译</a> <div> 序列在前面写过有关的博客,也有过总结,但是今天在做一个JDBC操作数据库的相关内容时需要使用序列创建一个自增长的字段居然不会了,所以将序列写在本篇的前面 1,序列是一个保存数据连续的增长的一种方式; 序列的创建; CREATE SEQUENCE seq_pro 2 INCREMENT BY 1 -- 每次加几个 3 </div> </li> <li><a href="/article/1355.htm" title="Mockito单元测试实例" target="_blank">Mockito单元测试实例</a> bijian1013 <a class="tag" taget="_blank" href="/search/%E5%8D%95%E5%85%83%E6%B5%8B%E8%AF%95/1.htm">单元测试</a><a class="tag" taget="_blank" href="/search/mockito/1.htm">mockito</a> <div>Mockito单元测试实例： public class SettingServiceTest { private List<PersonDTO> personList = new ArrayList<PersonDTO>(); @InjectMocks private SettingPojoService settin</div> </li> <li><a href="/article/1482.htm" title="精通Oracle10编程SQL(9)使用游标" target="_blank">精通Oracle10编程SQL(9)使用游标</a> bijian1013 <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>/* *使用游标 */ --显示游标 --在显式游标中使用FETCH...INTO语句 DECLARE CURSOR emp_cursor is select ename,sal from emp where deptno=1; v_ename emp.ename%TYPE; v_sal emp.sal%TYPE; begin ope</div> </li> <li><a href="/article/1609.htm" title="【Java语言】动态代理" target="_blank">【Java语言】动态代理</a> bit1129 <a class="tag" taget="_blank" href="/search/java%E8%AF%AD%E8%A8%80/1.htm">java语言</a> <div> JDK接口动态代理 JDK自带的动态代理通过动态的根据接口生成字节码(实现接口的一个具体类)的方式，为接口的实现类提供代理。被代理的对象和代理对象通过InvocationHandler建立关联 package com.tom; import com.tom.model.User; import com.tom.service.IUserService; </div> </li> <li><a href="/article/1736.htm" title="Java通信之URL通信基础" target="_blank">Java通信之URL通信基础</a> 白糖_ <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/webservice/1.htm">webservice</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/ITeye/1.htm">ITeye</a> <div>java对网络通信以及提供了比较全面的jdk支持，java.net包能让程序员直接在程序中实现网络通信。在技术日新月异的现在，我们能通过很多方式实现数据通信，比如webservice、url通信、socket通信等等，今天简单介绍下URL通信。学习准备：建议首先学习java的IO基础知识 URL是统一资源定位器的简写，URL可以访问Internet和www，可以通过url</div> </li> <li><a href="/article/1863.htm" title="博弈Java讲义 - Java线程同步 (1)" target="_blank">博弈Java讲义 - Java线程同步 (1)</a> boyitech <a class="tag" taget="_blank" href="/search/java/1.htm">java</a><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/%E5%90%8C%E6%AD%A5/1.htm">同步</a><a class="tag" taget="_blank" href="/search/%E9%94%81/1.htm">锁</a> <div> 在并发编程中经常会碰到多个执行线程共享资源的问题。例如多个线程同时读写文件，共用数据库连接，全局的计数器等。如果不处理好多线程之间的同步问题很容易引起状态不一致或者其他的错误。同步不仅可以阻止一个线程看到对象处于不一致的状态，它还可以保证进入同步方法或者块的每个线程，都看到由同一锁保护的之前所有的修改结果。处理同步的关键就是要正确的识别临界条件（cri</div> </li> <li><a href="/article/1990.htm" title="java-给定字符串，删除开始和结尾处的空格，并将中间的多个连续的空格合并成一个。" target="_blank">java-给定字符串，删除开始和结尾处的空格，并将中间的多个连续的空格合并成一个。</a> bylijinnan <a class="tag" taget="_blank" href="/search/java/1.htm">java</a> <div> public class DeleteExtraSpace { /** * 题目：给定字符串，删除开始和结尾处的空格，并将中间的多个连续的空格合并成一个。 * 方法1.用已有的String类的trim和replaceAll方法 * 方法2.全部用正则表达式，这个我不熟 * 方法3.“重新发明轮子”，从头遍历一次 */ public static v</div> </li> <li><a href="/article/2117.htm" title="An error has occurred.See the log file错误解决！" target="_blank">An error has occurred.See the log file错误解决！</a> Kai_Ge <a class="tag" taget="_blank" href="/search/MyEclipse/1.htm">MyEclipse</a> <div>今天早上打开MyEclipse时，自动关闭！弹出An error has occurred.See the log file错误提示！很郁闷昨天启动和关闭还好着！！！打开几次依然报此错误，确定不是眼花了！打开日志文件！找到当日错误文件内容： --------------------------------------------------------------------------</div> </li> <li><a href="/article/2244.htm" title="[矿业与工业]修建一个空间矿床开采站要多少钱?" target="_blank">[矿业与工业]修建一个空间矿床开采站要多少钱?</a> comsci <div> 地球上的钛金属矿藏已经接近枯竭........... 我们在冥王星的一颗卫星上面发现一些具有开采价值的矿床..... 那么,现在要编制一个预算,提交给财政部门..</div> </li> <li><a href="/article/2371.htm" title="解析Google Map Routes" target="_blank">解析Google Map Routes</a> dai_lm <a class="tag" taget="_blank" href="/search/google+api/1.htm">google api</a> <div>为了获得从A点到B点的路劲，经常会使用Google提供的API，例如 [url] http://maps.googleapis.com/maps/api/directions/json?origin=40.7144,-74.0060&destination=47.6063,-122.3204&sensor=false [/url] 从返回的结果上，大致可以了解应该怎么走，但</div> </li> <li><a href="/article/2498.htm" title="SQL还有多少“理所应当”？" target="_blank">SQL还有多少“理所应当”？</a> datamachine <a class="tag" taget="_blank" href="/search/sql/1.htm">sql</a> <div>转贴存档，原帖地址：http://blog.chinaunix.net/uid-29242841-id-3968998.html、http://blog.chinaunix.net/uid-29242841-id-3971046.html！ ------------------------------------华丽的分割线-------------------------------- </div> </li> <li><a href="/article/2625.htm" title="Yii使用Ajax验证时，如何设置某些字段不需要验证" target="_blank">Yii使用Ajax验证时，如何设置某些字段不需要验证</a> dcj3sjt126com <a class="tag" taget="_blank" href="/search/Ajax/1.htm">Ajax</a><a class="tag" taget="_blank" href="/search/yii/1.htm">yii</a> <div>经常像你注册页面,你可能非常希望只需要Ajax去验证用户名和Email,而不需要使用Ajax再去验证密码,默认如果你使用Yii 内置的ajax验证Form,例如: $form=$this->beginWidget('CActiveForm', array( 'id'=>'usuario-form',&</div> </li> <li><a href="/article/2752.htm" title="使用git同步网站代码" target="_blank">使用git同步网站代码</a> dcj3sjt126com <a class="tag" taget="_blank" href="/search/crontab/1.htm">crontab</a><a class="tag" taget="_blank" href="/search/git/1.htm">git</a> <div>转自:http://ued.ctrip.com/blog/?p=3646?tn=gongxinjun.com 管理一网站，最开始使用的虚拟空间，采用提供商支持的ftp上传网站文件，后换用vps，vps可以自己搭建ftp的，但是懒得搞，直接使用scp传输文件到服务器，现在需要更新文件到服务器，使用scp真的很烦。发现本人就职的公司，采用的git+rsync的方式来管理、同步代码，遂</div> </li> <li><a href="/article/2879.htm" title="sql基本操作" target="_blank">sql基本操作</a> 蕃薯耀 <a class="tag" taget="_blank" href="/search/sql/1.htm">sql</a><a class="tag" taget="_blank" href="/search/sql%E5%9F%BA%E6%9C%AC%E6%93%8D%E4%BD%9C/1.htm">sql基本操作</a><a class="tag" taget="_blank" href="/search/sql%E5%B8%B8%E7%94%A8%E6%93%8D%E4%BD%9C/1.htm">sql常用操作</a> <div>sql基本操作 >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> 蕃薯耀 2015年6月1日 17:30:33 星期一 &</div> </li> <li><a href="/article/3006.htm" title="Spring4+Hibernate4+Atomikos3.3多数据源事务管理" target="_blank">Spring4+Hibernate4+Atomikos3.3多数据源事务管理</a> hanqunfeng <a class="tag" taget="_blank" href="/search/Hibernate4/1.htm">Hibernate4</a> <div>Spring3+后不再对JTOM提供支持，所以可以改用Atomikos管理多数据源事务。Spring2.5+Hibernate3+JTOM参考：http://hanqunfeng.iteye.com/blog/1554251Atomikos官网网站：http://www.atomikos.com/ 一.pom.xml <dependency> <</div> </li> <li><a href="/article/3133.htm" title="jquery中两个值得注意的方法one()和trigger()方法" target="_blank">jquery中两个值得注意的方法one()和trigger()方法</a> jackyrong <a class="tag" taget="_blank" href="/search/trigger/1.htm">trigger</a> <div> 在jquery中，有两个值得注意但容易忽视的方法，分别是one()方法和trigger()方法,这是从国内作者<<jquery权威指南》一书中看到不错的介绍 1） one方法 one方法的功能是让所选定的元素绑定一个仅触发一次的处理函数，格式为 one(type,${data},fn) &nb</div> </li> <li><a href="/article/3260.htm" title="拿工资不仅仅是让你写代码的" target="_blank">拿工资不仅仅是让你写代码的</a> lampcy <a class="tag" taget="_blank" href="/search/%E5%B7%A5%E4%BD%9C/1.htm">工作</a><a class="tag" taget="_blank" href="/search/%E9%9D%A2%E8%AF%95/1.htm">面试</a><a class="tag" taget="_blank" href="/search/%E5%92%A8%E8%AF%A2/1.htm">咨询</a> <div>这是我对团队每个新进员工说的第一件事情。这句话的意思是，我并不关心你是如何快速完成任务的，哪怕代码很差，只要它像救生艇通气门一样管用就行。这句话也是我最喜欢的座右铭之一。这个说法其实很合理：我们的工作是思考客户提出的问题，然后制定解决方案。思考第一，代码第二，公司请我们的最终目的不是写代码，而是想出解决方案。话粗理不粗。付你薪水不是让你来思考的，也不是让你来写代码的，你的目的是交付产品</div> </li> <li><a href="/article/3387.htm" title="架构师之对象操作----------对象的效率复制和判断是否全为空" target="_blank">架构师之对象操作----------对象的效率复制和判断是否全为空</a> nannan408 <a class="tag" taget="_blank" href="/search/%E6%9E%B6%E6%9E%84%E5%B8%88/1.htm">架构师</a> <div>1.前言。如题。 2.代码。 (1)对象的复制，比spring的beanCopier在大并发下效率要高，利用net.sf.cglib.beans.BeanCopier Src src=new Src(); BeanCopier beanCopier = BeanCopier.create(Src.class, Des.class, false); </div> </li> <li><a href="/article/3514.htm" title="ajax 被缓存的解决方案" target="_blank">ajax 被缓存的解决方案</a> Rainbow702 <a class="tag" taget="_blank" href="/search/JavaScript/1.htm">JavaScript</a><a class="tag" taget="_blank" href="/search/jquery/1.htm">jquery</a><a class="tag" taget="_blank" href="/search/Ajax/1.htm">Ajax</a><a class="tag" taget="_blank" href="/search/cache/1.htm">cache</a><a class="tag" taget="_blank" href="/search/%E7%BC%93%E5%AD%98/1.htm">缓存</a> <div>使用jquery的ajax来发送请求进行局部刷新画面，各位可能都做过。今天碰到一个奇怪的现象，就是，同一个ajax请求，在chrome中，不论发送多少次，都可以发送至服务器端，而不会被缓存。但是，换成在IE下的时候，发现，同一个ajax请求，会发生被缓存的情况，只有第一次才会被发送至服务器端，之后的不会再被发送。郁闷。解决方法如下： ① 直接使用 JQuery提供的 “cache”参数，</div> </li> <li><a href="/article/3641.htm" title="修改date.toLocaleString()的警告" target="_blank">修改date.toLocaleString()的警告</a> tntxia <a class="tag" taget="_blank" href="/search/String/1.htm">String</a> <div> 我们在写程序的时候，经常要查看时间，所以我们经常会用到date.toLocaleString()，但是date.toLocaleString()是一个过时的API，代替的方法如下： package com.tntxia.htmlmaker.util; import java.text.SimpleDateFormat; import java.util.</div> </li> <li><a href="/article/3768.htm" title="项目完成后的小总结" target="_blank">项目完成后的小总结</a> xiaomiya <a class="tag" taget="_blank" href="/search/js/1.htm">js</a><a class="tag" taget="_blank" href="/search/%E6%80%BB%E7%BB%93/1.htm">总结</a><a class="tag" taget="_blank" href="/search/%E9%A1%B9%E7%9B%AE/1.htm">项目</a> <div>项目完成了，突然想做个总结但是有点无从下手了。做之前对于客户端给的接口很模式。然而定义好了格式要求就如此的愉快了。先说说项目主要实现的功能吧 1，按键精灵 2，获取行情数据 3，各种input输入条件判断 4，发送数据（有json格式和string格式） 5，获取预警条件列表和预警结果列表， 6，排序， 7，预警结果分页获取 8，导出文件（excel，text等） 9，修</div> </li> </ul> </div> </div> </div> <div> <div class="container"> <div class="indexes"> 按字母分类： <a href="/tags/A/1.htm" target="_blank">A</a><a href="/tags/B/1.htm" target="_blank">B</a><a href="/tags/C/1.htm" target="_blank">C</a><a href="/tags/D/1.htm" target="_blank">D</a><a href="/tags/E/1.htm" target="_blank">E</a><a href="/tags/F/1.htm" target="_blank">F</a><a href="/tags/G/1.htm" target="_blank">G</a><a href="/tags/H/1.htm" target="_blank">H</a><a href="/tags/I/1.htm" target="_blank">I</a><a href="/tags/J/1.htm" target="_blank">J</a><a href="/tags/K/1.htm" target="_blank">K</a><a href="/tags/L/1.htm" target="_blank">L</a><a href="/tags/M/1.htm" target="_blank">M</a><a href="/tags/N/1.htm" target="_blank">N</a><a href="/tags/O/1.htm" target="_blank">O</a><a href="/tags/P/1.htm" target="_blank">P</a><a href="/tags/Q/1.htm" target="_blank">Q</a><a href="/tags/R/1.htm" target="_blank">R</a><a href="/tags/S/1.htm" target="_blank">S</a><a href="/tags/T/1.htm" target="_blank">T</a><a href="/tags/U/1.htm" target="_blank">U</a><a href="/tags/V/1.htm" target="_blank">V</a><a href="/tags/W/1.htm" target="_blank">W</a><a href="/tags/X/1.htm" target="_blank">X</a><a href="/tags/Y/1.htm" target="_blank">Y</a><a href="/tags/Z/1.htm" target="_blank">Z</a><a href="/tags/0/1.htm" target="_blank">其他</a> </div> </div> </div> <footer id="footer" class="mb30 mt30"> <div class="container"> <div class="footBglm"> <a target="_blank" href="/">首页</a> - <a target="_blank" href="/custom/about.htm">关于我们</a> - <a target="_blank" href="/search/Java/1.htm">站内搜索</a> - <a target="_blank" href="/sitemap.txt">Sitemap</a> - <a target="_blank" href="/custom/delete.htm">侵权投诉</a> </div> <div class="copyright">版权所有 IT知识库 CopyRight © 2000-2050 E-COM-NET.COM , All Rights Reserved.  </div> </div> </footer>  <script type="text/javascript" src="/static/syntaxhighlighter/scripts/shCore.js"></script> <script type="text/javascript" src="/static/syntaxhighlighter/scripts/shLegacy.js"></script> <script type="text/javascript" src="/static/syntaxhighlighter/scripts/shAutoloader.js"></script> <link type="text/css" rel="stylesheet" href="/static/syntaxhighlighter/styles/shCoreDefault.css"/> <script type="text/javascript" src="/static/syntaxhighlighter/src/my_start_1.js"></script> </body> </html>