橙子!

【Web前端】一文带你吃透HTML(完整篇)

前端学习路线小总结：

基础入门：
HTML CSS JavaScript
三大主流框架：
VUE REACT Angular
深入学习：
小程序 Node jQuery TypeScript 前端工程化

开始前端之旅吧!

一.HTML简介
- 1.什么是HTML？
- 2.HTML 标签
- 3.HTML 元素
- 4.HTML版本
- 5.Web 浏览器
- 6.HTML 网页结构
- 7.中文编码
- 8.编写第一个网页
二.HTML编辑器
三.HTML基础
- 1.HTML 标题
- 2.HTML 段落
- 3.HTML 链接
- 4.HTML 图像
四.HTML元素
- 1.HTML 元素语法
- 2.嵌套的 HTML 元素
- 3.HTML 空元素
五.HTML属性
六.HTML标题
- 1.HTML标题
- 2.HTML水平线
- 3.HTML 注释
七.HTML段落
- 1.HTML段落
- 2.HTML换行
八.HTML文本格式化
九.HTML链接
十.HTML头部
十一.HTML图像
十二.HTML表格
十三.HTML列表
十四.HTML区块
- 1.HTML区块元素
- 2.HTML内联元素
- 3.HTML的 div 元素
- 4.HTML的 span 元素
十五.HTML布局
- 1.使用div元素添加网页布局
- 2.使用table元素添加网页布局
十六.HTML表单和输入
- 1.文本域
- 2.密码字段
- 3.单选按钮
- 4.复选框
- 5.提交按钮
十七.HTML框架
- 1.iframe语法
- 2.iframe设置高度和宽度
- 3.iframe去除边框
- 4.使用 iframe 来显示目标链接页面
十八.HTML颜色
十九.脚本
- 1.HTML的 script 标签
- 2.HTML的 noscript 标签
二十.字符实体
二十一.URL
- 1.常见的 URL Scheme
二十二.HTML总结

一.HTML简介

万维网W3C标准中网页分为结构，表现和行为三部分，HTML用于描述页面的结构，CSS用于控制页面中的元素样式，JavaScript用于响应用户的操作。HTML，CSS和JavaScript组成了前端技术栈。

学习HTML就是学习标签的一个过程，难度指数低，重在反复练习，首先看看HTML文档的基本结构：


<html>
<head>
<meta charset="utf-8">
<title>小橙子前端教程title>
head>
<body>

<h1>标题h1>
<p>段落p>

body>
html>

1.什么是HTML？

HTML的全称为超文本标记语言，是一种标记语言。它包括一系列标签。通过这些标签可以将网络上的文档格式统一，使分散的Internet资源连接为一个逻辑整体。

HTML 使用标记标签来描述网页
HTML 文档包含了HTML 标签及文本内容
HTML文档也叫做 web 页面

2.HTML 标签

HTML标记标签又称为标签。

HTML 标签是由尖括号包围的关键词
HTML 标签通常是成对出现
标签对中的第一个标签是开始标签(开放标签)，第二个标签是结束标签(闭合标签)

<标签>内容标签>

所有 HTML 文档必须以声明开头，该声明并非一个 HTML 标签，它是一条“信息”，告知浏览器期望的文档类型。

3.HTML 元素

一个 HTML 元素包含了开始标签与结束标签。例如：

<h1>一级标题h1>

4.HTML版本

下面是HTML的历史版本：

版本	发布时间
HTML	1991
HTML+	1993
HTML 2.0	1995
HTML 3.2	1997
HTML 4.01	1999
XHTML 1.0	2000
HTML5	2012
XHTML5	2013

5.Web 浏览器

要想学习Web前端，一定要先了解Web浏览器（如谷歌浏览器，Edge，Safari）。Web浏览器用于读取HTML文件，并将其作为网页显示。浏览器并不是直接显示HTML标签，而是负责网页的渲染和呈现，标签决定了如何展现HTML页面的内容给用户。例如：

6.HTML 网页结构

下面是HTML文档的基本结构，前面我们已经做了示例代码的展示：

7.中文编码

在一些浏览器直接输出中文会出现乱码的情况，当在浏览器输出中文乱码时，需要在头部将字符声明为 UTF-8 或 GBK。例如：

<meta charset="UTF-8">

8.编写第一个网页

前面介绍了HTML文档的一些基础信息，以及Web浏览器初识，接下来编写我们学习前端的第一个网页：

示例：使用记事本编写你的第一个网页！

<html>

<head>
    <title>这是我的第一个网页title>
head>

<body>
    
    <h1>望庐山瀑布h1>
    <h2>
        <font color=red>唐font> 李白
    h2>
    <p>日照香炉生紫烟，遥看瀑布挂前川。p>
    <p>飞流直下三千尺，疑是银河落九天。p>
body>

html>

新建一个文本文档，命名为index.html。编写代码，在默认浏览器中运行，查看显示效果！

二.HTML编辑器

这里推荐使用VsCode来编辑HTML代码！

vscode 是由微软开发的免费开源软件，它具有以下优势：

轻量级编辑器

丰富的插件系统

代码跟踪功能

三.HTML基础

1.HTML 标题

HTML 标题是通过

-

标签来定义的，例如：

    <h1>一级标题h1>
    <h2>二级标题h2>
    <h3>三级标题h3>

2.HTML 段落

HTML 段落是通过标签

来定义的，例如：

    <p>段落1p>
    <p>段落2p>
    <p>段落3p>

3.HTML 链接

HTML 链接是通过标签来定义的，例如：

<a href="https://www.baidu.com">百度一下a>

4.HTML 图像

HTML 图像是通过标签来定义的，例如：

<img src="/images/baidu.png" width="258" height="39" />

四.HTML元素

1.HTML 元素语法

HTML 元素以开始标签起始，以结束标签终止
元素的内容是开始标签与结束标签之间的内容，某些 HTML 元素具有空内容
空元素在开始标签中进行关闭（以开始标签的结束而结束）
大多数 HTML 元素可拥有属性

2.嵌套的 HTML 元素

其实，大多数 HTML 元素可以嵌套使用，即HTML 元素可以包含其他 HTML 元素。所以，HTML 文档是由相互嵌套的 HTML 元素构成的，例如：


<html>

<body>
<p>段落1...p>
body>

html>

其中，对几个重要的标签做一个描述：

这个
元素定义了 HTML 文档中的一个段落。这个元素拥有一个开始标签
以及一个结束标签
。元素内容是: 段落1…。
元素定义了 HTML 文档的主体。这个元素拥有一个开始标签以及一个结束标签。元素内容是另一个 HTML 元素（p 元素）。
元素定义了整个 HTML 文档。这个元素拥有一个开始标签，以及一个结束标签。元素内容是另一个 HTML 元素（body 元素）。

3.HTML 空元素

没有内容的 HTML 元素被称为空元素。空元素是在开始标签中关闭的，例如：

    <p>段落1p>
    <br>
    <p>段落2p>

其中，就是没有关闭标签的空元素（标签定义换行）。

在开始标签中添加斜杠，比如，是关闭空元素的正确方法。

五.HTML属性

属性是 HTML 元素提供的附加信息，属性值应该始终被包括在引号内，如果属性值本身就含有双引号，那么必须使用单引号包含属性值。

HTML 元素可以设置属性，属性可以在元素中添加附加信息
属性一般描述于开始标签
属性总是以名称/值对的形式出现，比如：name=“value”。

例如，HTML的链接标签中添加属性：

<a href="http://www.baidu.com">百度一下a>

HTML 链接由标签定义。链接的地址在 href 属性中指定。

六.HTML标题

1.HTML标题

标题是通过

标签进行定义的。

定义最大的标题。

定义最小的标题。浏览器会自动地在标题的前后添加空行，例如：

    <h1>一级标题h1>
    <h2>二级标题h2>
    <h3>三级标题h3>

标题用来正确的显示文章结构，通过不同的标题可以为文章建立索引，所以，标题是很重要的存在，所以，不要仅仅是为了生成粗体或大号的文本而使用标题。

2.HTML水平线

标签在 HTML 页面中创建水平线，例如：

    <p>段落1p>
    <hr>
    <p>段落2p>
    <hr>
    <p>段落3p>

3.HTML 注释

可以将注释插入 HTML 代码中，提高代码可读性，浏览器会忽略注释，也不会显示它们。

七.HTML段落

1.HTML段落

HTML可以将文档分为不同的段落。段落是通过

标签定义的，例如：

<p>段落1...p>
<p>段落2...p>

2.HTML换行

使用标签在不产生新的段落的情况下换行，例如：

<p>这是<br>换行的<br>演示p>

元素是一个空的 HTML 元素。由于关闭标签没有任何意义，因此它没有结束标签。

八.HTML文本格式化

HTML 使用标签 (“bold”) 与 (“italic”) 对输出的文本进行格式, 如：粗体 or 斜体。也可使用标签替换加粗标签来使用, 替换标签使用。但是两者的含义不同，或者 标签有你要呈现的文本是重要的，所以要突出显示的意思。

标签	作用
	定义粗体文本
	定义着重文字
	定义斜体文字
	定义小号文字
…	…

文本格式化的标签及其作用：

标签作用

定义粗体文本

定义着重文字

定义斜体文字

定义小号文字

… …

详细的HTML标签参考标签参考手册哦

九.HTML链接

HTML 使用超级链接与网络上的另一个文档相连，点击链接可以从一张页面跳转到另一张页面。

HTML使用标签来设置超文本链接。

在标签中使用了href属性来描述链接的地址。

一个未访问过的链接显示为蓝色字体并带有下划线，访问过的链接显示为紫色并带有下划线，点击链接时，链接显示为红色并带有下划线。

例如，使用标签定义超文本链接：

<a href="url">链接文本a>

其中，可以定义属性实现相应的功能：

使用 target 属性，你可以定义被链接的文档在何处显示。

id 属性可用于创建一个 HTML 文档书签。

十.HTML头部

1.HTML 元素：

元素包含了所有的头部标签元素。在元素中你可以插入脚本（scripts）, 样式文件（CSS），及各种meta信息。可以添加在头部区域的元素标签为: , <style>, <meta>, <link>, <script>, <noscript> 和 <base>。</code> <hr> 2.HTML <code><title></code>元素： <code><title></code> 标签定义了不同文档的标题。 <ul> <li class="task-list-item"> 定义了浏览器工具栏的标题</li> <li class="task-list-item"> 当网页添加到收藏夹时，显示在收藏夹中的标题</li> <li class="task-list-item"> 显示在搜索引擎结果页面的标题</li> </ul> 例如，下面的HTML文档代码： <pre><code class="prism language-html"><!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>文档标题</title> </head> <body> <p>文档内容......</p> </body> </html> </code></pre> <hr> 3.HTML <code><base></code>元素： <code><base></code> 标签描述了基本的链接地址/链接目标，该标签作为HTML文档中所有的链接标签的默认链接，例如： <pre><code class="prism language-html"><head> <base href="http://www.baidu.com/images/" target="_blank"> </head> </code></pre> <hr> 4.HTML <code><link></code>元素 <code><link></code> 标签定义了文档与外部资源之间的关系，例如： <pre><code class="prism language-html"><head> <link rel="stylesheet" type="text/css" href="mystyle.css"> </head> </code></pre> <hr> 5.HTML <code><stytle></code>元素 <code><style></code> 标签定义了HTML文档的样式文件引用地址，例如： <pre><code class="prism language-html"><head> <style type="text/css"> body {background-color:yellow} p {color:blue} </style> </head> </code></pre> <hr> 6.HTML <code><meta></code>元素 <code><meta></code>标签描述了一些基本的元数据。 <ul> <li class="task-list-item"> 标签提供了元数据。元数据也不显示在页面上，但会被浏览器解析。</li> <li class="task-list-item"> 元素通常用于指定网页的描述，关键词，文件的最后修改时间，作者，和其他元数据。</li> <li class="task-list-item"> 一般放置于 <code><head></code> 区域。</li> </ul> <hr> 7.HTML <code><script></code>元素 <code><script></code>标签用于加载脚本文件，如： JavaScript。 <hr> <h1>十一.HTML图像</h1> 在 HTML 中，图像由<code><img></code> 标签定义，<code><img></code> 是空标签。 要在页面上显示图像，需要使用源属性（src），源属性的值是图像的 URL 地址，例如： <pre><code class="prism language-html"><img src="url" alt="some_text"> </code></pre> <code>alt</code> 属性用来为图像定义一串预备的可替换的文本。在浏览器无法载入图像时，浏览器将显示这个替代性的文本而不是图像，例如： <pre><code class="prism language-html"><img src="boat.gif" alt="显示图像"> </code></pre> height（高度）与 width（宽度）属性用于设置图像的高度与宽度。默认单位是像素，例如： <pre><code class="prism language-html"><img src="baidu.jpg" alt="百度" width="200" height="100"> </code></pre> <blockquote> 注意：加载页面时，要注意插入页面图像的路径，如果不能正确设置图像的位置，浏览器无法加载图片，图像标签就会显示一个破碎的图片。 </blockquote> <hr> <h1>十二.HTML表格</h1> 表格由 <code><table></code> 标签来定义。每个表格均有若干行（由 <code><tr></code> 标签定义），每行被分割为若干单元格（由 <code><td></code> 标签定义）。字母 <code>td</code> 指表格数据（table data），即数据单元格的内容。数据单元格可以包含文本、图片、列表、段落、表单、水平线、表格等等，例如： <pre><code class="prism language-html"><table border="1"> <tr> <td>你好</td> <td>你好</td> </tr> <tr> <td>你好</td> <td>你好</td> </tr> </table> </code></pre> 大多数情况我们需要给表格加上边框，也可以不使用边框。 表格的表头使用 <code><th></code> 标签进行定义，大多数浏览器会把表头显示为粗体居中的文本。 <hr> <h1>十三.HTML列表</h1> HTML 支持有序、无序和定义列表: <ul> <li>无序列表使用 <code><ul></code> 标签定义，使用粗体圆点（典型的小黑圆圈）进行标记，每个列表项始于 <code><li></code> 标签，例如：</li> </ul> <pre><code class="prism language-html"> <ul> <li>java</li> <li>python</li> </ul> </code></pre> <img src="http://img.e-com-net.com/image/info8/b0d48127950542abb065a761bc39a3db.jpg" alt="在这里插入图片描述" width="0" height="0"> <ul> <li>有序列表使用<code><ol></code> 标签定义，使用数字进行标记，每个列表项始于 <code><li></code> 标签，例如：</li> </ul> <pre><code class="prism language-html"> <ol> <li>java</li> <li>python</li> </ol> </code></pre> <img src="http://img.e-com-net.com/image/info8/2d91f0a115054daaa0f0d39e7cccd143.jpg" alt="在这里插入图片描述" width="0" height="0"> <ul> <li>自定义列表以 <code><dl></code> 标签开始，每个自定义列表项以 <code><dt></code> 开始。每个自定义列表项的定义以 <code><dd></code> 开始，自定义列表是项目和注释的组合，例如：</li> </ul> <pre><code class="prism language-html"> <dl> <dt>java</dt> <dd>-诞生于1995年</dd> <dt>python</dt> <dd>-诞生于1991年</dd> </dl> </code></pre> <img src="http://img.e-com-net.com/image/info8/ba829f8ff0904312959966f51b941868.jpg" alt="在这里插入图片描述" width="0" height="0"> <hr> <h1>十四.HTML区块</h1> HTML 可以通过 <code><div></code> 和 <code></code>将元素组合起来。 大多数 HTML 元素被定义为块级元素或内联元素。 <h2>1.HTML区块元素</h2> 块级元素在浏览器显示时，通常会以新行来开始和结束。 <h2>2.HTML内联元素</h2> 内联元素在浏览器显示时通常不会以新行开始。 <h2>3.HTML的 div 元素</h2> HTML <code><div></code> 元素是块级元素，它是用于组合其他 HTML 元素的容器。 例：让文档中的一块区域显示为红色，另一块区域加粗且显示为蓝色，HTML文档代码如下。 <pre><code class="prism language-html"><!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> </head> <body> <h1>望庐山瀑布</h1> <h2>唐李白</h2> <div style="color:red"> <p>日照香炉生紫烟，</p> <p>遥看瀑布挂前川。</p> </div> <div style="font-weight:bold;color:blue"> <p>飞流直下三千尺，</p> <p>疑是银河落九天。</p> </div> </body> </html> </code></pre> 显示效果： <img src="http://img.e-com-net.com/image/info8/35e3facdb0a047dba57bdd4e64bfa916.jpg" alt="在这里插入图片描述" width="0" height="0"> <code><div></code>标签常用于组合块级元素，以便通过 CSS 来对这些元素进行格式化。 <h2>4.HTML的 span 元素</h2> HTML <code></code> 元素是内联元素，可用作文本的容器。 例：对文档中的一部分文本进行着色，HTML代码如下。 <pre><code class="prism language-html"> <h2><span style="color:chartreuse">唐</span> -李白</h2> </code></pre> 显示效果： <img src="http://img.e-com-net.com/image/info8/0bb7d0d6786c49058108c866969b2593.jpg" alt="在这里插入图片描述" width="0" height="0"> <code></code> 用于对文档中的行内元素进行组合。 <hr> <h1>十五.HTML布局</h1> 布局用于改善网站的外观，我们可以使用<code><div></code>或者<code><table></code>添加网页布局，大多数网站可以使用 <code><div></code> 或者 <code><table></code> 元素来创建多列。CSS 用于对元素进行定位，或者为页面创建背景以及色彩丰富的外观。 <h2>1.使用div元素添加网页布局</h2> <code>div</code> 元素是用于分组 HTML 元素的块级元素。例如： <pre><code class="prism language-html"><!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>小橙子前端教程!</title> </head> <body> <div id="container" style="width:600px"> <div id="header" style="background-color:cornflowerblue;"> <h1 style="margin-bottom:0;">--唐诗三百首--</h1> </div>   <div id="menu" style="background-color:dimgrey;height:200px;width:200px;float:left;"> <b>菜单</b><br> 望庐山瀑布<br> 静夜思<br> 绝句<br> 琵琶行 </div> <div id="content" style="background-color:aliceblue;height:200px;width:400px;float:left;"> 望庐山瀑布<br> 翻译译文：香炉峰在阳光的照射下生起紫色烟霞，远远望见瀑布似白色绢绸悬挂在山前。高崖上飞腾直落的瀑布好像有几千尺，让人恍惚以为银河从天上泻落到人间。 </div>  <div id="footer" style="background-color:cadetblue;clear:both;text-align:center;"> 橙子！</div> </div> </body> </html> </code></pre> <img src="http://img.e-com-net.com/image/info8/9989ee7617ba4916920685efffb3c238.jpg" alt="在这里插入图片描述" width="0" height="0"> <h2>2.使用table元素添加网页布局</h2> 我们还可以使用table标签添加网页布局，例如： <pre><code class="prism language-html"><!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>小橙子前端教程!</title> </head> <body> <table width="600" border="0"> <tr> <td colspan="2" style="background-color:cornflowerblue"> <h1>--唐诗三百首--</h1> </td> </tr> <tr> <td style="background-color:dimgrey;width:200px;vertical-align:top;"> <b>菜单</b><br> 望庐山瀑布<br> 静夜思<br> 绝句<br> 琵琶行 </td>  <td style="background-color:aliceblue;height:200px;width:400px;vertical-align:top;"> 望庐山瀑布<br> 翻译译文：香炉峰在阳光的照射下生起紫色烟霞，远远望见瀑布似白色绢绸悬挂在山前。高崖上飞腾直落的瀑布好像有几千尺，让人恍惚以为银河从天上泻落到人间。</td> </tr> <tr> <td colspan="2" style="background-color:cadetblue;text-align:center;"> 橙子！</td> </tr> </table> </body> </html> </code></pre> <img src="http://img.e-com-net.com/image/info8/90581b43833c4886ba34b40753453282.jpg" alt="在这里插入图片描述" width="0" height="0"> <code><table></code>元素主要用于创建表格，虽然可以用于添加网页布局，但是不建议使用！ <hr> <h1>十六.HTML表单和输入</h1> <code>HTML 表单</code>用于收集用户的输入信息，HTML 表单表示文档中的一个区域，此区域包含交互控件，将用户收集到的信息发送到 Web 服务器。 <code>表单是一个包含表单元素的区域</code>，表单元素是允许用户在表单中输入内容，比如：文本域（textarea）、下拉列表（select）、单选框（radio-buttons）、复选框（checkbox）等等。 我们使用标签来创建表单，多数情况下被用到的表单标签是输入标签 <code><input></code>。 <h2>1.文本域</h2> 文本域(Text Fields)通过 <code><input type="text"></code> 来设定，当用户要在表单中键入字母、数字等内容时，就会用到文本域，例如： <pre><code class="prism language-html"><body> <form> First <input type="text" name="firstname"><br> Last <input type="text" name="lastname"> </form> </body> </code></pre> <img src="http://img.e-com-net.com/image/info8/af1c6a5d773542b6bf91647ebb1f13d6.jpg" alt="在这里插入图片描述" width="0" height="0"> <h2>2.密码字段</h2> 密码字段通过标签 <code><input type="password"></code> 来定义，例如： <pre><code class="prism language-html"><form> Password: <input type="password" name="pwd"> </form> </code></pre> <img src="http://img.e-com-net.com/image/info8/ff2d4396b97641d3b69f04b5f2d55bb6.jpg" alt="在这里插入图片描述" width="0" height="0"> 密码字段字符不会明文显示，而是以星号 <code>*</code> 或圆点 <code>.</code> 替代。 <h2>3.单选按钮</h2> 单选按钮(Radio Buttons)通过<code><input type="radio"></code>标签来定义,例如： <pre><code class="prism language-html"><form action=""> <input type="radio" name="sex" value="male">男<br> <input type="radio" name="sex" value="female">女 </form> </code></pre> <img src="http://img.e-com-net.com/image/info8/a5cc85e46eca4cdea7e5ce22b6ac733a.jpg" alt="在这里插入图片描述" width="0" height="0"> <h2>4.复选框</h2> 复选框(Checkboxes)通过标签<code><input type="checkbox"></code>来定义，例如： <pre><code class="prism language-html"> <form> <input type="checkbox" name="vehicle" value="Bike">语文<br> <input type="checkbox" name="vehicle" value="Car">数学<br> <input type="checkbox" name="vehicle" value="Bike">英语<br> <input type="checkbox" name="vehicle" value="Car">历史 </form> </code></pre> <img src="http://img.e-com-net.com/image/info8/cef0504f829a4eebbcc5337da232d90d.jpg" alt="在这里插入图片描述" width="0" height="0"> <h2>5.提交按钮</h2> 提交按钮用<code><input type="submit"></code>标签来定义，例如： <pre><code class="prism language-html"><form name="input" action="html_form_action.php" method="get"> Username: <input type="text" name="user"> <input type="submit" value="Submit"> </form> </code></pre> <img src="http://img.e-com-net.com/image/info8/56f16d70324a4587ab1ef18adadbcfa5.jpg" alt="在这里插入图片描述" width="0" height="0"> 在上面的文本框内键入几个字母，然后点击确认按钮，那么输入数据会传送到 html_form_action.php 文件，该页面将显示出输入的结果。 <code>method</code> 属性用于定义表单数据的提交方式，可以是以下值： <code>post</code>：指的是 HTTP POST 方法，表单数据会包含在表单体内然后发送给服务器，用于提交敏感数据，如用户名与密码等。 <code>get</code>：默认值，指的是 HTTP GET 方法，表单数据会附加在 action 属性的 URL 中，并以 ?作为分隔符，一般用于不敏感信息，如分页等。 <hr> <h1>十七.HTML框架</h1> 有时候我们希望在同一个浏览器界面中显示不止一个页面，这时候就要用到框架。 <h2>1.iframe语法</h2> iframe语法格式如下： <pre><code class="prism language-html"><iframe src="URL"></iframe> </code></pre> <h2>2.iframe设置高度和宽度</h2> <code>height</code> 和 <code>width</code> 属性用来定义iframe标签的高度与宽度，例如： <pre><code class="prism language-html"><iframe loading="lazy" src="demo_iframe.htm" width="200" height="200"></iframe> </code></pre> <h2>3.iframe去除边框</h2> <code>frameborder</code> 属性用于定义iframe表示是否显示边框，例如： <pre><code class="prism language-html"><iframe src="demo_iframe.htm" frameborder="0"></iframe> </code></pre> <h2>4.使用 iframe 来显示目标链接页面</h2> <code>iframe</code> 可以显示一个目标链接的页面，例如： <pre><code class="prism language-html"><!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>小橙子前端教程！</title> </head> <body> <iframe src="demo_iframe.htm" name="iframe_a" width="800" height="400"></iframe> <p><a href="https://blog.csdn.net/zhangxia_?spm=1000.2115.3001.5343" target="iframe_a">橙子！的博客</a></p> <p><b>注意：</b> 因为 a 标签的 target 属性是名为 iframe_a 的 iframe 框架，所以在点击链接时页面会显示在 iframe框架中。</p> </body> </html> </code></pre> <img src="http://img.e-com-net.com/image/info8/783f8b2b244940f7b852a1ce40dbdd85.jpg" alt="在这里插入图片描述" width="0" height="0"> <hr> <h1>十八.HTML颜色</h1> <code>HTML 颜色</code>由红色、绿色、蓝色混合而成。 HTML 颜色由一个十六进制符号来定义，这个符号由红色、绿色和蓝色的值组成（RGB）。 每种颜色的最小值是0（十六进制：#00）。最大值是255（十六进制：#FF）。 <img src="http://img.e-com-net.com/image/info8/807e73cda7904b31bd0840eaf53bc4a4.jpg" alt="在这里插入图片描述" width="0" height="0"> 具体颜色效果可以查表。 <hr> <h1>十九.脚本</h1> <h2>1.HTML的 script 标签</h2> <code><script></code> 标签用于定义客户端脚本，比如 JavaScript。<code><script></code> 元素既可包含脚本语句，也可通过 <code>src</code> 属性指向外部脚本文件，例如： <pre><code class="prism language-html"><script> document.write("Hello World!"); </script> </code></pre> <h2>2.HTML的 noscript 标签</h2> 标签提供无法使用脚本时的替代内容，比方在浏览器禁用脚本时，<code><noscript></code>元素可包含普通 HTML 页面的 body 元素中能够找到的所有元素，在浏览器禁止使用脚本时，会显示该标签内的内容，例如： <pre><code class="prism language-html"><script> document.write("Hello World!") </script> <noscript>抱歉，你的浏览器不支持 JavaScript!</noscript> </code></pre> <hr> <h1>二十.字符实体</h1> HTML中预留的字符和一些键盘上找不到的字符必须使用<code>字符实体</code>来替换！ 如果希望正确地显示预留字符，我们必须在 HTML 源代码中使用字符实体（character entities）。 <table> <thead> <tr> <th>显示结果</th> <th>描述</th> <th>实体名称</th> <th>实体编号</th> </tr> </thead> <tbody> <tr> <td></td> <td>空格</td> <td><code> </code></td> <td><code> </code></td> </tr> <tr> <td><</td> <td>小于号</td> <td><code><</code></td> <td><code><</code></td> </tr> <tr> <td>></td> <td>大于号</td> <td><code>></code></td> <td><code>></code></td> </tr> <tr> <td>&</td> <td>和号</td> <td><code>&</code></td> <td><code>&</code></td> </tr> </tbody> </table> 实体名称对大小写敏感，实际实体名称使用时参考HTML实体参考手册！ <hr> <h1>二十一.URL</h1> <code>URL(统一资源定位器)</code>是一个网页地址。 可以使用网址，例如：www.baidu.com或者使用IP地址来访问。 <code>Web浏览器</code>通过URL从Web服务器请求页面。 <h2>1.常见的 URL Scheme</h2> <table> <thead> <tr> <th>Scheme</th> <th>访问</th> <th>作用</th> </tr> </thead> <tbody> <tr> <td>http</td> <td>超文本传输协议</td> <td>以 http:// 开头的普通网页。不加密。</td> </tr> <tr> <td>https</td> <td>安全超文本传输协议</td> <td>安全网页，加密所有信息交换。</td> </tr> <tr> <td>ftp</td> <td>文件传输协议</td> <td>用于将文件下载或上传至网站。</td> </tr> <tr> <td>file</td> <td></td> <td>您计算机上的文件。</td> </tr> </tbody> </table> URL 只能使用 ASCII 字符集。 <hr> <h1>二十二.HTML总结</h1> <code>恭喜你！现在我们已经顺利的通过了HTML的学习。</code>在前端三剑客HTML，CSS和JavaScript中，HTML学习相对简单，在学习的过程中一定要注重实践，学习常用的标签。 <a href="http://img.e-com-net.com/image/info8/a984c9026f1e464a869f27a83e55e731.jpg" target="_blank"><img src="http://img.e-com-net.com/image/info8/a984c9026f1e464a869f27a83e55e731.jpg" alt="【Web前端】一文带你吃透HTML(完整篇)_第2张图片" width="650" height="204" style="border:1px solid black;"></a> </div> </div>�� </div> </div> </div>  <div id="SOHUCS" sid="1586940849810427904"></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">你可能感兴趣的:(前端,编程进阶之路,JavaWeb基础教程系列,Java编程,进阶之路,前端,html,html5,1024程序员节)</h4> <div id="paradigm-article-related"> <div class="recommend-post mb30"> <ul class="widget-links"> <li><a href="/article/1950233199242178560.htm" title="x86-64汇编语言训练程序与实战" target="_blank">x86-64汇编语言训练程序与实战</a> 十除以十等于一 <div>本文还有配套的精品资源，点击获取简介：汇编语言是一种低级语言，与机器代码紧密相关，特别适用于编写系统级代码及性能要求高的应用。nasm编译器是针对x86和x86-64架构的汇编语言编译器，支持多种语法风格和指令集。项目Euler提供数学和计算机科学问题，鼓励编程技巧应用，前100个问题的答案可共享。x86-64架构扩展了寄存器数量并引入新指令，提升了数据处理效率。学习汇编语言能够深入理解计算机底层</div> </li> <li><a href="/article/1950233072825856000.htm" title="三菱PLC全套学习资料及应用手册" target="_blank">三菱PLC全套学习资料及应用手册</a> good2know <div>本文还有配套的精品资源，点击获取简介：三菱PLC作为工业自动化领域的核心设备，其系列产品的学习和应用需要全面深入的知识。本次资料包为学习者提供从基础到进阶的全方位学习资源，包括各种型号PLC的操作手册、编程指南、软件操作教程以及实际案例分析，旨在帮助用户系统掌握PLC的编程语言、指令系统及在各类工业应用中的实施。1.三菱PLC基础知识入门1.1PLC的基本概念可编程逻辑控制器（PLC）是工业自动化</div> </li> <li><a href="/article/1950232820773351424.htm" title="移动端城市区县二级联动选择功能实现包" target="_blank">移动端城市区县二级联动选择功能实现包</a> good2know <div>本文还有配套的精品资源，点击获取简介：本项目是一套为移动端设计的jQuery实现方案，用于简化用户在选择城市和区县时的流程。它包括所有必需文件：HTML、JavaScript、CSS及图片资源。通过动态更新下拉菜单选项，实现城市到区县的联动效果，支持数据异步加载。开发者可以轻松集成此功能到移动网站或应用，并可基于需求进行扩展和优化。1.jQuery移动端解决方案概述jQuery技术简介jQuery</div> </li> <li><a href="/article/1950232316408295424.htm" title="9、汇编语言编程入门：从环境搭建到简单程序实现" target="_blank">9、汇编语言编程入门：从环境搭建到简单程序实现</a> 神经网络酱 <a class="tag" taget="_blank" href="/search/%E6%B1%87%E7%BC%96%E8%AF%AD%E8%A8%80/1.htm">汇编语言</a><a class="tag" taget="_blank" href="/search/MEPIS/1.htm">MEPIS</a><a class="tag" taget="_blank" href="/search/GNU%E5%B7%A5%E5%85%B7%E9%93%BE/1.htm">GNU工具链</a> <div>汇编语言编程入门：从环境搭建到简单程序实现1.数据存储介质问题解决在处理数据存储时，若要使用MEPIS系统，需确保有其可访问的存储介质。目前，MEPIS无法向采用NTFS格式（常用于Windows2000和XP工作站）的硬盘写入数据。不过，若硬盘采用FAT32格式，MEPIS就能进行写入操作。此外，MEPIS还能将文件写入软盘和大多数USB闪存驱动器。若工作站连接到局域网，还可通过FTP协议或挂载</div> </li> <li><a href="/article/1950232190038110208.htm" title="day15｜前端框架学习和算法" target="_blank">day15｜前端框架学习和算法</a> universe_01 <a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/%E7%AE%97%E6%B3%95/1.htm">算法</a><a class="tag" taget="_blank" href="/search/%E7%AC%94%E8%AE%B0/1.htm">笔记</a> <div>T22括号生成先把所有情况都画出来，然后（在满足什么情况下）把不符合条件的删除。T78子集要画树状图，把思路清晰。可以用暴力法、回溯法和DFS做这个题DFS深度搜索：每个边都走完，再回溯应用：二叉树搜索，图搜索回溯算法=DFS+剪枝T200岛屿数量（非常经典BFS宽度把树状转化成队列形式，lambda匿名函数“一次性的小函数，没有名字”setup语法糖：让代码更简洁好写的语法ref创建：基本类型的</div> </li> <li><a href="/article/1950225381961297920.htm" title="SpringMVC的执行流程" target="_blank">SpringMVC的执行流程</a> <div>1、什么是MVCMVC是一种设计模式。MVC的原理图如下所示M-Model模型（完成业务逻辑：有javaBean构成，service+dao+entity）V-View视图（做界面的展示jsp，html……）C-Controller控制器（接收请求—>调用模型—>根据结果派发页面2、SpringMVC是什么SpringMVC是一个MVC的开源框架，SpringMVC=Struts2+Spring，</div> </li> <li><a href="/article/1950219953118441472.htm" title="编程算法：技术创新的引擎与业务增长的核心驱动力" target="_blank">编程算法：技术创新的引擎与业务增长的核心驱动力</a> <div>在数字经济时代，算法已成为推动技术创新与业务增长的隐形引擎。从存内计算突破冯·诺依曼瓶颈，到动态规划优化万亿级金融交易，编程算法正在重塑产业竞争格局。一、存内计算：突破冯·诺依曼瓶颈的算法革命1.1存内计算的基本原理传统计算架构中90%的能耗消耗在数据搬运上。存内计算（Processing-in-Memory）通过直接在存储单元执行计算，实现能效10-100倍提升：#传统计算vs存内计算能耗模型i</div> </li> <li><a href="/article/1950208989954371584.htm" title="Selenium 特殊控件操作与 ActionChains 实践详解" target="_blank">Selenium 特殊控件操作与 ActionChains 实践详解</a> 小馋喵知识杂货铺 <a class="tag" taget="_blank" href="/search/selenium/1.htm">selenium</a><a class="tag" taget="_blank" href="/search/%E6%B5%8B%E8%AF%95%E5%B7%A5%E5%85%B7/1.htm">测试工具</a> <div>1.下拉框单选操作(a)使用SeleniumSelect类（标准HTML标签）Selenium提供了内置的Select类用于操作标准下拉框，这种方式简单且直观。fromselenium.webdriver.support.uiimportSelect#定位下拉框dropdown=Select(driver.find_element("id","dropdown_id"))#通过以下三种方式选择单个</div> </li> <li><a href="/article/1950207097413103616.htm" title="微信公众号回调java_处理微信公众号消息回调" target="_blank">微信公众号回调java_处理微信公众号消息回调</a> weixin_39607620 <a class="tag" taget="_blank" href="/search/%E5%BE%AE%E4%BF%A1%E5%85%AC%E4%BC%97%E5%8F%B7%E5%9B%9E%E8%B0%83java/1.htm">微信公众号回调java</a> <div>1、背景在上一节中，咱们知道如何接入微信公众号，可是以后公众号会与咱们进行交互，那么微信公众号如何通知到咱们本身的服务器呢？咱们知道咱们接入的时候提供的url是GET/mp/entry，那么公众号以后产生的事件将会以POST/mp/entry发送到咱们本身的服务器上。html2、代码实现，此处仍是使用weixin-java-mp这个框架实现一、引入weixin-java-mpcom.github.</div> </li> <li><a href="/article/1950206970766094336.htm" title="C++编程基础与面向对象概念解析" target="_blank">C++编程基础与面向对象概念解析</a> 侯昂 <a class="tag" taget="_blank" href="/search/%E9%9D%A2%E5%90%91%E5%AF%B9%E8%B1%A1%E7%BC%96%E7%A8%8B/1.htm">面向对象编程</a><a class="tag" taget="_blank" href="/search/C%2B%2B%E8%AF%AD%E6%B3%95/1.htm">C++语法</a><a class="tag" taget="_blank" href="/search/%E5%87%BD%E6%95%B0/1.htm">函数</a><a class="tag" taget="_blank" href="/search/%E7%B1%BB%E4%B8%8E%E5%AF%B9%E8%B1%A1/1.htm">类与对象</a><a class="tag" taget="_blank" href="/search/%E7%BB%A7%E6%89%BF%E4%B8%8E%E5%A4%9A%E6%80%81%E6%80%A7/1.htm">继承与多态性</a> <div>C++编程基础与面向对象概念解析背景简介C++是一种广泛使用的面向对象编程语言，它允许开发者创建高效、灵活且功能强大的程序。本文基于《C++Primer》一书的章节内容，深入解析C++的核心概念和面向对象编程原则，旨在帮助读者构建扎实的C++编程基础。面向对象编程的原则软件危机与进化介绍了软件危机的产生和软件进化的必要性，强调了面向对象编程（OOP）在应对这些问题中的优势。面向对象编程范式讨论了面</div> </li> <li><a href="/article/1950202684451647488.htm" title="[spring6: Mvc-网关]-源码解析" target="_blank">[spring6: Mvc-网关]-源码解析</a> <div>推荐阅读：[spring6:Mvc-函数式编程]-源码解析GatewayServerMvcAutoConfiguration@AutoConfiguration(after={HttpClientAutoConfiguration.class,RestTemplateAutoConfiguration.class,RestClientAutoConfiguration.class,FilterAu</div> </li> <li><a href="/article/1950201094361640960.htm" title="人工智能应用研究快讯 2021-11-30" target="_blank">人工智能应用研究快讯 2021-11-30</a> 峰谷皆平 <div>[HTML]ArtificialIntelligenceforSkinCancerDetection:ScopingReviewATakiddin,JSchneider,YYang,AAbd-Alrazaq...JournalofMedicalInternet...,2021ABSTACT:Background:Skincanceristhemostcommoncancertypeaffectin</div> </li> <li><a href="/article/1950200667587014656.htm" title="学C++的五大惊人好处" target="_blank">学C++的五大惊人好处</a> <div>为什么要学c++学c++有什么用学习c++的好处有1.中考可以加分2.高考可能直接录取3.就业广且工资高4.在未来30--50年c++一定是一个很受欢迎的职业5.c++成功的例子deepsick等AI智能C++语言兼备编程效率和编译运行效率的语言C++语言是C语言功能增强版,在c语言的基础上添加了面向对象编程和泛型编程的支持既继承了C语言高效，简洁，快速和可移植的传统,又具备类似Java、Go等其</div> </li> <li><a href="/article/1950199910724857856.htm" title="机器学习必备数学与编程指南：从入门到精通" target="_blank">机器学习必备数学与编程指南：从入门到精通</a> a小胡哦 <a class="tag" taget="_blank" href="/search/%E6%9C%BA%E5%99%A8%E5%AD%A6%E4%B9%A0%E5%9F%BA%E7%A1%80/1.htm">机器学习基础</a><a class="tag" taget="_blank" href="/search/%E6%9C%BA%E5%99%A8%E5%AD%A6%E4%B9%A0/1.htm">机器学习</a><a class="tag" taget="_blank" href="/search/%E4%BA%BA%E5%B7%A5%E6%99%BA%E8%83%BD/1.htm">人工智能</a> <div>一、机器学习核心数学基础1.线性代数（神经网络的基础）必须掌握：矩阵运算（乘法、转置、逆）向量空间与线性变换特征值分解与奇异值分解(SVD)为什么重要：神经网络本质就是矩阵运算学习技巧：用NumPy实际操作矩阵运算2.概率与统计（模型评估的关键）核心概念：条件概率与贝叶斯定理概率分布（正态、泊松、伯努利）假设检验与p值应用场景：朴素贝叶斯、A/B测试3.微积分（优化算法的基础）重点掌握：导数与偏导</div> </li> <li><a href="/article/1950198270882017280.htm" title="《UNIX网络编程卷1：套接字联网API》第8章：基本UDP套接字编程深度解析" target="_blank">《UNIX网络编程卷1：套接字联网API》第8章：基本UDP套接字编程深度解析</a> <div>《UNIX网络编程卷1：套接字联网API》第8章：基本UDP套接字编程深度解析（8000字图文实战）一、UDP协议核心特性与编程模型1.1UDP协议设计哲学UDP（UserDatagramProtocol）是面向无连接的传输层协议（图1），其核心特征包括：无连接通信：无需三次握手，直接发送数据报尽最大努力交付：不保证可靠性、不维护连接状态报文边界保留：接收方读取的数据与发送方写入完全一致低开销高效</div> </li> <li><a href="/article/1950195876991397888.htm" title="【Jupyter】个人开发常见命令" target="_blank">【Jupyter】个人开发常见命令</a> TIM老师 <a class="tag" taget="_blank" href="/search/%23/1.htm">#</a><a class="tag" taget="_blank" href="/search/Pycharm/1.htm">Pycharm</a><a class="tag" taget="_blank" href="/search/%26amp%3B/1.htm">&</a><a class="tag" taget="_blank" href="/search/VSCode/1.htm">VSCode</a><a class="tag" taget="_blank" href="/search/python/1.htm">python</a><a class="tag" taget="_blank" href="/search/Jupyter/1.htm">Jupyter</a> <div>1.查看python版本importsysprint(sys.version)2.ipynb/py文件转换jupyternbconvert--topythonmy_file.ipynbipynb转换为mdjupyternbconvert--tomdmy_file.ipynbipynb转为htmljupyternbconvert--tohtmlmy_file.ipynbipython转换为pdfju</div> </li> <li><a href="/article/1950195246893690880.htm" title="30 岁转行编程来得及吗？这位宝妈的经历告诉你答案" target="_blank">30 岁转行编程来得及吗？这位宝妈的经历告诉你答案</a> 大力出奇迹985 <a class="tag" taget="_blank" href="/search/react.js/1.htm">react.js</a> <div>30岁转行编程是否可行？本文通过一位宝妈的真实经历给出答案。这位宝妈在30岁时，因职业发展瓶颈和对编程的兴趣，毅然决定转行。她克服了学习中的诸多困难，平衡家庭与学习，最终成功入职科技公司。文章详细讲述了她的转行动机、学习过程、求职经历及收获，证明了只要有决心和正确方法，30岁转行编程完全来得及，为有类似想法的人提供了实用参考。正文一、转行的契机：职业瓶颈与心中热爱的碰撞30岁的林悦（化名）曾是一家</div> </li> <li><a href="/article/1950194868303228928.htm" title="免费编程课程大汇总：从入门到精通的一站式资源" target="_blank">免费编程课程大汇总：从入门到精通的一站式资源</a> 大力出奇迹985 <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>在数字化时代，编程已成为一项至关重要的技能，无论是为了职业发展还是个人兴趣，学习编程都极具价值。本文精心汇总了丰富的免费编程课程资源，涵盖从基础入门到精通的各个阶段。通过全面介绍如Coursera、edX等在线学习平台，Codecademy、freeCodeCamp等交互式学习网站，以及B站、网易云课堂等视频课程平台的免费课程，为编程学习者提供了一站式的资源指南，帮助读者轻松开启编程学习之旅，逐步</div> </li> <li><a href="/article/1950194742100815872.htm" title="用代码生成艺术字：设计个性化海报的秘密" target="_blank">用代码生成艺术字：设计个性化海报的秘密</a> <div>本文围绕“用代码生成艺术字：设计个性化海报的秘密”展开，先概述代码生成艺术字在海报设计中的独特价值，接着介绍常用的代码工具（如HTML、CSS、JavaScript等），详细阐述从构思到实现的完整流程，包括字体样式设计、动态效果添加等，还分享了提升艺术字质感的技巧及实际案例。最后总结代码生成艺术字的优势，为设计师提供打造个性化海报的实用指南，助力提升海报设计的独特性与吸引力，符合搜索引擎SEO标准</div> </li> <li><a href="/article/1950194363237724160.htm" title="用 Python 开发小游戏：零基础也能做出《贪吃蛇》" target="_blank">用 Python 开发小游戏：零基础也能做出《贪吃蛇》</a> <div>本文专为零基础学习者打造，详细介绍如何用Python开发经典小游戏《贪吃蛇》。无需复杂编程知识，从环境搭建到代码编写、功能实现，逐步讲解核心逻辑与操作。涵盖Pygame库的基础运用、游戏界面设计、蛇的移动与食物生成规则等，让新手能按步骤完成开发，同时融入SEO优化要点，帮助读者轻松入门Python游戏开发，体验从0到1做出游戏的乐趣。一、为什么选择用Python开发《贪吃蛇》对于零基础学习者来说，</div> </li> <li><a href="/article/1950194363741040640.htm" title="文科生转行编程：从月薪 3 千到 2 万的真实经历" target="_blank">文科生转行编程：从月薪 3 千到 2 万的真实经历</a> <div>在当下就业市场中，文科生往往面临诸多挑战，薪资水平也不尽如人意。然而，有不少勇敢的文科生成功实现了向编程领域的转行，薪资更是实现了从月薪3千到2万的飞跃。本文将深入剖析文科生转行编程的真实经历，从最初对现状的不满萌生出转行念头，到如何艰难地开启学习之旅，克服基础薄弱、思维转换难等重重困难，再到求职时凭借策略与努力获得宝贵机会，以及入职后持续学习保持竞争力。希望通过这些真实历程，为有志于转行编程的文</div> </li> <li><a href="/article/1950191587556388864.htm" title="C#中的设计模式：构建更加优雅的代码" target="_blank">C#中的设计模式：构建更加优雅的代码</a> Envyᥫᩣᩚ <a class="tag" taget="_blank" href="/search/c%23/1.htm">c#</a><a class="tag" taget="_blank" href="/search/%E5%BC%80%E5%8F%91%E8%AF%AD%E8%A8%80/1.htm">开发语言</a> <div>C#在面向对象编程（OOP）方面的强大支持，我们可以探讨“C#中的设计模式”。这不仅有助于理解如何更好地组织代码，还能提高代码的可维护性和可扩展性。引言设计模式是软件工程中经过实践验证的解决方案模板，它们提供了一种标准化的方法来解决常见的开发问题。对于使用C#进行开发的程序员来说，理解和应用这些模式可以帮助创建结构良好、易于维护和扩展的应用程序。本文将介绍几种常用的设计模式，并展示如何用C#实现它</div> </li> <li><a href="/article/1950191208873652224.htm" title="vue element 封装表单" target="_blank">vue element 封装表单</a> 影子信息 <a class="tag" taget="_blank" href="/search/vue/1.htm">vue</a><a class="tag" taget="_blank" href="/search/vue.js/1.htm">vue.js</a><a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a> <div>背景：在前端系统开发中，系统页面涉及到的表单组件比较多，所以进行了简单的封装。封装的包括一些Form表单组件，如下：input输入框、select下拉框、等实现效果：理论知识：表单组件官方链接：点击跳转封装组件：封装组件的思路：不封装element组件，每一个input组件绑定一个form对象，例如官网。简单封装element组件，利用for循环生成form表单的每一项el-form-item。进</div> </li> <li><a href="/article/1950191165710069760.htm" title="前端面试每日 3+1 —— 第39天" target="_blank">前端面试每日 3+1 —— 第39天</a> 浪子神剑 <div>今天的面试题(2019.05.25)——第39天[html]title与h1、b与strong、i与em的区别分别是什么？[css]写出你知道的CSS水平和垂直居中的方法[js]说说你对模块化的理解[软技能]公钥加密和私钥加密是什么？《论语》，曾子曰：“吾日三省吾身”（我每天多次反省自己）。前端面试每日3+1题，以面试题来驱动学习，每天进步一点！让努力成为一种习惯，让奋斗成为一种享受！欢迎在Iss</div> </li> <li><a href="/article/1950190325960077312.htm" title="Jupyter Notebook：数据科学的“瑞士军刀”" target="_blank">Jupyter Notebook：数据科学的“瑞士军刀”</a> a小胡哦 <a class="tag" taget="_blank" href="/search/%E6%9C%BA%E5%99%A8%E5%AD%A6%E4%B9%A0%E5%9F%BA%E7%A1%80/1.htm">机器学习基础</a><a class="tag" taget="_blank" href="/search/%E4%BA%BA%E5%B7%A5%E6%99%BA%E8%83%BD/1.htm">人工智能</a><a class="tag" taget="_blank" href="/search/%E6%9C%BA%E5%99%A8%E5%AD%A6%E4%B9%A0/1.htm">机器学习</a> <div>在数据科学的世界里，JupyterNotebook是一个不可或缺的工具，它就像是数据科学家手中的“瑞士军刀”，功能强大且灵活多变。今天，就让我们一起深入了解这个神奇的工具。一、JupyterNotebook是什么？JupyterNotebook是一个开源的Web应用程序，它允许你创建和共享包含实时代码、方程、可视化和解释性文本的文档。它支持多种编程语言，其中Python是最常用的语言之一。Jupy</div> </li> <li><a href="/article/1950190146074767360.htm" title="大数据技术笔记—spring入门" target="_blank">大数据技术笔记—spring入门</a> 卿卿老祖 <div>篇一spring介绍spring.io官网快速开始Aop面向切面编程，可以任何位置，并且可以细致到方法上连接框架与框架Spring就是IOCAOP思想有效的组织中间层对象一般都是切入service层spring组成前后端分离已学方式，前后台未分离：Spring的远程通信：明日更新创建第一个spring项目来源：科多大数据</div> </li> <li><a href="/article/1950187223672483840.htm" title="GDP经济社会人文民生栅格数据下载网站汇总" target="_blank">GDP经济社会人文民生栅格数据下载网站汇总</a> 疯狂学习GIS <div> 本文为“GIS数据获取整理”专栏（https://blog.csdn.net/zhebushibiaoshifu/category_10857546.html）中第八篇独立博客，因此本文全部标题均由“8”开头。本文对目前主要的GDP、社会与经济数据获取网站加以整理与介绍，若需其它GIS领域数据（如遥感影像数据、气象数据、土地土壤数据、农业数据等），大家可以点击上方专栏查看，也可以看这一篇汇总文</div> </li> <li><a href="/article/1950183268448006144.htm" title="python编程第十四课：数据可视化" target="_blank">python编程第十四课：数据可视化</a> 小小源助手 <a class="tag" taget="_blank" href="/search/Python%E4%BB%A3%E7%A0%81%E5%AE%9E%E4%BE%8B/1.htm">Python代码实例</a><a class="tag" taget="_blank" href="/search/%E4%BF%A1%E6%81%AF%E5%8F%AF%E8%A7%86%E5%8C%96/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数据可视化：让数据“开口说话”在当今数据爆炸的时代，数据可视化已成为探索数据规律、传达数据信息的关键技术。Python凭借其丰富的第三方库，为数据可视化提供了强大而灵活的解决方案。本文将带你深入了解Matplotlib库的基础绘图、Seaborn库的高级可视化以及交互式可视化工具Plotly，帮助你通过图表清晰地展示数据背后的故事。一、Matplotlib库基础绘图Matplotlib</div> </li> <li><a href="/article/1950181127176122368.htm" title="C++中std::variant的使用详解和实战代码示例" target="_blank">C++中std::variant的使用详解和实战代码示例</a> 点云SLAM <a class="tag" taget="_blank" href="/search/C%2B%2B/1.htm">C++</a><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><a class="tag" taget="_blank" href="/search/variant/1.htm">variant</a><a class="tag" taget="_blank" href="/search/C%2B%2B%E6%B3%9B%E5%9E%8B%E7%BC%96%E7%A8%8B/1.htm">C++泛型编程</a><a class="tag" taget="_blank" href="/search/%E8%81%94%E5%90%88%E4%BD%93/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%B1%BB%E5%9E%8B%E6%93%A6%E9%99%A4%E6%9C%BA%E5%88%B6/1.htm">类型擦除机制</a><a class="tag" taget="_blank" href="/search/C%2B%2B17/1.htm">C++17</a> <div>std::variant是C++17引入的一个类型安全的联合体（type-safeunion），它可以在多个类型之间存储一个值，并在编译时进行类型检查。它是现代C++类型擦除与泛型编程的核心工具之一，适用于构建可变类型结构、消息传递系统、状态机等。一、基本概念#includestd::variantv;类似于联合体union，但类型安全。std::variant只能存储其中一个类型的值。默认构造时</div> </li> <li><a href="/article/1950180497007112192.htm" title="【MySQL】MySQL数据库如何改名" target="_blank">【MySQL】MySQL数据库如何改名</a> 武昌库里写JAVA <a class="tag" taget="_blank" href="/search/%E9%9D%A2%E8%AF%95%E9%A2%98%E6%B1%87%E6%80%BB%E4%B8%8E%E8%A7%A3%E6%9E%90/1.htm">面试题汇总与解析</a><a class="tag" taget="_blank" href="/search/spring/1.htm">spring</a><a class="tag" taget="_blank" href="/search/boot/1.htm">boot</a><a class="tag" taget="_blank" href="/search/vue.js/1.htm">vue.js</a><a class="tag" taget="_blank" href="/search/sql/1.htm">sql</a><a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/%E5%AD%A6%E4%B9%A0/1.htm">学习</a> <div>MySQL建库授权语句https://www.jianshu.com/p/2237a9649ceeMySQL数据库改名的三种方法https://www.cnblogs.com/gomysql/p/3584881.htmlMySQL安全修改数据库名几种方法https://blog.csdn.net/haiross/article/details/51282417MySQL重命名数据库https://</div> </li> <li><a href="/article/66.htm" title="项目中枚举与注解的结合使用" target="_blank">项目中枚举与注解的结合使用</a> 飞翔的马甲 <a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/enum/1.htm">enum</a><a class="tag" taget="_blank" href="/search/annotation/1.htm">annotation</a> <div>前言：版本兼容，一直是迭代开发头疼的事，最近新版本加上了支持新题型，如果新创建一份问卷包含了新题型，那旧版本客户端就不支持，如果新创建的问卷不包含新题型，那么新旧客户端都支持。这里面我们通过给问卷类型枚举增加自定义注解的方式完成。顺便巩固下枚举与注解。一、枚举 1.在创建枚举类的时候，该类已继承java.lang.Enum类，所以自定义枚举类无法继承别的类，但可以实现接口。 </div> </li> <li><a href="/article/193.htm" title="【Scala十七】Scala核心十一：下划线_的用法" target="_blank">【Scala十七】Scala核心十一：下划线_的用法</a> bit1129 <a class="tag" taget="_blank" href="/search/scala/1.htm">scala</a> <div>下划线_在Scala中广泛应用，_的基本含义是作为占位符使用。_在使用时是出问题非常多的地方，本文将不断完善_的使用场景以及所表达的含义 1. 在高阶函数中使用 scala> val list = List(-3,8,7,9) list: List[Int] = List(-3, 8, 7, 9) scala> list.filter(_ > 7) r</div> </li> <li><a href="/article/320.htm" title="web缓存基础：术语、http报头和缓存策略" target="_blank">web缓存基础：术语、http报头和缓存策略</a> dalan_123 <a class="tag" taget="_blank" href="/search/Web/1.htm">Web</a> <div>对于很多人来说，去访问某一个站点，若是该站点能够提供智能化的内容缓存来提高用户体验，那么最终该站点的访问者将络绎不绝。缓存或者对之前的请求临时存储，是http协议实现中最核心的内容分发策略之一。分发路径中的组件均可以缓存内容来加速后续的请求，这是受控于对该内容所声明的缓存策略。接下来将讨web内容缓存策略的基本概念，具体包括如如何选择缓存策略以保证互联网范围内的缓存能够正确处理的您的内容，并谈论下</div> </li> <li><a href="/article/447.htm" title="crontab 问题" target="_blank">crontab 问题</a> 周凡杨 <a class="tag" taget="_blank" href="/search/linux/1.htm">linux</a><a class="tag" taget="_blank" href="/search/crontab/1.htm">crontab</a><a class="tag" taget="_blank" href="/search/unix/1.htm">unix</a> <div> 一： 0481-079 Reached a symbol that is not expected. 背景： */5 * * * * /usr/IBMIHS/rsync.sh </div> </li> <li><a href="/article/574.htm" title="让tomcat支持2级域名共享session" target="_blank">让tomcat支持2级域名共享session</a> g21121 <a class="tag" taget="_blank" href="/search/session/1.htm">session</a> <div>tomcat默认情况下是不支持2级域名共享session的，所有有些情况下登陆后从主域名跳转到子域名会发生链接session不相同的情况，但是只需修改几处配置就可以了。打开tomcat下conf下context.xml文件找到Context标签,修改为如下内容如果你的域名是www.test.com <Context sessionCookiePath="/path&q</div> </li> <li><a href="/article/701.htm" title="web报表工具FineReport常用函数的用法总结（数学和三角函数）" target="_blank">web报表工具FineReport常用函数的用法总结（数学和三角函数）</a> 老A不折腾 <a class="tag" taget="_blank" href="/search/Web/1.htm">Web</a><a class="tag" taget="_blank" href="/search/finereport/1.htm">finereport</a><a class="tag" taget="_blank" href="/search/%E6%80%BB%E7%BB%93/1.htm">总结</a> <div> ABS ABS(number):返回指定数字的绝对值。绝对值是指没有正负符号的数值。 Number:需要求出绝对值的任意实数。示例: ABS(-1.5)等于1.5。 ABS(0)等于0。 ABS(2.5)等于2.5。 ACOS ACOS(number):返回指定数值的反余弦值。反余弦值为一个角度，返回角度以弧度形式表示。 Number:需要返回角</div> </li> <li><a href="/article/828.htm" title="linux 启动java进程 sh文件" target="_blank">linux 启动java进程 sh文件</a> 墙头上一根草 <a class="tag" taget="_blank" href="/search/linux/1.htm">linux</a><a class="tag" taget="_blank" href="/search/shell/1.htm">shell</a><a class="tag" taget="_blank" href="/search/jar/1.htm">jar</a> <div>#!/bin/bash #初始化服务器的进程PId变量 user_pid=0; robot_pid=0; loadlort_pid=0; gateway_pid=0; ######### #检查相关服务器是否启动成功 #说明： #使用JDK自带的JPS命令及grep命令组合，准确查找pid #jps 加 l 参数，表示显示java的完整包路径 #使用awk，分割出pid </div> </li> <li><a href="/article/955.htm" title="我的spring学习笔记5-如何使用ApplicationContext替换BeanFactory" target="_blank">我的spring学习笔记5-如何使用ApplicationContext替换BeanFactory</a> aijuans <a class="tag" taget="_blank" href="/search/Spring+3+%E7%B3%BB%E5%88%97/1.htm">Spring 3 系列</a> <div>如何使用ApplicationContext替换BeanFactory？ package onlyfun.caterpillar.device; import org.springframework.beans.factory.BeanFactory; import org.springframework.beans.factory.xml.XmlBeanFactory; import</div> </li> <li><a href="/article/1082.htm" title="Linux 内存使用方法详细解析" target="_blank">Linux 内存使用方法详细解析</a> annan211 <a class="tag" taget="_blank" href="/search/linux/1.htm">linux</a><a class="tag" taget="_blank" href="/search/%E5%86%85%E5%AD%98/1.htm">内存</a><a class="tag" taget="_blank" href="/search/Linux%E5%86%85%E5%AD%98%E8%A7%A3%E6%9E%90/1.htm">Linux内存解析</a> <div>来源 http://blog.jobbole.com/45748/ 我是一名程序员，那么我在这里以一个程序员的角度来讲解Linux内存的使用。一提到内存管理，我们头脑中闪出的两个概念，就是虚拟内存，与物理内存。这两个概念主要来自于linux内核的支持。 Linux在内存管理上份为两级，一级是线性区，类似于00c73000-00c88000，对应于虚拟内存，它实际上不占用</div> </li> <li><a href="/article/1209.htm" title="数据库的单表查询常用命令及使用方法(-)" target="_blank">数据库的单表查询常用命令及使用方法(-)</a> 百合不是茶 <a class="tag" taget="_blank" href="/search/oracle/1.htm">oracle</a><a class="tag" taget="_blank" href="/search/%E5%87%BD%E6%95%B0/1.htm">函数</a><a class="tag" taget="_blank" href="/search/%E5%8D%95%E8%A1%A8%E6%9F%A5%E8%AF%A2/1.htm">单表查询</a> <div> 创建数据库; --建表 create table bloguser(username varchar2(20),userage number(10),usersex char(2)); 创建bloguser表,里面有三个字段 &nbs</div> </li> <li><a href="/article/1336.htm" title="多线程基础知识" target="_blank">多线程基础知识</a> bijian1013 <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/thread/1.htm">thread</a><a class="tag" taget="_blank" href="/search/java%E5%A4%9A%E7%BA%BF%E7%A8%8B/1.htm">java多线程</a> <div>一．进程和线程进程就是一个在内存中独立运行的程序，有自己的地址空间。如正在运行的写字板程序就是一个进程。 “多任务”：指操作系统能同时运行多个进程（程序）。如WINDOWS系统可以同时运行写字板程序、画图程序、WORD、Eclipse等。线程：是进程内部单一的一个顺序控制流。线程和进程 a. 每个进程都有独立的</div> </li> <li><a href="/article/1463.htm" title="fastjson简单使用实例" target="_blank">fastjson简单使用实例</a> bijian1013 <a class="tag" taget="_blank" href="/search/fastjson/1.htm">fastjson</a> <div>一.简介阿里巴巴fastjson是一个Java语言编写的高性能功能完善的JSON库。它采用一种“假定有序快速匹配”的算法，把JSON Parse的性能提升到极致，是目前Java语言中最快的JSON库；包括“序列化”和“反序列化”两部分，它具备如下特征： </div> </li> <li><a href="/article/1590.htm" title="【RPC框架Burlap】Spring集成Burlap" target="_blank">【RPC框架Burlap】Spring集成Burlap</a> bit1129 <a class="tag" taget="_blank" href="/search/spring/1.htm">spring</a> <div>Burlap和Hessian同属于codehaus的RPC调用框架，但是Burlap已经几年不更新，所以Spring在4.0里已经将Burlap的支持置为Deprecated,所以在选择RPC框架时，不应该考虑Burlap了。这篇文章还是记录下Burlap的用法吧，主要是复制粘贴了Hessian与Spring集成一文，【RPC框架Hessian四】Hessian与Spring集成 </div> </li> <li><a href="/article/1717.htm" title="【Mahout一】基于Mahout 命令参数含义" target="_blank">【Mahout一】基于Mahout 命令参数含义</a> bit1129 <a class="tag" taget="_blank" href="/search/Mahout/1.htm">Mahout</a> <div>1. mahout seqdirectory $ mahout seqdirectory --input (-i) input Path to job input directory(原始文本文件). --output (-o) output The directory pathna</div> </li> <li><a href="/article/1844.htm" title="linux使用flock文件锁解决脚本重复执行问题" target="_blank">linux使用flock文件锁解决脚本重复执行问题</a> ronin47 <a class="tag" taget="_blank" href="/search/linux+lock%E3%80%80%E9%87%8D%E5%A4%8D%E6%89%A7%E8%A1%8C/1.htm">linux lock　重复执行</a> <div>linux的crontab命令，可以定时执行操作，最小周期是每分钟执行一次。关于crontab实现每秒执行可参考我之前的文章《linux crontab 实现每秒执行》现在有个问题，如果设定了任务每分钟执行一次，但有可能一分钟内任务并没有执行完成，这时系统会再执行任务。导致两个相同的任务在执行。例如： <? // test .php </div> </li> <li><a href="/article/1971.htm" title="java-74-数组中有一个数字出现的次数超过了数组长度的一半，找出这个数字" target="_blank">java-74-数组中有一个数字出现的次数超过了数组长度的一半，找出这个数字</a> bylijinnan <a class="tag" taget="_blank" href="/search/java/1.htm">java</a> <div> public class OcuppyMoreThanHalf { /** * Q74 数组中有一个数字出现的次数超过了数组长度的一半，找出这个数字 * two solutions: * 1.O(n) * see <beauty of coding>--每次删除两个不同的数字，不改变数组的特性 * 2.O(nlogn) * 排序。中间</div> </li> <li><a href="/article/2098.htm" title="linux 系统相关命令" target="_blank">linux 系统相关命令</a> candiio <a class="tag" taget="_blank" href="/search/linux/1.htm">linux</a> <div>系统参数 cat /proc/cpuinfo cpu相关参数 cat /proc/meminfo 内存相关参数 cat /proc/loadavg 负载情况性能参数 1）top M：按内存使用排序 P：按CPU占用排序 1：显示各CPU的使用情况 k：kill进程 o：更多排序规则回车：刷新数据 2）ulimit ulimit -a：显示本用户的系统限制参</div> </li> <li><a href="/article/2225.htm" title="[经营与资产]保持独立性和稳定性对于软件开发的重要意义" target="_blank">[经营与资产]保持独立性和稳定性对于软件开发的重要意义</a> comsci <a class="tag" taget="_blank" href="/search/%E8%BD%AF%E4%BB%B6%E5%BC%80%E5%8F%91/1.htm">软件开发</a> <div> 一个软件的架构从诞生到成熟，中间要经过很多次的修正和改造如果在这个过程中，外界的其它行业的资本不断的介入这种软件架构的升级过程中那么软件开发者原有的设计思想和开发路线</div> </li> <li><a href="/article/2352.htm" title="在CentOS5.5上编译OpenJDK6" target="_blank">在CentOS5.5上编译OpenJDK6</a> Cwind <a class="tag" taget="_blank" href="/search/linux/1.htm">linux</a><a class="tag" taget="_blank" href="/search/OpenJDK/1.htm">OpenJDK</a> <div>几番周折终于在自己的CentOS5.5上编译成功了OpenJDK6，将编译过程和遇到的问题作一简要记录，备查。 0. OpenJDK介绍 OpenJDK是Sun（现Oracle）公司发布的基于GPL许可的Java平台的实现。其优点： 1、它的核心代码与同时期Sun（-> Oracle）的产品版基本上是一样的，血统纯正，不用担心性能问题，也基本上没什么兼容性问题；（代码上最主要的差异是</div> </li> <li><a href="/article/2479.htm" title="java乱码问题" target="_blank">java乱码问题</a> dashuaifu <a class="tag" taget="_blank" href="/search/java%E4%B9%B1%E7%A0%81%E9%97%AE%E9%A2%98/1.htm">java乱码问题</a><a class="tag" taget="_blank" href="/search/js%E4%B8%AD%E6%96%87%E4%B9%B1%E7%A0%81/1.htm">js中文乱码</a> <div>swfupload上传文件参数值为中文传递到后台接收中文乱码在js中用setPostParams（{"tag" : encodeURI( document.getElementByIdx_x("filetag").value，"utf-8")}）; 然后在servlet中String t</div> </li> <li><a href="/article/2606.htm" title="cygwin很多命令显示command not found的解决办法" target="_blank">cygwin很多命令显示command not found的解决办法</a> dcj3sjt126com <a class="tag" taget="_blank" href="/search/cygwin/1.htm">cygwin</a> <div>cygwin很多命令显示command not found的解决办法修改cygwin.BAT文件如下 @echo off D: set CYGWIN=tty notitle glob set PATH=%PATH%;d:\cygwin\bin;d:\cygwin\sbin;d:\cygwin\usr\bin;d:\cygwin\usr\sbin;d:\cygwin\us</div> </li> <li><a href="/article/2733.htm" title="[介绍]从 Yii 1.1 升级" target="_blank">[介绍]从 Yii 1.1 升级</a> dcj3sjt126com <a class="tag" taget="_blank" href="/search/PHP/1.htm">PHP</a><a class="tag" taget="_blank" href="/search/yii2/1.htm">yii2</a> <div>2.0 版框架是完全重写的，在 1.1 和 2.0 两个版本之间存在相当多差异。因此从 1.1 版升级并不像小版本间的跨越那么简单，通过本指南你将会了解两个版本间主要的不同之处。如果你之前没有用过 Yii 1.1，可以跳过本章，直接从"入门篇"开始读起。请注意，Yii 2.0 引入了很多本章并没有涉及到的新功能。强烈建议你通读整部权威指南来了解所有新特性。这样有可能会发</div> </li> <li><a href="/article/2860.htm" title="Linux SSH免登录配置总结" target="_blank">Linux SSH免登录配置总结</a> eksliang <a class="tag" taget="_blank" href="/search/ssh-keygen/1.htm">ssh-keygen</a><a class="tag" taget="_blank" href="/search/Linux+SSH%E5%85%8D%E7%99%BB%E5%BD%95%E8%AE%A4%E8%AF%81/1.htm">Linux SSH免登录认证</a><a class="tag" taget="_blank" href="/search/Linux+SSH%E4%BA%92%E4%BF%A1/1.htm">Linux SSH互信</a> <div>转载请出自出处：http://eksliang.iteye.com/blog/2187265 一、原理我们使用ssh-keygen在ServerA上生成私钥跟公钥，将生成的公钥拷贝到远程机器ServerB上后,就可以使用ssh命令无需密码登录到另外一台机器ServerB上。生成公钥与私钥有两种加密方式，第一种是</div> </li> <li><a href="/article/2987.htm" title="手势滑动销毁Activity" target="_blank">手势滑动销毁Activity</a> gundumw100 <a class="tag" taget="_blank" href="/search/android/1.htm">android</a> <div>老是效仿ios，做android的真悲催！有需求：需要手势滑动销毁一个Activity 怎么办尼？自己写？不用~，网上先问一下百度。结果： http://blog.csdn.net/xiaanming/article/details/20934541 首先将你需要的Activity继承SwipeBackActivity，它会在你的布局根目录新增一层SwipeBackLay</div> </li> <li><a href="/article/3114.htm" title="JavaScript变换表格边框颜色" target="_blank">JavaScript变换表格边框颜色</a> ini <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/Web/1.htm">Web</a><a class="tag" taget="_blank" href="/search/html5/1.htm">html5</a><a class="tag" taget="_blank" href="/search/css/1.htm">css</a> <div>效果查看：http://hovertree.com/texiao/js/2.htm代码如下，保存到HTML文件也可以查看效果： <html> <head> <meta charset="utf-8"> <title>表格边框变换颜色代码-何问起</title> </head> <body&</div> </li> <li><a href="/article/3241.htm" title="Kafka Rest : Confluent" target="_blank">Kafka Rest : Confluent</a> kane_xie <a class="tag" taget="_blank" href="/search/kafka/1.htm">kafka</a><a class="tag" taget="_blank" href="/search/REST/1.htm">REST</a><a class="tag" taget="_blank" href="/search/confluent/1.htm">confluent</a> <div>最近拿到一个kafka rest的需求，但kafka暂时还没有提供rest api（应该是有在开发中，毕竟rest这么火），上网搜了一下，找到一个Confluent Platform，本文简单介绍一下安装。这里插一句，给大家推荐一个九尾搜索，原名叫谷粉SOSO，不想fanqiang谷歌的可以用这个。以前在外企用谷歌用习惯了，出来之后用度娘搜技术问题，那匹配度简直感人。环境声明：Ubu</div> </li> <li><a href="/article/3368.htm" title="Calender不是单例" target="_blank">Calender不是单例</a> men4661273 <a class="tag" taget="_blank" href="/search/%E5%8D%95%E4%BE%8B/1.htm">单例</a><a class="tag" taget="_blank" href="/search/Calender/1.htm">Calender</a> <div> 在我们使用Calender的时候，使用过Calendar.getInstance()来获取一个日期类的对象，这种方式跟单例的获取方式一样，那么它到底是不是单例呢，如果是单例的话，一个对象修改内容之后，另外一个线程中的数据不久乱套了吗？从试验以及源码中可以得出，Calendar不是单例。测试： Calendar c1 = </div> </li> <li><a href="/article/3495.htm" title="线程内存和主内存之间联系" target="_blank">线程内存和主内存之间联系</a> qifeifei <a class="tag" taget="_blank" href="/search/java+thread/1.htm">java thread</a> <div>1， java多线程共享主内存中变量的时候，一共会经过几个阶段， lock:将主内存中的变量锁定，为一个线程所独占。 unclock:将lock加的锁定解除，此时其它的线程可以有机会访问此变量。 read:将主内存中的变量值读到工作内存当中。 load:将read读取的值保存到工作内存中的变量副本中。 </div> </li> <li><a href="/article/3622.htm" title="schedule和scheduleAtFixedRate" target="_blank">schedule和scheduleAtFixedRate</a> tangqi609567707 <a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/timer/1.htm">timer</a><a class="tag" taget="_blank" href="/search/schedule/1.htm">schedule</a> <div>原文地址：http://blog.csdn.net/weidan1121/article/details/527307 import java.util.Timer;import java.util.TimerTask;import java.util.Date; /** * @author vincent */public class TimerTest { </div> </li> <li><a href="/article/3749.htm" title="erlang 部署" target="_blank">erlang 部署</a> wudixiaotie <a class="tag" taget="_blank" href="/search/erlang/1.htm">erlang</a> <div>1.如果在启动节点的时候报这个错： {"init terminating in do_boot",{'cannot load',elf_format,get_files}} 则需要在reltool.config中加入 {app, hipe, [{incl_cond, exclude}]}, 2.当generate时，遇到： ERROR</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>

【Web前端】一文带你吃透HTML(完整篇)

开始前端之旅吧!

一.HTML简介

1.什么是HTML？

2.HTML 标签

3.HTML 元素

4.HTML版本

5.Web 浏览器

6.HTML 网页结构

7.中文编码

8.编写第一个网页

二.HTML编辑器

三.HTML基础

1.HTML 标题

`-`
标签来定义的，例如：

`<h1>一级标题h1> <h2>二级标题h2> <h3>三级标题h3>`

2.HTML 段落

HTML 段落是通过标签
来定义的，例如：

`<p>段落1p> <p>段落2p> <p>段落3p>`

标签来定义的，例如：

`<h1>一级标题h1> <h2>二级标题h2> <h3>三级标题h3>`

2.HTML 段落

3.HTML 链接

4.HTML 图像

四.HTML元素

1.HTML 元素语法

2.嵌套的 HTML 元素

3.HTML 空元素

五.HTML属性

六.HTML标题

1.HTML标题

2.HTML水平线

3.HTML 注释

七.HTML段落

1.HTML段落

2.HTML换行

八.HTML文本格式化

九.HTML链接

十.HTML头部

【Web前端】一文带你吃透HTML(完整篇)

开始前端之旅吧!

一.HTML简介

1.什么是HTML？

2.HTML 标签

3.HTML 元素

4.HTML版本

5.Web 浏览器

6.HTML 网页结构

7.中文编码

8.编写第一个网页

二.HTML编辑器

三.HTML基础

1.HTML 标题

- 标签来定义的，例如： <h1>一级标题h1> <h2>二级标题h2> <h3>三级标题h3> 2.HTML 段落 HTML 段落是通过标签 来定义的，例如： <p>段落1p> <p>段落2p> <p>段落3p>

标签来定义的，例如： <h1>一级标题h1> <h2>二级标题h2> <h3>三级标题h3>

2.HTML 段落

3.HTML 链接

4.HTML 图像

四.HTML元素

1.HTML 元素语法

2.嵌套的 HTML 元素

3.HTML 空元素

五.HTML属性

六.HTML标题

1.HTML标题

2.HTML水平线

3.HTML 注释

七.HTML段落

1.HTML段落

2.HTML换行

八.HTML文本格式化

九.HTML链接

十.HTML头部

`-`
标签来定义的，例如：

`<h1>一级标题h1> <h2>二级标题h2> <h3>三级标题h3>`

2.HTML 段落

HTML 段落是通过标签
来定义的，例如：

`<p>段落1p> <p>段落2p> <p>段落3p>`

标签来定义的，例如：

`<h1>一级标题h1> <h2>二级标题h2> <h3>三级标题h3>`