HTML零基础入门详细教程

欢迎来到HTML的零基础入门教程。HTML是构建网页的基础,是Web开发的必备技能之一。在本教程中,我们将介绍HTML的基础知识,包括HTML的基本结构、标签、属性等内容。让我们开始吧!

1. HTML基本结构

HTML文档由标签(tag)和文本组成。标签用于描述文本的含义和结构,而文本则是标签所描述的内容。HTML文档的基本结构如下:

DOCTYPE html>
<html>
  <head>
    <title>页面标题title>
  head>
  <body>
    页面内容
  body>
html>

上面的代码是一个最简单的HTML文档。其中,声明了文档类型,告诉浏览器这是一个HTML5文档。标签是文档的根元素,包含了整个文档的内容。标签用于定义文档的头部,包含了一些元数据和引用的外部资源。</code>标签定义了文档的标题,显示在浏览器的标签页上。<code><body></code>标签定义了文档的主体,包含了页面的内容。</p> <h3>2. HTML标签</h3> <p>HTML标签是用于描述文本的含义和结构的元素。HTML标签以<code><</code>和<code>></code>括起来,通常成对出现,有开始标签和结束标签。例如,<code><p></code>标签表示一个段落,它的开始标签是<code><p></code>,结束标签是<code></p></code>。在开始标签中,可以添加属性(attribute),用于描述标签的特性。例如,<code><a></code>标签表示一个链接,可以添加<code>href</code>属性来指定链接的地址。</p> <p>下面是一些常用的HTML标签:</p> <ul> <li><code><h1></code>~<code><h6></code>:表示标题,从大到小依次排列。</li> <li><code><p></code>:表示段落。</li> <li><code><a></code>:表示链接。</li> <li><code><img></code>:表示图片。</li> <li><code><ul></code>和<code><li></code>:表示无序列表。</li> <li><code><ol></code>和<code><li></code>:表示有序列表。</li> <li><code><table></code>、<code><tr></code>、<code><th></code>和<code><td></code>:表示表格。</li> <li><code><form></code>、<code><input></code>和<code><button></code>:表示表单。</li> </ul> <h3>3. HTML属性</h3> <p>HTML属性是用于描述标签的特性的。属性通常包含一个名称和一个值,中间用等号连接。例如,<code><a href="https://www.google.com">Google</a></code>中的<code>href</code>是属性名称,<code>https://www.google.com</code>是属性值。不同的标签支持不同的属性,例如<code><a></code>标签支持<code>href</code>属性,<code><img></code>标签支持<code>src</code>和<code>alt</code>属性。</p> <h3>4. HTML注释</h3> <p>HTML注释用于在代码中添加注释,不会在浏览器中显示。注释以<code><!--</code>开头,以<code>--></code>结尾。例如,<code><!-- 这是一个注释 --></code>表示一个注释。</p> <h3>5. HTML实例</h3> <p>下面是一个简单的HTML实例,展示了一些常用的标签和属性:</p> <pre><code class="prism language-html"><span class="token doctype"><span class="token punctuation"><!</span><span class="token doctype-tag">DOCTYPE</span> <span class="token name">html</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>html</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>head</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>title</span><span class="token punctuation">></span></span>我的网页<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>title</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"></</span>head</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>body</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>h1</span><span class="token punctuation">></span></span>欢迎来到我的网页<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>h1</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>p</span><span class="token punctuation">></span></span>这是一个段落。<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>p</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>a</span> <span class="token attr-name">href</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>https://www.google.com<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Google<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>a</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>img</span> <span class="token attr-name">src</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>https://www.w3schools.com/images/w3schools_green.jpg<span class="token punctuation">"</span></span> <span class="token attr-name">alt</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>W3Schools<span class="token punctuation">"</span></span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>ul</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>li</span><span class="token punctuation">></span></span>无序列表项1<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>li</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>li</span><span class="token punctuation">></span></span>无序列表项2<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>li</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"></</span>ul</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>ol</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>li</span><span class="token punctuation">></span></span>有序列表项1<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>li</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>li</span><span class="token punctuation">></span></span>有序列表项2<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>li</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"></</span>ol</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>table</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>tr</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>th</span><span class="token punctuation">></span></span>姓名<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>th</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>th</span><span class="token punctuation">></span></span>年龄<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>th</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"></</span>tr</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>tr</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>td</span><span class="token punctuation">></span></span>张三<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>td</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>td</span><span class="token punctuation">></span></span>20<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>td</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"></</span>tr</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>tr</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>td</span><span class="token punctuation">></span></span>李四<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>td</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>td</span><span class="token punctuation">></span></span>22<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>td</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"></</span>tr</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"></</span>table</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>form</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>label</span><span class="token punctuation">></span></span>用户名:<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>label</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>input</span> <span class="token attr-name">type</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>text<span class="token punctuation">"</span></span> <span class="token attr-name">name</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>username<span class="token punctuation">"</span></span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>label</span><span class="token punctuation">></span></span>密码:<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>label</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>input</span> <span class="token attr-name">type</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>password<span class="token punctuation">"</span></span> <span class="token attr-name">name</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>password<span class="token punctuation">"</span></span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>button</span> <span class="token attr-name">type</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>submit<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>登录<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>button</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"></</span>form</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"></</span>body</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"></</span>html</span><span class="token punctuation">></span></span> </code></pre> <h3>6.HTML语法规范</h3> <p>以上就是HTML的零基础入门教程,希望能对你有所帮助。如果你想深入学习HTML,可以继续学习HTML的语法、样式和脚本等内容。</p> <p>HTML语法规范指的是HTML文件中各种标签、属性、元素的书写方式和使用规则,下面是HTML语法规范的一些基本要点:</p> <ol> <li> <p>HTML标签一般都是成对出现的,有开始标签和结束标签,如<code><p></code>和<code></p></code>。</p> </li> <li> <p>HTML标签可以包含属性,属性一般是键值对的形式,如<code><img src="image.jpg" alt="图片"></code>。</p> </li> <li> <p>HTML标签和属性的名称不区分大小写,但是建议使用小写。</p> </li> <li> <p>HTML文档必须包含<code><!DOCTYPE></code>声明,用于指定HTML版本和文档类型。</p> </li> <li> <p>HTML文档必须包含<code><html></code>标签,所有的HTML标记都应该在<code><html></code>和<code></html></code>之间。</p> </li> <li> <p>HTML文档必须包含<code><head></code>标签和<code><body></code>标签,<code><head></code>标签中一般包含文档的元数据,而<code><body></code>标签中包含文档的主要内容。</p> </li> <li> <p>在HTML中,空格和换行符不会影响页面的呈现效果,但是可以提高代码的可读性。</p> </li> <li> <p>在HTML中,可以使用注释来对代码进行说明,注释的格式为<code><!--注释内容--></code>。</p> </li> <li> <p>在HTML中,可以使用特殊字符实体来表示一些特殊符号,如<code><</code>表示小于号<code><</code>,<code>></code>表示大于号<code>></code>,<code>&</code>表示&符号等。</p> </li> </ol> <p>以上是HTML语法规范的一些基本要点,需要注意的是,HTML语法规范是不断发展和变化的,建议开发者时刻关注最新的HTML规范。</p> <h3>7.超链接标签</h3> <p>超链接标签是HTML中最常用的标签之一,它可以创建一个指向其他网页、文件、位置、电子邮件地址或任何其他URL的链接。超链接标签使用<code><a></code>标签来定义,其中<code>href</code>属性指定了链接的目标地址。</p> <p>下面是一个基本的超链接标签的例子:</p> <pre><code class="prism language-html"><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>a</span> <span class="token attr-name">href</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>https://www.example.com<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>点击这里<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>a</span><span class="token punctuation">></span></span> </code></pre> <p>上面的代码创建了一个指向<code>https://www.example.com</code>的链接,链接的文本是“点击这里”。当用户点击链接时,浏览器将会跳转到指定的URL。</p> <p>除了指向URL,超链接标签还可以指向页面内的位置(锚点)或其他文件。例如,下面的代码创建了一个指向页面内的锚点的链接:</p> <pre><code class="prism language-html"><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>a</span> <span class="token attr-name">href</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>#section1<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>跳转到第一部分<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>a</span><span class="token punctuation">></span></span> </code></pre> <p>在这个例子中,<code>href</code>属性的值是一个以<code>#</code>开头的锚点名称,浏览器会跳转到页面中具有该名称的元素(例如一个<code><div></code>)。</p> <p>超链接标签还可以包含其他HTML元素,例如文本、图像和按钮。例如,下面的代码创建了一个包含图像的链接:</p> <pre><code class="prism language-html"><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>a</span> <span class="token attr-name">href</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>https://www.example.com<span class="token punctuation">"</span></span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>img</span> <span class="token attr-name">src</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>image.jpg<span class="token punctuation">"</span></span> <span class="token attr-name">alt</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>图片<span class="token punctuation">"</span></span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"></</span>a</span><span class="token punctuation">></span></span> </code></pre> <p>在这个例子中,链接的文本是一个图像,当用户点击图像时,浏览器将会跳转到指定的URL。</p> <h3>8.图像标签和路径</h3> <p>图像标签是HTML中用于显示图像的标签,通常使用<code><img></code>标签来创建。<code><img></code>标签是一个空标签,没有闭合标签,它有以下属性:</p> <ul> <li><code>src</code>:指定图像的路径,可以是相对路径或绝对路径。</li> <li><code>alt</code>:指定图像的替代文本,当图像无法显示时,将显示替代文本。</li> <li><code>width</code>:指定图像的宽度,可以是像素值或百分比。</li> <li><code>height</code>:指定图像的高度,可以是像素值或百分比。</li> </ul> <p>下面是一个示例代码,演示如何使用<code><img></code>标签来显示图像:</p> <pre><code class="prism language-html"><span class="token doctype"><span class="token punctuation"><!</span><span class="token doctype-tag">DOCTYPE</span> <span class="token name">html</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>html</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>head</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>title</span><span class="token punctuation">></span></span>图像标签示例<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>title</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"></</span>head</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>body</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>h1</span><span class="token punctuation">></span></span>欢迎使用图像标签示例<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>h1</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>img</span> <span class="token attr-name">src</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>images/logo.png<span class="token punctuation">"</span></span> <span class="token attr-name">alt</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>Logo<span class="token punctuation">"</span></span> <span class="token attr-name">width</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>200<span class="token punctuation">"</span></span> <span class="token attr-name">height</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>100<span class="token punctuation">"</span></span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"></</span>body</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"></</span>html</span><span class="token punctuation">></span></span> </code></pre> <p>在上述示例中,<code><img></code>标签的<code>src</code>属性指定了图像的路径,<code>alt</code>属性指定了替代文本,<code>width</code>和<code>height</code>属性指定了图像的宽度和高度。</p> <p>关于图像路径,有以下几种方式:</p> <ul> <li>相对路径:相对于当前HTML文件的路径。例如,如果图像文件与HTML文件在同一目录下,可以使用<code>src="logo.png"</code>指定相对路径。</li> <li>绝对路径:相对于网站根目录的路径。例如,如果图像文件位于网站根目录下的<code>images</code>目录中,可以使用<code>src="/images/logo.png"</code>指定绝对路径。</li> <li>完整路径:包含协议、域名和路径的完整URL。例如,可以使用<code>src="http://example.com/images/logo.png"</code>指定完整路径。</li> </ul> <p>需要注意的是,如果使用相对路径,需要确保图像文件与HTML文件在同一目录下或在正确的目录下。</p> <h3>9.文本格式化标签</h3> <p>文本格式化标签是HTML中用于对文本进行格式化的标签,可以使文本显示更加美观、易读。常用的文本格式化标签包括:</p> <ol> <li><code><b></code>标签:用于加粗文本。</li> </ol> <pre><code class="prism language-html"><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>p</span><span class="token punctuation">></span></span>这是一段<span class="token tag"><span class="token tag"><span class="token punctuation"><</span>b</span><span class="token punctuation">></span></span>加粗<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>b</span><span class="token punctuation">></span></span>的文本。<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>p</span><span class="token punctuation">></span></span> </code></pre> <ol start="2"> <li><code><i></code>标签:用于斜体文本。</li> </ol> <pre><code class="prism language-html"><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>p</span><span class="token punctuation">></span></span>这是一段<span class="token tag"><span class="token tag"><span class="token punctuation"><</span>i</span><span class="token punctuation">></span></span>斜体<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>i</span><span class="token punctuation">></span></span>的文本。<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>p</span><span class="token punctuation">></span></span> </code></pre> <ol start="3"> <li><code><u></code>标签:用于下划线文本。</li> </ol> <pre><code class="prism language-html"><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>p</span><span class="token punctuation">></span></span>这是一段<span class="token tag"><span class="token tag"><span class="token punctuation"><</span>u</span><span class="token punctuation">></span></span>下划线<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>u</span><span class="token punctuation">></span></span>的文本。<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>p</span><span class="token punctuation">></span></span> </code></pre> <ol start="4"> <li><code><s></code>标签:用于删除线文本。</li> </ol> <pre><code class="prism language-html"><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>p</span><span class="token punctuation">></span></span>这是一段<span class="token tag"><span class="token tag"><span class="token punctuation"><</span>s</span><span class="token punctuation">></span></span>删除线<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>s</span><span class="token punctuation">></span></span>的文本。<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>p</span><span class="token punctuation">></span></span> </code></pre> <ol start="5"> <li><code><sub></code>标签:用于下标文本。</li> </ol> <pre><code class="prism language-html"><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>p</span><span class="token punctuation">></span></span>这是一段化学式:H<span class="token tag"><span class="token tag"><span class="token punctuation"><</span>sub</span><span class="token punctuation">></span></span>2<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>sub</span><span class="token punctuation">></span></span>O。<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>p</span><span class="token punctuation">></span></span> </code></pre> <ol start="6"> <li><code><sup></code>标签:用于上标文本。</li> </ol> <pre><code class="prism language-html"><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>p</span><span class="token punctuation">></span></span>这是一段数学公式:x<span class="token tag"><span class="token tag"><span class="token punctuation"><</span>sup</span><span class="token punctuation">></span></span>2<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>sup</span><span class="token punctuation">></span></span> + y<span class="token tag"><span class="token tag"><span class="token punctuation"><</span>sup</span><span class="token punctuation">></span></span>2<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>sup</span><span class="token punctuation">></span></span> = z<span class="token tag"><span class="token tag"><span class="token punctuation"><</span>sup</span><span class="token punctuation">></span></span>2<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>sup</span><span class="token punctuation">></span></span>。<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>p</span><span class="token punctuation">></span></span> </code></pre> <ol start="7"> <li><code><code></code>标签:用于代码文本。</li> </ol> <pre><code class="prism language-html"><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>p</span><span class="token punctuation">></span></span>这是一段代码:<span class="token tag"><span class="token tag"><span class="token punctuation"><</span>code</span><span class="token punctuation">></span></span>print("Hello, World!")<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>code</span><span class="token punctuation">></span></span>。<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>p</span><span class="token punctuation">></span></span> </code></pre> <ol start="8"> <li><code><pre></code>标签:用于预格式化文本,保留空格和换行符。</li> </ol> <pre><code class="prism language-html"><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>pre</span><span class="token punctuation">></span></span> 这是一段预格式化文本, 保留空格和换行符。 <span class="token tag"><span class="token tag"><span class="token punctuation"></</span>pre</span><span class="token punctuation">></span></span> </code></pre> <p>需要注意的是,这些标签只是用于格式化文本的辅助手段,应该根据具体情况合理使用,不要滥用。同时,为了提高网页的可访问性,应该避免使用纯样式标签(如<code><b></code>、<code><i></code>、<code><u></code>等),而应该使用CSS样式来实现文本格式化。</p> <h3>10.换行标签</h3> <p>文本格式化标签是HTML中用于对文本进行格式化的标签,可以使文本显示更加美观、易读。常用的文本格式化标签包括:</p> <ol> <li><code><b></code>标签:用于加粗文本。</li> </ol> <pre><code class="prism language-html"><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>p</span><span class="token punctuation">></span></span>这是一段<span class="token tag"><span class="token tag"><span class="token punctuation"><</span>b</span><span class="token punctuation">></span></span>加粗<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>b</span><span class="token punctuation">></span></span>的文本。<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>p</span><span class="token punctuation">></span></span> </code></pre> <ol start="2"> <li><code><i></code>标签:用于斜体文本。</li> </ol> <pre><code class="prism language-html"><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>p</span><span class="token punctuation">></span></span>这是一段<span class="token tag"><span class="token tag"><span class="token punctuation"><</span>i</span><span class="token punctuation">></span></span>斜体<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>i</span><span class="token punctuation">></span></span>的文本。<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>p</span><span class="token punctuation">></span></span> </code></pre> <ol start="3"> <li><code><u></code>标签:用于下划线文本。</li> </ol> <pre><code class="prism language-html"><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>p</span><span class="token punctuation">></span></span>这是一段<span class="token tag"><span class="token tag"><span class="token punctuation"><</span>u</span><span class="token punctuation">></span></span>下划线<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>u</span><span class="token punctuation">></span></span>的文本。<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>p</span><span class="token punctuation">></span></span> </code></pre> <ol start="4"> <li><code><s></code>标签:用于删除线文本。</li> </ol> <pre><code class="prism language-html"><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>p</span><span class="token punctuation">></span></span>这是一段<span class="token tag"><span class="token tag"><span class="token punctuation"><</span>s</span><span class="token punctuation">></span></span>删除线<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>s</span><span class="token punctuation">></span></span>的文本。<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>p</span><span class="token punctuation">></span></span> </code></pre> <ol start="5"> <li><code><sub></code>标签:用于下标文本。</li> </ol> <pre><code class="prism language-html"><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>p</span><span class="token punctuation">></span></span>这是一段化学式:H<span class="token tag"><span class="token tag"><span class="token punctuation"><</span>sub</span><span class="token punctuation">></span></span>2<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>sub</span><span class="token punctuation">></span></span>O。<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>p</span><span class="token punctuation">></span></span> </code></pre> <ol start="6"> <li><code><sup></code>标签:用于上标文本。</li> </ol> <pre><code class="prism language-html"><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>p</span><span class="token punctuation">></span></span>这是一段数学公式:x<span class="token tag"><span class="token tag"><span class="token punctuation"><</span>sup</span><span class="token punctuation">></span></span>2<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>sup</span><span class="token punctuation">></span></span> + y<span class="token tag"><span class="token tag"><span class="token punctuation"><</span>sup</span><span class="token punctuation">></span></span>2<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>sup</span><span class="token punctuation">></span></span> = z<span class="token tag"><span class="token tag"><span class="token punctuation"><</span>sup</span><span class="token punctuation">></span></span>2<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>sup</span><span class="token punctuation">></span></span>。<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>p</span><span class="token punctuation">></span></span> </code></pre> <ol start="7"> <li><code><code></code>标签:用于代码文本。</li> </ol> <pre><code class="prism language-html"><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>p</span><span class="token punctuation">></span></span>这是一段代码:<span class="token tag"><span class="token tag"><span class="token punctuation"><</span>code</span><span class="token punctuation">></span></span>print("Hello, World!")<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>code</span><span class="token punctuation">></span></span>。<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>p</span><span class="token punctuation">></span></span> </code></pre> <ol start="8"> <li><code><pre></code>标签:用于预格式化文本,保留空格和换行符。</li> </ol> <pre><code class="prism language-html"><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>pre</span><span class="token punctuation">></span></span> 这是一段预格式化文本, 保留空格和换行符。 <span class="token tag"><span class="token tag"><span class="token punctuation"></</span>pre</span><span class="token punctuation">></span></span> </code></pre> <p>需要注意的是,这些标签只是用于格式化文本的辅助手段,应该根据具体情况合理使用,不要滥用。同时,为了提高网页的可访问性,应该避免使用纯样式标签(如<code><b></code>、<code><i></code>、<code><u></code>等),而应该使用CSS样式来实现文本格式化。</p> </div> </div> </div> </div> </div> <!--PC和WAP自适应版--> <div id="SOHUCS" sid="1905793937642156032"></div> <script type="text/javascript" src="/views/front/js/chanyan.js"></script> <!-- 文章页-底部 动态广告位 --> <div class="youdao-fixed-ad" id="detail_ad_bottom"></div> </div> <div class="col-md-3"> <div class="row" id="ad"> <!-- 文章页-右侧1 动态广告位 --> <div id="right-1" class="col-lg-12 col-md-12 col-sm-4 col-xs-4 ad"> <div class="youdao-fixed-ad" id="detail_ad_1"> </div> </div> <!-- 文章页-右侧2 动态广告位 --> <div id="right-2" class="col-lg-12 col-md-12 col-sm-4 col-xs-4 ad"> <div class="youdao-fixed-ad" id="detail_ad_2"></div> </div> <!-- 文章页-右侧3 动态广告位 --> <div id="right-3" class="col-lg-12 col-md-12 col-sm-4 col-xs-4 ad"> <div class="youdao-fixed-ad" id="detail_ad_3"></div> </div> </div> </div> </div> </div> </div> <div class="container"> <h4 class="pt20 mb15 mt0 border-top">你可能感兴趣的:(前端,html,css,前端)</h4> <div id="paradigm-article-related"> <div class="recommend-post mb30"> <ul class="widget-links"> <li><a href="/article/1942767322414510080.htm" title="Session:在多个请求之间跟踪用户状态" target="_blank">Session:在多个请求之间跟踪用户状态</a> <span class="text-muted"></span> <div>前端开发工程师、技术日更博主、已过CET6阿珊和她的猫_CSDN博客专家、23年度博客之星前端领域TOP1牛客高级专题作者、打造专栏《前端面试必备》、《2024面试高频手撕题》、《前端求职突破计划》蓝桥云课签约作者、上架课程《Vue.js和Egg.js开发企业级健康管理项目》、《带你从入门到实战全面掌握uni-app》文章目录一、Session的基本概念1.SessionID2.Session数据</div> </li> <li><a href="/article/1942767322909437952.htm" title="CORS(跨域资源共享):跨域请求的解决方案" target="_blank">CORS(跨域资源共享):跨域请求的解决方案</a> <span class="text-muted">阿珊和她的猫</span> <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>前端开发工程师、技术日更博主、已过CET6阿珊和她的猫_CSDN博客专家、23年度博客之星前端领域TOP1牛客高级专题作者、打造专栏《前端面试必备》、《2024面试高频手撕题》、《前端求职突破计划》蓝桥云课签约作者、上架课程《Vue.js和Egg.js开发企业级健康管理项目》、《带你从入门到实战全面掌握uni-app》文章目录一、CORS的基本概念1.简单请求2.预检请求二、设置CORS使用Nod</div> </li> <li><a href="/article/1942761144296992768.htm" title="原生cesium 实现 多图例展示+点聚合(base64图标)" target="_blank">原生cesium 实现 多图例展示+点聚合(base64图标)</a> <span class="text-muted"></span> <div>个人简介:某大型测绘遥感企业资深Webgis开发工程师,软件设计师(中级)、CSDN优质创作者作者:柳晓黑胡椒❣️专栏:cesium实践(原生)若有帮助,还请关注➕点赞➕收藏,不行的话我再努努力需求背景解决思路解决效果index.vue需求背景1.需要展示多个站点图例的图表及闪烁效果2.需要考虑层级高时,多图例的点聚合效果,且点聚合显示需要采用设计的圆形图标解决思路闪烁效果:采用css3的anim</div> </li> <li><a href="/article/1942760513691774976.htm" title="Android性能实战——Systrace分析实例(十二)" target="_blank">Android性能实战——Systrace分析实例(十二)</a> <span class="text-muted">c小旭</span> <a class="tag" taget="_blank" href="/search/Android%E6%80%A7%E8%83%BD%E4%BC%98%E5%8C%96/1.htm">Android性能优化</a><a class="tag" taget="_blank" href="/search/android/1.htm">android</a><a class="tag" taget="_blank" href="/search/%E6%80%A7%E8%83%BD%E4%BC%98%E5%8C%96/1.htm">性能优化</a> <div>上一篇文章我们得到了一个html文件,这里我们来通过拿到的trace.html文件来分析一些耗时场景。一、简单场景分析1、快捷键使用在开始分析案例之前我们先来看一下快捷键的使用,可以加快查看Systrace的速度,下面是一些常用的快捷键。W:放大Systrace,放大可以更好地看清局部细节S:缩小Systrace,缩小以查看整体A:左移D:右移M:高亮选中当前鼠标点击的段(可以快速标识出这个方法的</div> </li> <li><a href="/article/1942750425878949888.htm" title="AntDesignPro动态路由配置全攻略" target="_blank">AntDesignPro动态路由配置全攻略</a> <span class="text-muted">bemyrunningdog</span> <a class="tag" taget="_blank" href="/search/%E5%89%8D%E5%90%8E%E7%AB%AF/1.htm">前后端</a> <div>目录AntDesignPro前后端动态路由配置指南(TypeScript+Java)一、整体架构二、Java后端实现1.数据库设计(MySQL)2.实体类定义3.DTO对象4.服务层实现5.控制器三、前端实现(TypeScript)1.定义路由类型2.路由转换器3.应用配置(app.tsx)4.路由加载优化四、权限控制整合1.Java端权限检查2.前端权限整合五、部署优化方案六、生产环境建议七、完</div> </li> <li><a href="/article/1942742233123975168.htm" title="Docker快速部署Hive服务" target="_blank">Docker快速部署Hive服务</a> <span class="text-muted">长路 ㅤ   </span> <a class="tag" taget="_blank" href="/search/%E8%BF%90%E7%BB%B4/1.htm">运维</a><a class="tag" taget="_blank" href="/search/Docker%E9%85%8D%E7%BD%AE/1.htm">Docker配置</a><a class="tag" taget="_blank" href="/search/Hive%E7%8E%AF%E5%A2%83/1.htm">Hive环境</a><a class="tag" taget="_blank" href="/search/%E5%A4%A7%E6%95%B0%E6%8D%AE/1.htm">大数据</a><a class="tag" taget="_blank" href="/search/%E8%BF%9C%E7%A8%8B%E8%B0%83%E8%AF%95/1.htm">远程调试</a> <div>文章目录前言Docker快速配置hive环境资料获取前言博主介绍:✌目前全网粉丝4W+,csdn博客专家、Java领域优质创作者,博客之星、阿里云平台优质作者、专注于Java后端技术领域。涵盖技术内容:Java后端、大数据、算法、分布式微服务、中间件、前端、运维等。博主所有博客文件目录索引:博客目录索引(持续更新)CSDN搜索:长路视频平台:b站-Coder长路Docker快速配置hive环境Ap</div> </li> <li><a href="/article/1942742232708739072.htm" title="从UI设计到数字孪生实战:构建智慧教育的个性化学习平台" target="_blank">从UI设计到数字孪生实战:构建智慧教育的个性化学习平台</a> <span class="text-muted"></span> <div>hello宝子们...我们是艾斯视觉擅长ui设计、前端开发、数字孪生、大数据、三维建模、三维动画10年+经验!希望我的分享能帮助到您!如需帮助可以评论关注私信我们一起探讨!致敬感谢感恩!一、引言:数字孪生重构智慧教育的技术范式在教育数字化转型加速推进的背景下,传统在线教育正面临"个性化不足、学习体验单一、效果评估滞后"的瓶颈。教育部数据显示,采用数字孪生技术的智慧教育平台,学生学习效率平均提升35</div> </li> <li><a href="/article/1942730378238291968.htm" title="SpringBoot3+Vue3+AntDesign无人机场台管理系统 | 小蚂蚁云" target="_blank">SpringBoot3+Vue3+AntDesign无人机场台管理系统 | 小蚂蚁云</a> <span class="text-muted">小蚂蚁开源</span> <a class="tag" taget="_blank" href="/search/%E5%90%8E%E7%AB%AF/1.htm">后端</a><a class="tag" taget="_blank" href="/search/vue/1.htm">vue</a><a class="tag" taget="_blank" href="/search/%E6%9E%B6%E6%9E%84/1.htm">架构</a><a class="tag" taget="_blank" href="/search/%E4%BD%8E%E4%BB%A3%E7%A0%81/1.htm">低代码</a> <div>项目介绍基于SpringBoot3、SpringSecurity、MybatisPlus、Vue3、TypeScript、Vite、AntDesign、MySQL等技术栈实现的单体前后端分离后台管理系统;后端基于Java语言采用SpringBoot3、SpringSecurity、MybatisPlus、MySQL等主流技术栈,前端基于Vue3、TypeScript、Vite等技术栈实现,采用An</div> </li> <li><a href="/article/1942720669838012416.htm" title="Vue.js 中跨域请求未配置 CORS 的问题及解决方案" target="_blank">Vue.js 中跨域请求未配置 CORS 的问题及解决方案</a> <span class="text-muted">JJCTO袁龙</span> <a class="tag" taget="_blank" href="/search/Vue/1.htm">Vue</a><a class="tag" taget="_blank" href="/search/vue.js/1.htm">vue.js</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a> <div>Vue.js中跨域请求未配置CORS的问题及解决方案在Vue.js开发中,跨域请求(CORS)是一个常见的问题。当你的前端应用尝试从不同的源访问后端API时,浏览器会出于安全考虑阻止这些请求,除非后端服务器明确允许。本文将探讨这些问题的常见原因,并提供相应的解决方案。一、Vue.js中跨域请求未配置CORS的常见原因(一)浏览器的同源策略限制浏览器的同源策略限制了从一个源加载的文档或脚本与来自另一</div> </li> <li><a href="/article/1942714996333015040.htm" title="基于Abp Vnext、FastMCP构建一个企业级的模型即服务(MaaS)平台方案" target="_blank">基于Abp Vnext、FastMCP构建一个企业级的模型即服务(MaaS)平台方案</a> <span class="text-muted">NetX行者</span> <a class="tag" taget="_blank" href="/search/Abp/1.htm">Abp</a><a class="tag" taget="_blank" href="/search/vnext/1.htm">vnext</a><a class="tag" taget="_blank" href="/search/Maas/1.htm">Maas</a><a class="tag" taget="_blank" href="/search/Abp/1.htm">Abp</a><a class="tag" taget="_blank" href="/search/vnext/1.htm">vnext</a><a class="tag" taget="_blank" href="/search/FastMCP/1.htm">FastMCP</a><a class="tag" taget="_blank" href="/search/%E4%BC%81%E4%B8%9A%E7%BA%A7%E5%B9%B3%E5%8F%B0/1.htm">企业级平台</a><a class="tag" taget="_blank" href="/search/%E8%A7%A3%E5%86%B3%E6%96%B9%E6%A1%88/1.htm">解决方案</a><a class="tag" taget="_blank" href="/search/%E5%BC%80%E6%BA%90/1.htm">开源</a><a class="tag" taget="_blank" href="/search/python/1.htm">python</a> <div>企业级MaaS平台技术可行性分析报告一、总体技术架构HTTP/WebSocketgRPC/RESTgRPC/RESTgRPCVue3前端ABPvNextAPI网关.NET9业务微服务ABPvNextMCPClientFastMCP模型仓库PyTorch/TensorFlowHuggingFaceHeyGem/ChatGLM自定义模型统一鉴权中心二、核心框架与中间件组件技术选型官方链接作用前端框架V</div> </li> <li><a href="/article/1942714744125321216.htm" title="前端通过docx-preview和pdfjs插件实现docx、pdf文件在线预览" target="_blank">前端通过docx-preview和pdfjs插件实现docx、pdf文件在线预览</a> <span class="text-muted">NetX行者</span> <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/vue.js/1.htm">vue.js</a><a class="tag" taget="_blank" href="/search/pdf/1.htm">pdf</a> <div>docx文件格式在线预览插件:docx-preview安装:npmidocx-preview使用:创建一个容器标签引入并创建渲染函数import{renderAsync}from"docx-preview";renderDocx(){renderAsync(this.fileData,this.$refs.file,null,{className:"docx",//默认和文档样式类的类名/前缀in</div> </li> <li><a href="/article/1942707675557064704.htm" title="Docker部署前后端项目完整教程" target="_blank">Docker部署前后端项目完整教程</a> <span class="text-muted">z小天才b</span> <a class="tag" taget="_blank" href="/search/Docker/1.htm">Docker</a><a class="tag" taget="_blank" href="/search/docker/1.htm">docker</a><a class="tag" taget="_blank" href="/search/%E5%AE%B9%E5%99%A8/1.htm">容器</a><a class="tag" taget="_blank" href="/search/%E8%BF%90%E7%BB%B4/1.htm">运维</a> <div>目录Docker基础概念什么是Docker?核心概念Docker单独部署后端项目2.1准备工作2.2创建后端项目结构2.3编写Dockerfile2.4构建和运行后端容器2.5后端容器管理Docker单独部署前端项目3.1前端项目结构3.2编写前端Dockerfile3.3配置nginx3.4创建.dockerignore文件3.5构建和运行前端容器3.6前端优化技巧DockerCompose介绍</div> </li> <li><a href="/article/1942692420139413504.htm" title="大学生HTML期末大作业——HTML+CSS+JavaScript传统文化" target="_blank">大学生HTML期末大作业——HTML+CSS+JavaScript传统文化</a> <span class="text-muted">无·糖</span> <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/html/1.htm">html</a><a class="tag" taget="_blank" href="/search/%E8%AF%BE%E7%A8%8B%E8%AE%BE%E8%AE%A1/1.htm">课程设计</a><a class="tag" taget="_blank" href="/search/css/1.htm">css</a><a class="tag" taget="_blank" href="/search/%E5%A4%A7%E5%AD%A6%E7%94%9F/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/%E5%A4%A7%E4%BD%9C%E4%B8%9A/1.htm">大作业</a><a class="tag" taget="_blank" href="/search/%E6%9C%9F%E6%9C%AB%E4%BD%9C%E4%B8%9A/1.htm">期末作业</a> <div>HTML+CSS+JS【传统文化】网页设计期末课程大作业web前端开发技术web课程设计网页规划与设计文章目录一、网站题目二、网站描述三、网站介绍四、网站效果五、️网站代码六、️‍如何学习进步七、‍☠️更多干货文章目录一、网站题目传统文化精美设计5页含注册登录二、网站描述总结了一些学生网页制作的经验:一般的网页需要融入以下知识点:div+css布局、浮动、定位、高级css、表格、表单及验证、js轮</div> </li> <li><a href="/article/1942692042236817408.htm" title="记录一篇HTTPS的文章" target="_blank">记录一篇HTTPS的文章</a> <span class="text-muted">麦秸垛的守望者</span> <a class="tag" taget="_blank" href="/search/https/1.htm">https</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/http/1.htm">http</a> <div>深入理解HTTPS:从发展历程到技术原理与前端实践一、HTTPS发展历程:从安全需求到行业标准的演进HTTPS(HyperTextTransferProtocolSecure)的诞生源于互联网安全通信的迫切需求。早期的HTTP协议以明文传输数据,存在严重的安全隐患,如数据窃听、篡改和身份伪造等问题。随着电子商务、在线支付等场景的兴起,保障数据传输安全成为亟待解决的问题。1994年:网景公司(Net</div> </li> <li><a href="/article/1942690908734550016.htm" title="【Tailwind CSS】bg-red-50 和 bg-blue-50 的用法详解" target="_blank">【Tailwind CSS】bg-red-50 和 bg-blue-50 的用法详解</a> <span class="text-muted"></span> <div>文章目录一、TailwindCSS中的颜色背景类1.背景颜色的命名规则2.bg-red-50和bg-blue-50的颜色特点二、bg-red-50和bg-blue-50的基本用法示例三、bg-red-50和bg-blue-50的设计理念1.bg-red-50的使用场景2.bg-blue-50的使用场景四、实际应用场景解析1.信息提示框的使用2.页面分区的背景色3.使用交替背景色提升阅读性五、配合其</div> </li> <li><a href="/article/1942690909208506368.htm" title="【Tailwind CSS】font-light 和 my-4 的样式详解" target="_blank">【Tailwind CSS】font-light 和 my-4 的样式详解</a> <span class="text-muted">Peter-Lu</span> <a class="tag" taget="_blank" href="/search/%23/1.htm">#</a><a class="tag" taget="_blank" href="/search/Tailwind/1.htm">Tailwind</a><a class="tag" taget="_blank" href="/search/css/1.htm">css</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/react.js/1.htm">react.js</a><a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a><a class="tag" taget="_blank" href="/search/typescript/1.htm">typescript</a> <div>文章目录一、`font-light`与字体粗细的控制1.`font-light`的作用2.`font-weight`的等级划分3.使用示例二、`my-4`与垂直外边距的控制1.`my-4`的作用2.Tailwind的边距控制系统3.使用示例三、`font-light`和`my-4`的实际应用场景1.用于标题和描述文本的排版2.用于卡片组件的内容分隔3.用于导航菜单的轻量提示四、设计风格的提升:使用</div> </li> <li><a href="/article/1942690656627519488.htm" title="Turndown 项目教程" target="_blank">Turndown 项目教程</a> <span class="text-muted">卓桔洋</span> <div>Turndown项目教程turndownAnHTMLtoMarkdownconverterwritteninJavaScript项目地址:https://gitcode.com/gh_mirrors/tu/turndown项目介绍Turndown是一个用JavaScript编写的HTML到Markdown转换器。它旨在与CommonMark规范兼容,并提供了多种选项来定制输出样式。Turndown</div> </li> <li><a href="/article/1942690026974408704.htm" title="HTML 语言代码" target="_blank">HTML 语言代码</a> <span class="text-muted"></span> <div>HTML语言代码引言HTML,即超文本标记语言(HyperTextMarkupLanguage),是构建网页和互联网应用的基础。自1990年发明以来,HTML一直是网页设计和开发的核心技术。本文将详细介绍HTML语言的起源、发展、基本结构、常用标签以及在实际应用中的重要性。HTML语言的起源与发展起源HTML的发明者是蒂姆·伯纳斯-李(TimBerners-Lee),他在1989年发明了万维网(W</div> </li> <li><a href="/article/1942689899761168384.htm" title="Puppeteer 库简介:背景、用法与原理" target="_blank">Puppeteer 库简介:背景、用法与原理</a> <span class="text-muted">超级土豆粉</span> <a class="tag" taget="_blank" href="/search/typescript/1.htm">typescript</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><a class="tag" taget="_blank" href="/search/html/1.htm">html</a><a class="tag" taget="_blank" href="/search/%E5%BC%80%E5%8F%91%E8%AF%AD%E8%A8%80/1.htm">开发语言</a> <div>Puppeteer库简介:背景、用法与原理一、背景Puppeteer是Google官方推出的一个Node.js库,最初于2017年发布。它为开发者提供了一个高级API,用于通过编程方式控制Chrome或Chromium浏览器。Puppeteer主要用于自动化网页操作、爬虫、UI测试、生成PDF截图等场景。随着Web自动化需求的增长,Puppeteer逐渐成为前端开发、测试和数据采集领域的重要工具。</div> </li> <li><a href="/article/1942689267599863808.htm" title="2025 年前端主流框架对比和竞争格局及趋势发展" target="_blank">2025 年前端主流框架对比和竞争格局及趋势发展</a> <span class="text-muted"></span> <div>2025年前端框架的竞争格局呈现出主流框架稳定演进、新兴技术快速渗透的特点,同时全栈整合、跨端效能、AI集成成为核心发展方向。以下是基于最新行业动态和技术实践的深度解析:一、主流框架竞争态势与核心能力1.React:企业级生态的持续统治力市场地位:全球使用率超40%,尤其在金融、社交等数据密集型场景占据主导。字节跳动、腾讯等大厂的复杂Web应用仍以React为首选。技术突破:并发模式(Concur</div> </li> <li><a href="/article/1942688889479163904.htm" title="移动端turn.js挖坑总结" target="_blank">移动端turn.js挖坑总结</a> <span class="text-muted">进击的金城武</span> <div>【1】高版本的jquery会导致turning的过程中page溢出半屏。正确版本:【2】可通过css修改翻书的底部颜色及其透明度,默认为transparent。.flipbook.page{background-color:/*底部色*/}【3】在turn.js的源文件2734行通过修改x,y的值可调整peel的大小与角度。flipMethods._showFoldedPage.call(this</div> </li> <li><a href="/article/1942683724407697408.htm" title="第一个小程序" target="_blank">第一个小程序</a> <span class="text-muted"></span> <div>一、前言随着移动互联网的发展,用户对“即用即走”的轻量级应用需求日益增长,而传统App在下载安装、更新维护等方面存在一定的门槛。小程序应运而生,它是一种无需下载即可使用的应用程序形态。本文将带你完成人生中第一个微信小程序的开发全过程,包括:✅注册小程序账号✅安装并配置微信开发者工具✅创建项目并理解目录结构✅编写第一个页面并实现简单交互✅调试与预览✅发布上线流程无论你是前端新手还是想转行小程序开发,</div> </li> <li><a href="/article/1942676163386208256.htm" title="豆瓣8.6分神作:这本《JavaScript DOM编程艺术》,凭什么让前端人读了12年仍奉为圭臬?" target="_blank">豆瓣8.6分神作:这本《JavaScript DOM编程艺术》,凭什么让前端人读了12年仍奉为圭臬?</a> <span class="text-muted">阿蒙Armon</span> <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>豆瓣8.6分神作:这本《JavaScriptDOM编程艺术》,凭什么让前端人读了12年仍奉为圭臬?如果你是Web开发者,一定听过这样的困惑:“学了一堆JavaScript语法,却还是写不出流畅的动态交互?”“懂HTML和CSS,可面对DOM操作总觉得隔层纱?”别急,有一本豆瓣8.6分、5星好评占比47.4%的经典,早就为这些问题准备好了答案——它就是《JavaScriptDOM编程艺术(第2版)》</div> </li> <li><a href="/article/1942675404615643136.htm" title="Web-API-day1 DOM 文档对象模型" target="_blank">Web-API-day1 DOM 文档对象模型</a> <span class="text-muted">码哥DFS</span> <a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a> <div>获取DOM对象1.querySelector(")满足条件第一个元素2.querySelectorAll(")满足条件的元素集合返回伪数组3.了解其他方式1)getElementById2)getElementByTagname操作元素内容修改DOM文本内容1)innerText将文本内容添加/更细到任意标签位置,文本包含的标签不会被解析2)innerHTML将文本内容添加/更细到任意标签位置,文</div> </li> <li><a href="/article/1942669859833835520.htm" title="3、微服务整合Swagger3.0 - 网关Gateway聚合接口" target="_blank">3、微服务整合Swagger3.0 - 网关Gateway聚合接口</a> <span class="text-muted">cch记录JAVA</span> <a class="tag" taget="_blank" href="/search/%E7%B3%BB%E7%BB%9F%E6%8E%A5%E5%8F%A3%E6%96%87%E6%A1%A3Swagger/1.htm">系统接口文档Swagger</a><a class="tag" taget="_blank" href="/search/knife4j/1.htm">knife4j</a><a class="tag" taget="_blank" href="/search/%E5%BE%AE%E6%9C%8D%E5%8A%A1/1.htm">微服务</a><a class="tag" taget="_blank" href="/search/gateway/1.htm">gateway</a><a class="tag" taget="_blank" href="/search/%E6%9E%B6%E6%9E%84/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/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/%E5%90%8E%E7%AB%AF/1.htm">后端</a> <div>1、SpringBoot快速整合Swagger3.02、微服务整合Swagger3.0-抽取为公共模块3、微服务整合Swagger3.0-网关Gateway聚合接口4、微服务整合Swagger3.0-使用方法5、微服务Swagger3.0升级为Knife4j一、实现的效果访问http://{ip}:{port}/swagger-ui/index.htmlspringfox-swagger提供的分组</div> </li> <li><a href="/article/1942641635972149248.htm" title="深入浅出JavaScript定时器:掌握异步编程的核心工具" target="_blank">深入浅出JavaScript定时器:掌握异步编程的核心工具</a> <span class="text-muted">coding随想</span> <a class="tag" taget="_blank" href="/search/JavaScript/1.htm">JavaScript</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>深入浅出JavaScript定时器:掌握异步编程的核心工具在前端开发中,JavaScript定时器是一个看似简单却功能强大的工具。它不仅是实现延时操作和周期性任务的基础,更是理解JavaScript事件循环机制的关键。本文将带你全面了解JavaScript定时器的原理、用法以及最佳实践。一、什么是JavaScript定时器?JavaScript定时器是通过setTimeout和setInterva</div> </li> <li><a href="/article/1942641509698433024.htm" title="一文搞懂 JavaScript 中的 `pageXOffset`、`scrollX`、`pageYOffset` 和 `scrollY`" target="_blank">一文搞懂 JavaScript 中的 `pageXOffset`、`scrollX`、`pageYOffset` 和 `scrollY`</a> <span class="text-muted"></span> <div>一文搞懂JavaScript中的pageXOffset、scrollX、pageYOffset和scrollY在前端开发中,页面滚动是一个非常常见的交互场景。无论是实现“回到顶部”按钮、固定导航栏,还是动态加载内容,开发者都需要精确控制或获取页面的滚动位置。而JavaScript中的pageXOffset、scrollX、pageYOffset和scrollY四个属性,正是实现这些功能的关键工具。</div> </li> <li><a href="/article/1942638862543155200.htm" title="UniApp的学习" target="_blank">UniApp的学习</a> <span class="text-muted">xuzhihuan焕</span> <a class="tag" taget="_blank" href="/search/uni-app/1.htm">uni-app</a><a class="tag" taget="_blank" href="/search/%E5%AD%A6%E4%B9%A0/1.htm">学习</a> <div>一.Vue.js基础基本概念:总之,Vue.js是一个简洁、灵活、高效的前端JavaScript框架,具有响应式数据绑定、组件化开发、虚拟DOM等特点,适用于构建各种类型的Web应用。Vue.js介绍:了解Vue.js的起源、特点以及基本概念。特点:简洁易用:Vue.js的API简洁明了,学习曲线较为平缓,使得开发者能够快速上手。响应式数据绑定:Vue.js提供了响应式的数据绑定机制,当数据发生变</div> </li> <li><a href="/article/1942607346857472000.htm" title="C# 项目" target="_blank">C# 项目</a> <span class="text-muted">卷纸要用清风的</span> <a class="tag" taget="_blank" href="/search/C%23/1.htm">C#</a><a class="tag" taget="_blank" href="/search/c%23/1.htm">c#</a><a class="tag" taget="_blank" href="/search/%E5%BC%80%E5%8F%91%E8%AF%AD%E8%A8%80/1.htm">开发语言</a> <div>语言基础开发环境与工具框架与库数据库与数据存储项目架构与设计模式前端技术(全栈开发场景)版本控制与协作测试与质量保障部署与运维安全实战项目建议学习资源推荐总结语言基础C#语法:变量、数据类型、控制流(条件语句、循环)、运算符、异常处理(try-catch)等。面向对象编程(OOP):类与对象、继承、多态、封装、接口、抽象类。高级特性:委托(Delegate)与事件(Event)LINQ(Langu</div> </li> <li><a href="/article/1942593360967561216.htm" title="23、探索OOCSS方法:构建模块化和可维护的CSS代码" target="_blank">23、探索OOCSS方法:构建模块化和可维护的CSS代码</a> <span class="text-muted">wood5</span> <a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF%E6%9E%B6%E6%9E%84%E5%B8%88%E7%9A%84%E5%BF%85%E4%BF%AE%E8%AF%BE%EF%BC%9A%E4%BB%A3%E7%A0%81/1.htm">前端架构师的必修课:代码</a><a class="tag" taget="_blank" href="/search/%E6%B5%8B%E8%AF%95%E4%B8%8E%E6%96%87%E6%A1%A3/1.htm">测试与文档</a><a class="tag" taget="_blank" href="/search/OOCSS/1.htm">OOCSS</a><a class="tag" taget="_blank" href="/search/CSS%E6%96%B9%E6%B3%95%E8%AE%BA/1.htm">CSS方法论</a><a class="tag" taget="_blank" href="/search/%E6%A8%A1%E5%9D%97%E5%8C%96CSS/1.htm">模块化CSS</a> <div>探索OOCSS方法:构建模块化和可维护的CSS代码1.OOCSS概述OOCSS(Object-OrientedCSS)是一种编写CSS的方法论&</div> </li> <li><a href="/article/75.htm" title="knob UI插件使用" target="_blank">knob UI插件使用</a> <span class="text-muted">换个号韩国红果果</span> <a class="tag" taget="_blank" href="/search/JavaScript/1.htm">JavaScript</a><a class="tag" taget="_blank" href="/search/jsonp/1.htm">jsonp</a><a class="tag" taget="_blank" href="/search/knob/1.htm">knob</a> <div>图形是用canvas绘制的 js代码 var paras = { max:800, min:100, skin:'tron',//button type thickness:.3,//button width width:'200',//define canvas width.,canvas height displayInput:'tr</div> </li> <li><a href="/article/202.htm" title="Android+Jquery Mobile学习系列(5)-SQLite数据库" target="_blank">Android+Jquery Mobile学习系列(5)-SQLite数据库</a> <span class="text-muted">白糖_</span> <a class="tag" taget="_blank" href="/search/JQuery+Mobile/1.htm">JQuery Mobile</a> <div>目录导航   SQLite是轻量级的、嵌入式的、关系型数据库,目前已经在iPhone、Android等手机系统中使用,SQLite可移植性好,很容易使用,很小,高效而且可靠。   因为Android已经集成了SQLite,所以开发人员无需引入任何JAR包,而且Android也针对SQLite封装了专属的API,调用起来非常快捷方便。   我也是第一次接触S</div> </li> <li><a href="/article/329.htm" title="impala-2.1.2-CDH5.3.2" target="_blank">impala-2.1.2-CDH5.3.2</a> <span class="text-muted">dayutianfei</span> <a class="tag" taget="_blank" href="/search/impala/1.htm">impala</a> <div>最近在整理impala编译的东西,简单记录几个要点: 根据官网的信息(https://github.com/cloudera/Impala/wiki/How-to-build-Impala): 1. 首次编译impala,推荐使用命令: ${IMPALA_HOME}/buildall.sh -skiptests -build_shared_libs -format 2.仅编译BE ${I</div> </li> <li><a href="/article/456.htm" title="求二进制数中1的个数" target="_blank">求二进制数中1的个数</a> <span class="text-muted">周凡杨</span> <a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/%E7%AE%97%E6%B3%95/1.htm">算法</a><a class="tag" taget="_blank" href="/search/%E4%BA%8C%E8%BF%9B%E5%88%B6/1.htm">二进制</a> <div>解法一: 对于一个正整数如果是偶数,该数的二进制数的最后一位是 0 ,反之若是奇数,则该数的二进制数的最后一位是 1 。因此,可以考虑利用位移、判断奇偶来实现。   public int bitCount(int x){ int count = 0; while(x!=0){ if(x%2!=0){ /</div> </li> <li><a href="/article/583.htm" title="spring中hibernate及事务配置" target="_blank">spring中hibernate及事务配置</a> <span class="text-muted">g21121</span> <a class="tag" taget="_blank" href="/search/Hibernate/1.htm">Hibernate</a> <div>hibernate的sessionFactory配置: <!-- hibernate sessionFactory配置 --> <bean id="sessionFactory" class="org.springframework.orm.hibernate3.LocalSessionFactoryBean"> <</div> </li> <li><a href="/article/710.htm" title="log4j.properties 使用" target="_blank">log4j.properties 使用</a> <span class="text-muted">510888780</span> <a class="tag" taget="_blank" href="/search/log4j/1.htm">log4j</a> <div>log4j.properties 使用 一.参数意义说明 输出级别的种类 ERROR、WARN、INFO、DEBUG ERROR 为严重错误 主要是程序的错误 WARN 为一般警告,比如session丢失 INFO 为一般要显示的信息,比如登录登出 DEBUG 为程序的调试信息 配置日志信息输出目的地 log4j.appender.appenderName = fully.qua</div> </li> <li><a href="/article/837.htm" title="Spring mvc-jfreeChart柱图(2)" target="_blank">Spring mvc-jfreeChart柱图(2)</a> <span class="text-muted">布衣凌宇</span> <a class="tag" taget="_blank" href="/search/jfreechart/1.htm">jfreechart</a> <div>上一篇中生成的图是静态的,这篇将按条件进行搜索,并统计成图表,左面为统计图,右面显示搜索出的结果。 第一步:导包 第二步;配置web.xml(上一篇有代码) 建BarRenderer类用于柱子颜色 import java.awt.Color; import java.awt.Paint; import org.jfree.chart.renderer.category.BarR</div> </li> <li><a href="/article/964.htm" title="我的spring学习笔记14-容器扩展点之PropertyPlaceholderConfigurer" target="_blank">我的spring学习笔记14-容器扩展点之PropertyPlaceholderConfigurer</a> <span class="text-muted">aijuans</span> <a class="tag" taget="_blank" href="/search/Spring3/1.htm">Spring3</a> <div>PropertyPlaceholderConfigurer是个bean工厂后置处理器的实现,也就是BeanFactoryPostProcessor接口的一个实现。关于BeanFactoryPostProcessor和BeanPostProcessor类似。我会在其他地方介绍。 PropertyPlaceholderConfigurer可以将上下文(配置文件)中的属性值放在另一个单独的标准java</div> </li> <li><a href="/article/1091.htm" title="maven 之 cobertura 简单使用" target="_blank">maven 之 cobertura 简单使用</a> <span class="text-muted">antlove</span> <a class="tag" taget="_blank" href="/search/maven/1.htm">maven</a><a class="tag" taget="_blank" href="/search/test/1.htm">test</a><a class="tag" taget="_blank" href="/search/unit/1.htm">unit</a><a class="tag" taget="_blank" href="/search/cobertura/1.htm">cobertura</a><a class="tag" taget="_blank" href="/search/report/1.htm">report</a> <div>1. 创建一个maven项目 2. 创建com.CoberturaStart.java package com; public class CoberturaStart { public void helloEveryone(){ System.out.println("=================================================</div> </li> <li><a href="/article/1218.htm" title="程序的执行顺序" target="_blank">程序的执行顺序</a> <span class="text-muted">百合不是茶</span> <a class="tag" taget="_blank" href="/search/JAVA%E6%89%A7%E8%A1%8C%E9%A1%BA%E5%BA%8F/1.htm">JAVA执行顺序</a> <div>      刚在看java核心技术时发现对java的执行顺序不是很明白了,百度一下也没有找到适合自己的资料,所以就简单的回顾一下吧   代码如下;     经典的程序执行面试题 //关于程序执行的顺序 //例如: //定义一个基类 public class A(){ public A(</div> </li> <li><a href="/article/1345.htm" title="设置session失效的几种方法" target="_blank">设置session失效的几种方法</a> <span class="text-muted">bijian1013</span> <a class="tag" taget="_blank" href="/search/web.xml/1.htm">web.xml</a><a class="tag" taget="_blank" href="/search/session%E5%A4%B1%E6%95%88/1.htm">session失效</a><a class="tag" taget="_blank" href="/search/%E7%9B%91%E5%90%AC%E5%99%A8/1.htm">监听器</a> <div>在系统登录后,都会设置一个当前session失效的时间,以确保在用户长时间不与服务器交互,自动退出登录,销毁session。具体设置很简单,方法有三种:(1)在主页面或者公共页面中加入:session.setMaxInactiveInterval(900);参数900单位是秒,即在没有活动15分钟后,session将失效。这里要注意这个session设置的时间是根据服务器来计算的,而不是客户端。所</div> </li> <li><a href="/article/1472.htm" title="java jvm常用命令工具" target="_blank">java jvm常用命令工具</a> <span class="text-muted">bijian1013</span> <a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/jvm/1.htm">jvm</a> <div>一.概述         程序运行中经常会遇到各种问题,定位问题时通常需要综合各种信息,如系统日志、堆dump文件、线程dump文件、GC日志等。通过虚拟机监控和诊断工具可以帮忙我们快速获取、分析需要的数据,进而提高问题解决速度。 本文将介绍虚拟机常用监控和问题诊断命令工具的使用方法,主要包含以下工具:       &nbs</div> </li> <li><a href="/article/1599.htm" title="【Spring框架一】Spring常用注解之Autowired和Resource注解" target="_blank">【Spring框架一】Spring常用注解之Autowired和Resource注解</a> <span class="text-muted">bit1129</span> <a class="tag" taget="_blank" href="/search/Spring%E5%B8%B8%E7%94%A8%E6%B3%A8%E8%A7%A3/1.htm">Spring常用注解</a> <div>Spring自从2.0引入注解的方式取代XML配置的方式来做IOC之后,对Spring一些常用注解的含义行为一直处于比较模糊的状态,写几篇总结下Spring常用的注解。本篇包含的注解有如下几个: Autowired Resource Component Service Controller Transactional 根据它们的功能、目的,可以分为三组,Autow</div> </li> <li><a href="/article/1726.htm" title="mysql 操作遇到safe update mode问题" target="_blank">mysql 操作遇到safe update mode问题</a> <span class="text-muted">bitray</span> <a class="tag" taget="_blank" href="/search/update/1.htm">update</a> <div>    我并不知道出现这个问题的实际原理,只是通过其他朋友的博客,文章得知的一个解决方案,目前先记录一个解决方法,未来要是真了解以后,还会继续补全.     在mysql5中有一个safe update mode,这个模式让sql操作更加安全,据说要求有where条件,防止全表更新操作.如果必须要进行全表操作,我们可以执行 SET</div> </li> <li><a href="/article/1853.htm" title="nginx_perl试用" target="_blank">nginx_perl试用</a> <span class="text-muted">ronin47</span> <a class="tag" taget="_blank" href="/search/nginx_perl%E8%AF%95%E7%94%A8/1.htm">nginx_perl试用</a> <div>因为空闲时间比较多,所以在CPAN上乱翻,看到了nginx_perl这个项目(原名Nginx::Engine),现在托管在github.com上。地址见:https://github.com/zzzcpan/nginx-perl 这个模块的目的,是在nginx内置官方perl模块的基础上,实现一系列异步非阻塞的api。用connector/writer/reader完成类似proxy的功能(这里</div> </li> <li><a href="/article/1980.htm" title="java-63-在字符串中删除特定的字符" target="_blank">java-63-在字符串中删除特定的字符</a> <span class="text-muted">bylijinnan</span> <a class="tag" taget="_blank" href="/search/java/1.htm">java</a> <div> public class DeleteSpecificChars { /** * Q 63 在字符串中删除特定的字符 * 输入两个字符串,从第一字符串中删除第二个字符串中所有的字符。 * 例如,输入”They are students.”和”aeiou”,则删除之后的第一个字符串变成”Thy r stdnts.” */ public static voi</div> </li> <li><a href="/article/2107.htm" title="EffectiveJava--创建和销毁对象" target="_blank">EffectiveJava--创建和销毁对象</a> <span class="text-muted">ccii</span> <a class="tag" taget="_blank" href="/search/%E5%88%9B%E5%BB%BA%E5%92%8C%E9%94%80%E6%AF%81%E5%AF%B9%E8%B1%A1/1.htm">创建和销毁对象</a> <div>本章内容: 1. 考虑用静态工厂方法代替构造器 2. 遇到多个构造器参数时要考虑用构建器(Builder模式) 3. 用私有构造器或者枚举类型强化Singleton属性 4. 通过私有构造器强化不可实例化的能力 5. 避免创建不必要的对象 6. 消除过期的对象引用 7. 避免使用终结方法 1. 考虑用静态工厂方法代替构造器     类可以通过</div> </li> <li><a href="/article/2234.htm" title="[宇宙时代]四边形理论与光速飞行" target="_blank">[宇宙时代]四边形理论与光速飞行</a> <span class="text-muted">comsci</span> <div>   从四边形理论来推论 为什么光子飞船必须获得星光信号才能够进行光速飞行?    一组星体组成星座  向空间辐射一组由复杂星光信号组成的辐射频带,按照四边形-频率假说  一组频率就代表一个时空的入口    那么这种由星光信号组成的辐射频带就代表由这些星体所控制的时空通道,该时空通道在三维空间的投影是一</div> </li> <li><a href="/article/2361.htm" title="ubuntu server下python脚本迁移数据" target="_blank">ubuntu server下python脚本迁移数据</a> <span class="text-muted">cywhoyi</span> <a class="tag" taget="_blank" href="/search/python/1.htm">python</a><a class="tag" taget="_blank" href="/search/Kettle/1.htm">Kettle</a><a class="tag" taget="_blank" href="/search/pymysql/1.htm">pymysql</a><a class="tag" taget="_blank" href="/search/cx_Oracle/1.htm">cx_Oracle</a><a class="tag" taget="_blank" href="/search/ubuntu+server/1.htm">ubuntu server</a> <div>因为是在Ubuntu下,所以安装python、pip、pymysql等都极其方便,sudo apt-get install pymysql, 但是在安装cx_Oracle(连接oracle的模块)出现许多问题,查阅相关资料,发现这边文章能够帮我解决,希望大家少走点弯路。http://www.tbdazhe.com/archives/602 1.安装python 2.安装pip、pymysql</div> </li> <li><a href="/article/2488.htm" title="Ajax正确但是请求不到值解决方案" target="_blank">Ajax正确但是请求不到值解决方案</a> <span class="text-muted">dashuaifu</span> <a class="tag" taget="_blank" href="/search/Ajax/1.htm">Ajax</a><a class="tag" taget="_blank" href="/search/async/1.htm">async</a> <div>Ajax正确但是请求不到值解决方案   解决方案:1 .     async: false ,    2.     设置延时执行js里的ajax或者延时后台java方法!!!!!!!   例如:   $.ajax({     &</div> </li> <li><a href="/article/2615.htm" title="windows安装配置php+memcached" target="_blank">windows安装配置php+memcached</a> <span class="text-muted">dcj3sjt126com</span> <a class="tag" taget="_blank" href="/search/PHP/1.htm">PHP</a><a class="tag" taget="_blank" href="/search/Install/1.htm">Install</a><a class="tag" taget="_blank" href="/search/memcache/1.htm">memcache</a> <div>Windows下Memcached的安装配置方法 1、将第一个包解压放某个盘下面,比如在c:\memcached。 2、在终端(也即cmd命令界面)下输入 'c:\memcached\memcached.exe -d install' 安装。 3、再输入: 'c:\memcached\memcached.exe -d start' 启动。(需要注意的: 以后memcached将作为windo</div> </li> <li><a href="/article/2742.htm" title="iOS开发学习路径的一些建议" target="_blank">iOS开发学习路径的一些建议</a> <span class="text-muted">dcj3sjt126com</span> <a class="tag" taget="_blank" href="/search/ios/1.htm">ios</a> <div>iOS论坛里有朋友要求回答帖子,帖子的标题是: 想学IOS开发高阶一点的东西,从何开始,然后我吧啦吧啦回答写了很多。既然敲了那么多字,我就把我写的回复也贴到博客里来分享,希望能对大家有帮助。欢迎大家也到帖子里讨论和分享,地址:http://bbs.csdn.net/topics/390920759   下面是我回复的内容:   结合自己情况聊下iOS学习建议,</div> </li> <li><a href="/article/2869.htm" title="Javascript闭包概念" target="_blank">Javascript闭包概念</a> <span class="text-muted">fanfanlovey</span> <a class="tag" taget="_blank" href="/search/JavaScript/1.htm">JavaScript</a><a class="tag" taget="_blank" href="/search/%E9%97%AD%E5%8C%85/1.htm">闭包</a> <div>1.参考资料 http://www.jb51.net/article/24101.htm http://blog.csdn.net/yn49782026/article/details/8549462 2.内容概述 要理解闭包,首先需要理解变量作用域问题 内部函数可以饮用外面全局变量 var n=999;   functio</div> </li> <li><a href="/article/2996.htm" title="yum安装mysql5.6" target="_blank">yum安装mysql5.6</a> <span class="text-muted">haisheng</span> <a class="tag" taget="_blank" href="/search/mysql/1.htm">mysql</a> <div>1、安装http://dev.mysql.com/get/mysql-community-release-el7-5.noarch.rpm   2、yum install mysql   3、yum install mysql-server   4、vi /etc/my.cnf   添加character_set_server=utf8</div> </li> <li><a href="/article/3123.htm" title="po/bo/vo/dao/pojo的详介" target="_blank">po/bo/vo/dao/pojo的详介</a> <span class="text-muted">IT_zhlp80</span> <a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/BO/1.htm">BO</a><a class="tag" taget="_blank" href="/search/VO/1.htm">VO</a><a class="tag" taget="_blank" href="/search/DAO/1.htm">DAO</a><a class="tag" taget="_blank" href="/search/POJO/1.htm">POJO</a><a class="tag" taget="_blank" href="/search/po/1.htm">po</a> <div>    JAVA几种对象的解释 PO:persistant object持久对象,可以看成是与数据库中的表相映射的java对象。最简单的PO就是对应数据库中某个表中的一条记录,多个记录可以用PO的集合。PO中应该不包含任何对数据库的操作. VO:value object值对象。通常用于业务层之间的数据传递,和PO一样也是仅仅包含数据而已。但应是抽象出的业务对象,可</div> </li> <li><a href="/article/3250.htm" title="java设计模式" target="_blank">java设计模式</a> <span class="text-muted">kerryg</span> <a class="tag" taget="_blank" href="/search/java/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> <div>设计模式的分类:    一、 设计模式总体分为三大类: 1、创建型模式(5种):工厂方法模式,抽象工厂模式,单例模式,建造者模式,原型模式。 2、结构型模式(7种):适配器模式,装饰器模式,代理模式,外观模式,桥接模式,组合模式,享元模式。 3、行为型模式(11种):策略模式,模版方法模式,观察者模式,迭代子模式,责任链模式,命令模式,备忘录模式,状态模式,访问者</div> </li> <li><a href="/article/3377.htm" title="[1]CXF3.1整合Spring开发webservice——helloworld篇" target="_blank">[1]CXF3.1整合Spring开发webservice——helloworld篇</a> <span class="text-muted">木头.java</span> <a class="tag" taget="_blank" href="/search/spring/1.htm">spring</a><a class="tag" taget="_blank" href="/search/webservice/1.htm">webservice</a><a class="tag" taget="_blank" href="/search/CXF/1.htm">CXF</a> <div>Spring 版本3.2.10 CXF 版本3.1.1 项目采用MAVEN组织依赖jar 我这里是有parent的pom,为了简洁明了,我直接把所有的依赖都列一起了,所以都没version,反正上面已经写了版本 <project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="ht</div> </li> <li><a href="/article/3504.htm" title="Google 工程师亲授:菜鸟开发者一定要投资的十大目标" target="_blank">Google 工程师亲授:菜鸟开发者一定要投资的十大目标</a> <span class="text-muted">qindongliang1922</span> <a class="tag" taget="_blank" href="/search/%E5%B7%A5%E4%BD%9C/1.htm">工作</a><a class="tag" taget="_blank" href="/search/%E6%84%9F%E6%82%9F/1.htm">感悟</a><a class="tag" taget="_blank" href="/search/%E4%BA%BA%E7%94%9F/1.htm">人生</a> <div>身为软件开发者,有什么是一定得投资的? Google 软件工程师 Emanuel Saringan 整理了十项他认为必要的投资,第一项就是身体健康,英文与数学也都是必备能力吗?来看看他怎么说。(以下文字以作者第一人称撰写)) 你的健康 无疑地,软件开发者是世界上最久坐不动的职业之一。 每天连坐八到十六小时,休息时间只有一点点,绝对会让你的鲔鱼肚肆无忌惮的生长。肥胖容易扩大罹患其他疾病的风险,</div> </li> <li><a href="/article/3631.htm" title="linux打开最大文件数量1,048,576" target="_blank">linux打开最大文件数量1,048,576</a> <span class="text-muted">tianzhihehe</span> <a class="tag" taget="_blank" href="/search/c/1.htm">c</a><a class="tag" taget="_blank" href="/search/linux/1.htm">linux</a> <div>File descriptors are represented by the C int type. Not using a special type is often  considered odd, but is, historically, the Unix way. Each Linux process has a maximum number of files th</div> </li> <li><a href="/article/3758.htm" title="java语言中PO、VO、DAO、BO、POJO几种对象的解释" target="_blank">java语言中PO、VO、DAO、BO、POJO几种对象的解释</a> <span class="text-muted">衞酆夼</span> <a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/VO/1.htm">VO</a><a class="tag" taget="_blank" href="/search/BO/1.htm">BO</a><a class="tag" taget="_blank" href="/search/POJO/1.htm">POJO</a><a class="tag" taget="_blank" href="/search/po/1.htm">po</a> <div>PO:persistant object持久对象 最形象的理解就是一个PO就是数据库中的一条记录。好处是可以把一条记录作为一个对象处理,可以方便的转为其它对象。可以看成是与数据库中的表相映射的java对象。最简单的PO就是对应数据库中某个表中的一条记录,多个记录可以用PO的集合。PO中应该不包含任何对数据库的操作。 BO:business object业务对象 封装业务逻辑的java对象</div> </li> </ul> </div> </div> </div> <div> <div class="container"> <div class="indexes"> <strong>按字母分类:</strong> <a href="/tags/A/1.htm" target="_blank">A</a><a href="/tags/B/1.htm" target="_blank">B</a><a href="/tags/C/1.htm" target="_blank">C</a><a href="/tags/D/1.htm" target="_blank">D</a><a href="/tags/E/1.htm" target="_blank">E</a><a href="/tags/F/1.htm" target="_blank">F</a><a href="/tags/G/1.htm" target="_blank">G</a><a href="/tags/H/1.htm" target="_blank">H</a><a href="/tags/I/1.htm" target="_blank">I</a><a href="/tags/J/1.htm" target="_blank">J</a><a href="/tags/K/1.htm" target="_blank">K</a><a href="/tags/L/1.htm" target="_blank">L</a><a href="/tags/M/1.htm" target="_blank">M</a><a href="/tags/N/1.htm" target="_blank">N</a><a href="/tags/O/1.htm" target="_blank">O</a><a href="/tags/P/1.htm" target="_blank">P</a><a href="/tags/Q/1.htm" target="_blank">Q</a><a href="/tags/R/1.htm" target="_blank">R</a><a href="/tags/S/1.htm" target="_blank">S</a><a href="/tags/T/1.htm" target="_blank">T</a><a href="/tags/U/1.htm" target="_blank">U</a><a href="/tags/V/1.htm" target="_blank">V</a><a href="/tags/W/1.htm" target="_blank">W</a><a href="/tags/X/1.htm" target="_blank">X</a><a href="/tags/Y/1.htm" target="_blank">Y</a><a href="/tags/Z/1.htm" target="_blank">Z</a><a href="/tags/0/1.htm" target="_blank">其他</a> </div> </div> </div> <footer id="footer" class="mb30 mt30"> <div class="container"> <div class="footBglm"> <a target="_blank" href="/">首页</a> - <a target="_blank" href="/custom/about.htm">关于我们</a> - <a target="_blank" href="/search/Java/1.htm">站内搜索</a> - <a target="_blank" href="/sitemap.txt">Sitemap</a> - <a target="_blank" href="/custom/delete.htm">侵权投诉</a> </div> <div class="copyright">版权所有 IT知识库 CopyRight © 2000-2050 E-COM-NET.COM , All Rights Reserved. <!-- <a href="https://beian.miit.gov.cn/" rel="nofollow" target="_blank">京ICP备09083238号</a><br>--> </div> </div> </footer> <!-- 代码高亮 --> <script type="text/javascript" src="/static/syntaxhighlighter/scripts/shCore.js"></script> <script type="text/javascript" src="/static/syntaxhighlighter/scripts/shLegacy.js"></script> <script type="text/javascript" src="/static/syntaxhighlighter/scripts/shAutoloader.js"></script> <link type="text/css" rel="stylesheet" href="/static/syntaxhighlighter/styles/shCoreDefault.css"/> <script type="text/javascript" src="/static/syntaxhighlighter/src/my_start_1.js"></script> </body> </html>