HTML-介绍-MDN文档学习笔记

HTML-介绍

查看更多学习笔记:GitHub:LoveEmiliaForever
MDN中文官网

HTML-简介

MDN 文档引用:
就其核心而言,HTML 是一种相当简单的、由不同元素组成的标记语言,它可以被应用于文本片段,使文本在文档中具有不同的含义(它是段落吗?它是项目列表吗?它是表格吗?),将文档结构化为逻辑块(文档是否有头部?有三列内容?有一个导航菜单?),并且可以将图片,影像等内容嵌入到页面中。

HTML 的主要特性总结

  • 由不同元素组成的标记语言
  • 标记文本片段为元素,以赋予其含义
  • 组织文档,让其拥有逻辑结构
  • 给予文档额外的功能性

HTML-入门

HTML-组织结构

HTML 构建的文章总体由各种元素组成,元素之间可以嵌套,且由于不同元素含有不同意义,元素之间可以拥有逻辑和排版上的结构
HTML 文章与元素之间的关系大致可以表述如下图所示

HTML-介绍-MDN文档学习笔记_第1张图片

HTML-元素分类

元素的具体结构

HTML-介绍-MDN文档学习笔记_第2张图片

块级元素和内联元素
  • 块级元素在页面中以块的形式展现
    • 块级元素自己独占一行,通常是页面的结构元素
    • 块级元素可以嵌套在块级元素内,但不能嵌套在内联元素内
  • 内联元素通常嵌套在块级元素内
    • 内联元素不会导致换行
    • 内联元素通常和文本一起使用,并带来一些效果

❕元素的类型与 CSS 中display:类型并不一样,尽管 CSS 可以改变元素的显示,但不能够改变元素的类型,也改变不了元素间包含和被包含的关系

❕HTML5 重新定义了元素的分类,原因如上所示,害怕混淆

空元素

有一些元素没有结束标签,它不包含文章片段,而是用来执行一些额外行为
例如就是用来在文章中插入图片所使用的元素
这些元素称为空元素,如上所示在空元素标签的末尾添加/也是可行的,此时XML也可以识别该元素

HTML-元素属性

属性简介

元素的属性通常是定义元素行为或为元素添加额外信息

在这里插入图片描述

  • 属性和属性、属性和标签之间以空格分隔
  • 属性与属性值以=相连
  • 属性值由" "包裹
属性使用示例
    <a href="github.com" title="点击前往GitHub" target="_blank">前往GitHuba>

示例元素的属性声明了元素的额外行为,与额外信息

  • href属性声明了跳转目的地这个额外信息
  • title声明了链接描述这个额外信息
  • target声明了跳转方式这个额外行为
布尔属性

有些属性可以不用写它的属性值,因为它只有一个和它属性名相同的属性值
这种属性称为布尔属性,通常是用于声明某种行为
如表单元素的disable属性就是布尔属性,它表示禁用此表单元素

属性值的引号问题

当元素中只有一个属性时可以不使用" "包裹属性值
但当属性不止一个时,不使用" "包裹属性值则很可能产生错误结果
可以使用" "也可以使用' '包裹属性值,可以嵌套,不能混用

HTML-文档剖析

HTML 页面的一般结构

    DOCTYPE html>
    <html lang="zh-CN">
        <head>
            <meta charset="utf-8" />
            <title>我的测试站点title>
        head>
        <body>
            <p>这是我的页面p>
        body>
    html>
  • 是一个历史遗留问题,现在只需把它加入 HTML 页面文档开头即可
  • 包含了页面的所有内容,称为根元素
  • 包含了一些有关 HTML 页面的信息,其中内容并不显示在页面
  • 用于设置一些独特的信息,如字符集关键字等等
  • </code>设置了页面的标题信息</li> <li><code><body></code>包含了所有显示在页面上的信息</li> </ul> <blockquote> <p>❕在 HTML 文档中连续的空格或换行在渲染时都仅被当成一个空格</p> </blockquote> <h4>HTML-实体引用</h4> <p>实体引用类似于转义,是用来表示特殊字符的代码<br> 常用实体引用如下表</p> <table> <thead> <tr> <th align="center">所表示字符</th> <th align="center">实体引用代码</th> <th align="center">所表示字符</th> <th align="center">实体引用代码</th> </tr> </thead> <tbody> <tr> <td align="center"><</td> <td align="center"><code><</code></td> <td align="center">></td> <td align="center"><code>></code></td> </tr> <tr> <td align="center">"</td> <td align="center"><code>"</code></td> <td align="center">’</td> <td align="center"><code>&apos</code></td> </tr> <tr> <td align="center">&</td> <td align="center"><code>&</code></td> <td align="center">空格</td> <td align="center"><code> </code></td> </tr> </tbody> </table> <h4>HTML-注释</h4> <p>只需要用<code><!--</code>和<code>--></code>包裹起来注释内容即可创建一行 HTML 注释</p> <h3>HTML-head标签内容</h3> <h4><code><title></code>元素的使用</h4> <p><code><title></code>是用来给 HTML 文档添加标题的标签,但是和<code><h1></code>不同</p> <ul> <li><code><title></code>添加的是整个文档文件的标题</li> <li><code><h1></code>是为文档包含的内容添加标题</li> </ul> <h4><code><meta></code>元素</h4> <p><code>元数据</code>是用来描述数据的数据,HTML 中可以使用<code><meta></code>来添加元数据<br> <code><meta></code>有许多不同种类,常见的有如下一些</p> <h5>指定文档字符编码</h5> <pre><code class="prism language-html"> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>meta</span> <span class="token attr-name">charset</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> </code></pre> <p>不同的字符编码会将同一字符数据解释为不同的字符,为了兼容性考虑,使用<code>utf-8</code>是最好的<br> 虽然某些浏览器会尝试修正错误编码,但这显然不稳妥,应该要指定字符编码</p> <h5>为文档添加作者</h5> <pre><code class="prism language-html"> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>meta</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>author<span class="token punctuation">"</span></span> <span class="token attr-name">content</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>LoveEmiliaForever<span class="token punctuation">"</span></span><span class="token punctuation">></span></span> </code></pre> <ul> <li><code>name</code>属性用于指定<code><meta></code>的类型</li> <li><code>content</code>属性则包含了想要写入的数据</li> </ul> <h5>给文档添加描述</h5> <pre><code class="prism language-html"> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>meta</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>description<span class="token punctuation">"</span></span> <span class="token attr-name">content</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> </code></pre> <p>给网页添加描述能够让使用者快速了解网页,并且搜索引擎也会使用该元数据</p> <blockquote> <p>❕ 许多的<code><meta></code>特性以及被弃用了,如<code><meta name="keywords" content="关键字"></code></p> </blockquote> <h5>其它类型元数据</h5> <p>某些网站是有自己的元数据协议的,也就是说某些元数据类型是专门使用在特定网站上的<br> 如 Facebook、Twitter 都有一些特有的元数据协议,用于提供扩展服务</p> <h4>自定义站点图标</h4> <p>可以在<code><head></head></code>中指定特定图片作为站点的图标(通常是<code>.ico</code>格式)<br> 可以使用下列语法指定站点图标</p> <pre><code class="prism language-html"> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>link</span> <span class="token attr-name">rel</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>icon<span class="token punctuation">"</span></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>图标路径<span class="token punctuation">"</span></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>image/x-icon<span class="token punctuation">"</span></span><span class="token punctuation">></span></span> </code></pre> <h4>引入-CSS-文件和-JS-脚本</h4> <p>可以在<code><head></code>内通过<code><link/></code>和<code><script></code>分别引入外部 css 文件、 js 文件</p> <pre><code class="prism language-html"> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>link</span> <span class="token attr-name">rel</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>stylesheet<span class="token punctuation">"</span></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>css文件路径<span class="token punctuation">"</span></span><span class="token punctuation">></span></span> </code></pre> <pre><code class="prism language-html"> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>script</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>js文件路径<span class="token punctuation">"</span></span> <span class="token attr-name">defer</span><span class="token punctuation">></span></span><span class="token script"></span><span class="token tag"><span class="token tag"><span class="token punctuation"></</span>script</span><span class="token punctuation">></span></span> </code></pre> <p>给<code><script></code>添加属性<code>defer</code>即意味着告诉浏览器 “在解析完 HTML 文件后再加载 js 文件”。这样可以防止 js 在运行环境尚未完成时运行,避免出现错误</p> <h4>给文档设定主语言</h4> <p>可以通过使用<code>lang</code>属性给元素设定主语言,该属性通常是被放置在<code><html></code>内,以规定该页面的主语言</p> <pre><code class="prism language-html"> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>html</span> <span class="token attr-name">lang</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>zh-CN<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>html</span><span class="token punctuation">></span></span> </code></pre> <h3>HTML-文本处理基础</h3> <h4>标题和段落</h4> <p>通过将内容包裹在<code><p></code>中可以标记一个段落<br> 通过将标题内容包裹在<code><h1></code>到<code><h6></code>内,可以定义六个等级的标题</p> <ul> <li>使用标题时应该要安排好文档的层次结构</li> <li>每个文档最好只使用一次<code><h1></code>,这是顶级标题</li> <li>标题等级最好不要跳跃式定义</li> <li>每个文档最好不要超过三个级别的标题</li> </ul> <h4>语义化的重要性</h4> <p>语义化标签可以元素赋予对应的含义,使得元素之间能够进行<code>视觉、逻辑、结构上的统一</code></p> <p>这样做的好处有很多</p> <ul> <li>使文档结构清晰,易于阅读</li> <li>让页面后续维护开发更加简单</li> <li>利于搜索引擎提取页面信息</li> </ul> <h4>列表</h4> <h5>无序列表</h5> <p>无序列表是没有顺序标签的,也就是说使用该列表时顺序应该要是无关紧要的事情<br> 如下所示,<code><ul></code>用于声明无需列表,<code><li></code>用于声明列表项</p> <pre><code class="prism language-html"> <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>吃饭<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>睡觉<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>喝水<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> </code></pre> <h5>有序列表</h5> <p>和无序列表相反,有序列表是有顺序标签的<br> 它们的结构相似<code><ol></code>用于声明有序列表,<code><li></code>用于声明列表项</p> <pre><code class="prism language-html"> <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>步骤一<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>步骤二<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>步骤三<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> </code></pre> <h5>列表嵌套</h5> <p>列表之间是可以嵌套的,只需要在<code><li></code>内部插入<code><ul></code>或<code><ol></code>即可</p> <pre><code class="prism language-html"> <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>步骤一<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>步骤二<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>步骤三 <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>材料A<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>材料B<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>材料C<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>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> </code></pre> <h4>重点强调</h4> <p>HTML 中提供了一些标签用于标记文字,使得文字具有特殊效果,以达到强调文字内容的作用</p> <h5>斜体</h5> <p>可以使用<code><em></code>标记文本以获得斜体字,但是它是具有语义的元素<br> 如果仅仅只是想要斜体字,且没有代表什么含义那么就不应该使用<code><em></code>,可以使用<code><i></code>或是<code><span></code> 或 <code><mark></code> + CSS </p> <pre><code class="prism language-html"> <span class="token comment"><!--此时的斜体代表著名书籍--></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>em</span><span class="token punctuation">></span></span>《哈姆雷特》<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>em</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 comment"><!--下面的斜体则没有什么含义--></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>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> <h5>粗体</h5> <p>语义化的粗体标签是<code><strong></code>,普通的粗体标签是<code><b></code></p> <h5>下划线</h5> <p>由于<code>超链接</code>一般会拥有下划线,所以如果要给文字添加下划线,最好定义一些独特的格式<br> 可以使用<code><u></code>定义下划线,但最好使用<code><span></code> 或 <code><mark></code> + css给下划线一个明确的语义,然后使用下划线</p> <h5>表象元素</h5> <p>HTML 中的大部分标签都是具有语义的,但有一些标签没有什么含义<br> 例如<code><i></code>、<code><b></code>、<code><u></code><br> 这些标签定义的元素叫做<code>表象元素</code>,应该减少这些标签的使用</p> <h3>超链接</h3> <h4>超链接简介</h4> <p>超链接是一个<code>地址</code>,指向<code>其它资源</code>或是<code>文档内容</code><br> 点击超链接后就可访问<code>地址</code>,以进行跳转或获取资源</p> <h4>超链接的定义</h4> <p>在 HTML 中可以使用<code><a></code>定义一个超链接,在其中还包含有一些属性以定义超链接</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>地址<span class="token punctuation">"</span></span> <span class="token attr-name">title</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 attr-name">target</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><code><a></code>可以包含<code>块级元素</code>,这基本意味着它可以把任何东西作为超链接而不单单是文字</p> <h4>URL与Path</h4> <p><code>url</code>全名<code>Uniform Resource Locator</code>,它是代表了一个网络位置的字符串<br> 如<code>https://www.baidu.com</code>就是一个<code>url</code></p> <p><code>path</code>一般指本地的文件路径,是访问本地文件的一个路径,代表着文件的逻辑存放位置</p> <p>路径分为<code>相对路径</code>和<code>绝对路径</code></p> <ul> <li>绝对路径是从<code>根目录</code>开始定位文件位置的</li> <li>相对路径则是依据现处位置定位文件位置 <ul> <li>相对于现路径同级则为<code>./</code></li> <li>前往现路径的上一级为<code>../</code></li> </ul> </li> </ul> <p>定义 超链接 访问文章锚点</p> <ol> <li>为元素设置锚点<code>id=id名字</code></li> <li>设置<code><a></code>的<code>href</code>为<code>#id名字</code></li> <li>点击超链接即可前往对应位置</li> </ol> <h4>超链接最佳实践</h4> <ul> <li>不要使用 url 作为链接的描述</li> <li>链接的描述应该 精确、简洁</li> <li>不要用一些没有意义的词描述链接</li> <li>当链接到特殊 url 时应该描述清楚(如下载,观看视频等)</li> <li>当链接到下载文件的 url 时,应该使用<code>download</code>属性指定一个默认的下载文件名</li> </ul> <h4>定义邮箱链接</h4> <p>可以更改<code>地址</code>为<code>mailto:邮件地址</code>来指向一个电子邮箱<br> 甚至可以提前指定好<code>邮件题目subject</code>、<code>收件人cc</code>、<code>邮件内容body</code></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> mailto:邮件地址&cc=address1&cc=address2&subject=xxx&body=xxx<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> <blockquote> <p>❗️<code>cc</code>、<code>subject</code>、<code>body</code>中包含的信息应该要被转义过</p> </blockquote> <h3>文本处理进阶</h3> <h4>描述列表</h4> <p>除了<code>无序列表</code>和<code>有序列表</code>外,还存在着<code>描述列表</code><br> 这种列表的每一项包括<code>目标文本</code>和<code>描述文本</code>,其中<code>描述文本</code>可以有多个<br> 它的定义和其它列表也不太一样</p> <pre><code class="prism language-html"> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>dl</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>dt</span><span class="token punctuation">></span></span>被描述的东西<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>dt</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>dd</span><span class="token punctuation">></span></span>相关的一些描述,解释,介绍等等<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>dd</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>dt</span><span class="token punctuation">></span></span>被描述的东西<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>dt</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>dd</span><span class="token punctuation">></span></span>相关的一些描述,解释,介绍等等<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>dd</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>dt</span><span class="token punctuation">></span></span>被描述的东西<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>dt</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>dd</span><span class="token punctuation">></span></span>相关的一些描述,解释,介绍等等<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>dd</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>dd</span><span class="token punctuation">></span></span>相关的一些描述,解释,介绍等等<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>dd</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"></</span>dl</span><span class="token punctuation">></span></span> </code></pre> <h4>引用</h4> <p>HTML 有用于标记引用的标签,并且有<code>块引用</code>和<code>行内引用</code><br> 浏览器会分别给它们添加默认的样式</p> <pre><code class="prism language-html"> <span class="token comment"><!--块引用--></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>blockquote</span> <span class="token attr-name">cite</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>p</span><span class="token punctuation">></span></span>引用一个 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>blockquote</span><span class="token punctuation">></span></span> <span class="token comment"><!--行内引用--></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>q</span> <span class="token attr-name">cite</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>q</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> <p>使用<code><blockquote></code>和<code><q></code>标签虽然为文本添加引用样式,但是不能充分利用<code>cite</code>属性的内容<br> 因此,使用<code><a><cite></cite></a></code>这样的结构更能够体现引用地址</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>寂静的春天<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>cite</span><span class="token punctuation">></span></span> 《寂静的春天》 <span class="token tag"><span class="token tag"><span class="token punctuation"></</span>cite</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> <h4>缩略语</h4> <p>在编辑文档时经常遇到<code>缩略语</code>的编写,为了防止有人不知道缩略语的意思,编写者通常会解释一遍缩略语<br> 如果使用<code><abbr></code>标签,那么当鼠标移到缩略语上时,缩略语会自动浮现出全名</p> <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>abbr</span> <span class="token attr-name">title</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>Hyper Text Markup Language<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>HTML<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>abbr</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> <p>其中<code>title</code>属性应该填写有关缩略语的全称</p> <blockquote> <p>❕曾经有一个<code><acronym></code>也是缩略语,但它已经废弃</p> </blockquote> <h4>联系方式标记</h4> <p>可以使用<code><address></code>标记联系地址</p> <pre><code class="prism language-html"> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>address</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>123大街123号<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>mailto:123456@gamil.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> <span class="token tag"><span class="token tag"><span class="token punctuation"></</span>address</span><span class="token punctuation">></span></span> </code></pre> <blockquote> <p>❕联系方式标记的位置要小心,不要搞错了<br> <code><address></code>标记的联系方式应该是离它最近的<code><article></code>所属<br> 或是当它放在<code><footer></code>时,它应该是整个页面的联系方式</p> </blockquote> <h4>上标、下标</h4> <p>上标的标签是<code><sup></code>,下标的标签是<code><sub></code></p> <h4>展示计算机代码</h4> <ul> <li><code><code></code>用来标记计算机通用代码</li> <li><code><pre></code>将文本包裹在其中,<code>空白字符</code>和<code>换行符</code>将以原样展示</li> <li><code><var></code>标记变量名</li> <li><code><kbd></code>标记输入</li> <li><code><samp></code>标记输出</li> </ul> <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>下面是一段 Python 代码<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>pre</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> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>var</span><span class="token punctuation">></span></span>BAT<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>var</span><span class="token punctuation">></span></span>="比亚迪,埃安,特斯拉" <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>var</span><span class="token punctuation">></span></span>STR<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>var</span><span class="token punctuation">></span></span>=input() print(BAT,STR) <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>pre</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>kbd</span><span class="token punctuation">></span></span>我爱<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>kbd</span><span class="token punctuation">></span></span>后,程序会输出<span class="token tag"><span class="token tag"><span class="token punctuation"><</span>samp</span><span class="token punctuation">></span></span>比亚迪,埃安,特斯拉我爱<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>samp</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> <h4>标记时间和日期</h4> <p>因为文本表示时间的格式太多了,因此可以把时间插入到<code><time></code>中<br> 并为它设置一个<code>机器时间</code>,以此统一时间格式</p> <pre><code class="prism language-html"> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>time</span> <span class="token attr-name">datetime</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>2016-06-26<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>2023年 6月 26日<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>time</span><span class="token punctuation">></span></span> </code></pre> <blockquote> <p>❕注意如果时间的位数不够,要用零填补其它位置</p> </blockquote> <p>利用<code>datetime</code>设置一个机器时间</p> <h3>文档与网站架构</h3> <p>HTML 不仅能够定义一些细分的结构,也可以使用块级元素定义网页的整体架构,从而使得网页<code>规划整齐</code>、<code>可读性高</code>、<code>语义化强</code></p> <h4>文档的基本组成部分</h4> <ul> <li>页眉 <ul> <li>通常横跨网页顶部,有大标题或标志</li> <li>放置一些网站的通用信息,通常存在于每个网站页面</li> </ul> </li> <li>导航栏 <ul> <li>存放着指向网站各部分的超链接,是一个索引集</li> <li>通常不跟随页面改变而改变</li> </ul> </li> <li>主内容 <ul> <li>存放有网页的展示信息等等</li> </ul> </li> <li>侧边栏 <ul> <li>一些辅助性的功能,通常和主内容有关</li> </ul> </li> <li>页脚 <ul> <li>和页眉相似,放在网页底部</li> <li>通常放置一些声明,链接等等信息</li> </ul> </li> </ul> <p><a href="http://img.e-com-net.com/image/info8/932ad869ab5b407a8e6219427953562c.jpg" target="_blank"><img src="http://img.e-com-net.com/image/info8/932ad869ab5b407a8e6219427953562c.jpg" alt="HTML-介绍-MDN文档学习笔记_第3张图片" width="617" height="483" style="border:1px solid black;"></a></p> <h4>用于构建内容的HTML</h4> <p>HTML 可根据功能来为区段添加标记,使用元素来无歧义地表示内容区段</p> <table> <thead> <tr> <th align="center">标签</th> <th align="center">名字</th> <th align="center">介绍</th> </tr> </thead> <tbody> <tr> <td align="center"><code><header></code></td> <td align="center">页眉</td> <td align="center">如果是<code><main></code>的子元素那么就是网页的页眉<br>如果是<code><article></code>、<code><section></code>的子元素那么就是它们独有的页眉</td> </tr> <tr> <td align="center"><code><nav></code></td> <td align="center">导航栏</td> <td align="center">包含页眉的导航功能,但不应该包含二级链接等等</td> </tr> <tr> <td align="center"><code><main></code></td> <td align="center">主内容</td> <td align="center">存放每个页面独有的内容,每个页面仅有一个</td> </tr> <tr> <td align="center"><code><article></code></td> <td align="center">文章</td> <td align="center">包裹着一篇文章这类的,与其它部分无关</td> </tr> <tr> <td align="center"><code><section></code></td> <td align="center">大分区</td> <td align="center">组织页面的分块</td> </tr> <tr> <td align="center"><code><aside></code></td> <td align="center">侧边栏</td> <td align="center">包含有一些间接信息,辅助功能等等</td> </tr> <tr> <td align="center"><code><footer></code></td> <td align="center">页脚</td> <td align="center">放置页面的页脚,内含一些通用信息</td> </tr> <tr> <td align="center"><code><div></code></td> <td align="center">块级无语义标签</td> <td align="center">配合id、class使用</td> </tr> <tr> <td align="center"><code><span></code></td> <td align="center">内联无语义标签</td> <td align="center">配合id、class使用</td> </tr> <tr> <td align="center"><code><br></code></td> <td align="center">换行</td> <td align="center">适当的换行能够优化结构</td> </tr> <tr> <td align="center"><code><hr></code></td> <td align="center">水平线</td> <td align="center">使用水平线可以分隔不同部分</td> </tr> </tbody> </table> <blockquote> <p>❗️不要滥用<code>div</code>标签,能不用就不用</p> </blockquote> <h3>HTML-调试</h3> <p>通常的代码错误分为下列两种</p> <ul> <li>语法错误:使用错误的编写使得程序无法运行</li> <li>逻辑错误:存在逻辑上的错误使得不能产生预期结果</li> </ul> <p>因为浏览器是以<code>宽松模式</code>运行的,HTML并不容易出现导致程序停止的错误<br> 但正因如此,浏览器在修复语法错误时很可能给出非预期的结果</p> <p>在不规则语法时,可以手动查找<br> 但更好的方法是使用标记验证服务网站,让机器帮助你找到语法错误</p> <h3>HTML-语义化小项目</h3> <p>HTML-语义化-信件<br> HTML-语义化-观鸟者网</p> <footer> ` | 页脚 | 放置页面的页脚,内含一些通用信息 | | ` <div> ` | 块级无语义标签 | 配合id、class使用 | | ` ` | 内联无语义标签 | 配合id、class使用 | | ` <br>` | 换行 | 适当的换行能够优化结构 | | ` <hr>` | 水平线 | 使用水平线可以分隔不同部分 | </div> </footer> <blockquote> <p>❗️不要滥用<code>div</code>标签,能不用就不用</p> </blockquote> <h3>HTML-调试</h3> <p>通常的代码错误分为下列两种</p> <ul> <li>语法错误:使用错误的编写使得程序无法运行</li> <li>逻辑错误:存在逻辑上的错误使得不能产生预期结果</li> </ul> <p>因为浏览器是以<code>宽松模式</code>运行的,HTML并不容易出现导致程序停止的错误<br> 但正因如此,浏览器在修复语法错误时很可能给出非预期的结果</p> <p>在不规则语法时,可以手动查找<br> 但更好的方法是使用标记验证服务网站,让机器帮助你找到语法错误</p> </div> </div> </div> </div> </div> <!--PC和WAP自适应版--> <div id="SOHUCS" sid="1759478080499429376"></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">你可能感兴趣的:(MDN前端入门文档,html,学习,笔记,前端)</h4> <div id="paradigm-article-related"> <div class="recommend-post mb30"> <ul class="widget-links"> <li><a href="/article/1835514464028422144.htm" title="情绪觉察日记第37天" target="_blank">情绪觉察日记第37天</a> <span class="text-muted">露露_e800</span> <div>今天是家庭关系规划师的第二阶最后一天,慧萍老师帮我做了个案,帮我处理了埋在心底好多年的一份恐惧,并给了我深深的力量!这几天出来学习,爸妈过来婆家帮我带小孩,妈妈出于爱帮我收拾东西,并跟我先生和婆婆产生矛盾,妈妈觉得他们没有照顾好我…。今晚回家见到妈妈,我很欣赏她并赞扬她,妈妈说今晚要跟我睡我说好,当我们俩躺在床上准备睡觉的时候,我握着妈妈的手对她说:妈妈这几天辛苦你了,你看你多利害把我们的家收拾得</div> </li> <li><a href="/article/1835513803861749760.htm" title="机器学习与深度学习间关系与区别" target="_blank">机器学习与深度学习间关系与区别</a> <span class="text-muted">ℒℴѵℯ心·动ꦿ໊ོ꫞</span> <a class="tag" taget="_blank" href="/search/%E4%BA%BA%E5%B7%A5%E6%99%BA%E8%83%BD/1.htm">人工智能</a><a class="tag" taget="_blank" href="/search/%E5%AD%A6%E4%B9%A0/1.htm">学习</a><a class="tag" taget="_blank" href="/search/%E6%B7%B1%E5%BA%A6%E5%AD%A6%E4%B9%A0/1.htm">深度学习</a><a class="tag" taget="_blank" href="/search/python/1.htm">python</a> <div>一、机器学习概述定义机器学习(MachineLearning,ML)是一种通过数据驱动的方法,利用统计学和计算算法来训练模型,使计算机能够从数据中学习并自动进行预测或决策。机器学习通过分析大量数据样本,识别其中的模式和规律,从而对新的数据进行判断。其核心在于通过训练过程,让模型不断优化和提升其预测准确性。主要类型1.监督学习(SupervisedLearning)监督学习是指在训练数据集中包含输入</div> </li> <li><a href="/article/1835513701143244800.htm" title="铭刻于星(四十二)" target="_blank">铭刻于星(四十二)</a> <span class="text-muted">随风至</span> <div>69夜晚,绍敏同学做完功课后,看了眼房外,没听到动静才敢从书包的夹层里拿出那个心形纸团。折痕压得很深,都有些旧了,想来是已经写好很久了。绍敏同学慢慢地、轻轻地捏开折叠处,待到全部拆开后,又反复抚平纸张,然后仔细地一字字默看。只是开头的三个字是第一次看到,让她心漏跳了几拍。“亲爱的绍敏:从四年级的时候,我就喜欢你了,但是我一直不敢说,怕影响你学习。六年级的时候听说有人跟你表白,你接受了,我很难过,但</div> </li> <li><a href="/article/1835513424734416896.htm" title="UI学习——cell的复用和自定义cell" target="_blank">UI学习——cell的复用和自定义cell</a> <span class="text-muted">Magnetic_h</span> <a class="tag" taget="_blank" href="/search/ui/1.htm">ui</a><a class="tag" taget="_blank" href="/search/%E5%AD%A6%E4%B9%A0/1.htm">学习</a> <div>目录cell的复用手动(非注册)自动(注册)自定义cellcell的复用在iOS开发中,单元格复用是一种提高表格(UITableView)和集合视图(UICollectionView)滚动性能的技术。当一个UITableViewCell或UICollectionViewCell首次需要显示时,如果没有可复用的单元格,则视图会创建一个新的单元格。一旦这个单元格滚动出屏幕,它就不会被销毁。相反,它被添</div> </li> <li><a href="/article/1835512809883004928.htm" title="10月|愿你的青春不负梦想-读书笔记-01" target="_blank">10月|愿你的青春不负梦想-读书笔记-01</a> <span class="text-muted">Tracy的小书斋</span> <div>本书的作者是俞敏洪,大家都很熟悉他了吧。俞敏洪老师是我行业的领头羊吧,也是我事业上的偶像。本日摘录他书中第一章中的金句:『一个人如果什么目标都没有,就会浑浑噩噩,感觉生命中缺少能量。能给我们能量的,是对未来的期待。第一件事,我始终为了进步而努力。与其追寻全世界的骏马,不如种植丰美的草原,到时骏马自然会来。第二件事,我始终有阶段性的目标。什么东西能给我能量?答案是对未来的期待。』读到这里的时候,我便</div> </li> <li><a href="/article/1835511542284644352.htm" title="学点心理知识,呵护孩子健康" target="_blank">学点心理知识,呵护孩子健康</a> <span class="text-muted">静候花开_7090</span> <div>昨天听了华中师范大学教育管理学系副教授张玲老师的《哪里才是学生心理健康的最后庇护所,超越教育与技术的思考》的讲座。今天又重新学习了一遍,收获匪浅。张玲博士也注意到了当今社会上的孩子由于心理问题导致的自残、自杀及伤害他人等恶性事件。她向我们普及了一个重要的命题,她说心理健康的一些基本命题,我们与我们通常的一些教育命题是不同的,她还举了几个例子,让我们明白我们原来以为的健康并非心理学上的健康。比如如果</div> </li> <li><a href="/article/1835510025561403392.htm" title="《投行人生》读书笔记" target="_blank">《投行人生》读书笔记</a> <span class="text-muted">小蘑菇的树洞</span> <div>《投行人生》----作者詹姆斯-A-朗德摩根斯坦利副主席40年的职业洞见-很短小精悍的篇幅,比较适合初入职场的新人。第一部分成功的职业生涯需要规划1.情商归为适应能力分享与协作同理心适应能力,更多的是自我意识,你有能力识别自己的情并分辨这些情绪如何影响你的思想和行为。2.对于初入职场的人的建议,细节,截止日期和数据很重要截止日期,一种有效的方法是请老板为你所有的任务进行优先级排序。和老板喝咖啡的好</div> </li> <li><a href="/article/1835509897106649088.htm" title="Long类型前后端数据不一致" target="_blank">Long类型前后端数据不一致</a> <span class="text-muted">igotyback</span> <a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a> <div>响应给前端的数据浏览器控制台中response中看到的Long类型的数据是正常的到前端数据不一致前后端数据类型不匹配是一个常见问题,尤其是当后端使用Java的Long类型(64位)与前端JavaScript的Number类型(最大安全整数为2^53-1,即16位)进行数据交互时,很容易出现精度丢失的问题。这是因为JavaScript中的Number类型无法安全地表示超过16位的整数。为了解决这个问</div> </li> <li><a href="/article/1835509770287673344.htm" title="swagger访问路径" target="_blank">swagger访问路径</a> <span class="text-muted">igotyback</span> <a class="tag" taget="_blank" href="/search/swagger/1.htm">swagger</a> <div>Swagger2.x版本访问地址:http://{ip}:{port}/{context-path}/swagger-ui.html{ip}是你的服务器IP地址。{port}是你的应用服务端口,通常为8080。{context-path}是你的应用上下文路径,如果应用部署在根路径下,则为空。Swagger3.x版本对于Swagger3.x版本(也称为OpenAPI3)访问地址:http://{ip</div> </li> <li><a href="/article/1835508130608410624.htm" title="html 中如何使用 uniapp 的部分方法" target="_blank">html 中如何使用 uniapp 的部分方法</a> <span class="text-muted">某公司摸鱼前端</span> <a class="tag" taget="_blank" href="/search/html/1.htm">html</a><a class="tag" taget="_blank" href="/search/uni-app/1.htm">uni-app</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a> <div>示例代码:Documentconsole.log(window);效果展示:好了,现在就可以uni.使用相关的方法了</div> </li> <li><a href="/article/1835508131032035328.htm" title="ArcGIS栅格计算器常见公式(赋值、0和空值的转换、补充栅格空值)" target="_blank">ArcGIS栅格计算器常见公式(赋值、0和空值的转换、补充栅格空值)</a> <span class="text-muted">研学随笔</span> <a class="tag" taget="_blank" href="/search/arcgis/1.htm">arcgis</a><a class="tag" taget="_blank" href="/search/%E7%BB%8F%E9%AA%8C%E5%88%86%E4%BA%AB/1.htm">经验分享</a> <div>我们在使用ArcGIS时通常经常用到栅格计算器,今天主要给大家介绍我日常中经常用到的几个公式,供大家参考学习。将特定值(-9999)赋值为0,例如-9999.Con("raster"==-9999,0,"raster")2.给空值赋予特定的值(如0)Con(IsNull("raster"),0,"raster")3.将特定的栅格值(如1)赋值为空值,其他保留原值SetNull("raster"==</div> </li> <li><a href="/article/1835507248395284480.htm" title="【一起学Rust | 设计模式】习惯语法——使用借用类型作为参数、格式化拼接字符串、构造函数" target="_blank">【一起学Rust | 设计模式】习惯语法——使用借用类型作为参数、格式化拼接字符串、构造函数</a> <span class="text-muted">广龙宇</span> <a class="tag" taget="_blank" href="/search/%E4%B8%80%E8%B5%B7%E5%AD%A6Rust/1.htm">一起学Rust</a><a class="tag" taget="_blank" href="/search/%23/1.htm">#</a><a class="tag" taget="_blank" href="/search/Rust%E8%AE%BE%E8%AE%A1%E6%A8%A1%E5%BC%8F/1.htm">Rust设计模式</a><a class="tag" taget="_blank" href="/search/rust/1.htm">rust</a><a class="tag" taget="_blank" href="/search/%E8%AE%BE%E8%AE%A1%E6%A8%A1%E5%BC%8F/1.htm">设计模式</a><a class="tag" taget="_blank" href="/search/%E5%BC%80%E5%8F%91%E8%AF%AD%E8%A8%80/1.htm">开发语言</a> <div>提示:文章写完后,目录可以自动生成,如何生成可参考右边的帮助文档文章目录前言一、使用借用类型作为参数二、格式化拼接字符串三、使用构造函数总结前言Rust不是传统的面向对象编程语言,它的所有特性,使其独一无二。因此,学习特定于Rust的设计模式是必要的。本系列文章为作者学习《Rust设计模式》的学习笔记以及自己的见解。因此,本系列文章的结构也与此书的结构相同(后续可能会调成结构),基本上分为三个部分</div> </li> <li><a href="/article/1835506996258893824.htm" title="回溯 Leetcode 332 重新安排行程" target="_blank">回溯 Leetcode 332 重新安排行程</a> <span class="text-muted">mmaerd</span> <a class="tag" taget="_blank" href="/search/Leetcode%E5%88%B7%E9%A2%98%E5%AD%A6%E4%B9%A0%E8%AE%B0%E5%BD%95/1.htm">Leetcode刷题学习记录</a><a class="tag" taget="_blank" href="/search/leetcode/1.htm">leetcode</a><a class="tag" taget="_blank" href="/search/%E7%AE%97%E6%B3%95/1.htm">算法</a><a class="tag" taget="_blank" href="/search/%E8%81%8C%E5%9C%BA%E5%92%8C%E5%8F%91%E5%B1%95/1.htm">职场和发展</a> <div>重新安排行程Leetcode332学习记录自代码随想录给你一份航线列表tickets,其中tickets[i]=[fromi,toi]表示飞机出发和降落的机场地点。请你对该行程进行重新规划排序。所有这些机票都属于一个从JFK(肯尼迪国际机场)出发的先生,所以该行程必须从JFK开始。如果存在多种有效的行程,请你按字典排序返回最小的行程组合。例如,行程[“JFK”,“LGA”]与[“JFK”,“LGB</div> </li> <li><a href="/article/1835506869838376960.htm" title="Python数据分析与可视化实战指南" target="_blank">Python数据分析与可视化实战指南</a> <span class="text-muted">William数据分析</span> <a class="tag" taget="_blank" href="/search/python/1.htm">python</a><a class="tag" taget="_blank" href="/search/python/1.htm">python</a><a class="tag" taget="_blank" href="/search/%E6%95%B0%E6%8D%AE/1.htm">数据</a> <div>在数据驱动的时代,Python因其简洁的语法、强大的库生态系统以及活跃的社区,成为了数据分析与可视化的首选语言。本文将通过一个详细的案例,带领大家学习如何使用Python进行数据分析,并通过可视化来直观呈现分析结果。一、环境准备1.1安装必要库在开始数据分析和可视化之前,我们需要安装一些常用的库。主要包括pandas、numpy、matplotlib和seaborn等。这些库分别用于数据处理、数学</div> </li> <li><a href="/article/1835505858444881920.htm" title="git常用命令笔记" target="_blank">git常用命令笔记</a> <span class="text-muted">咩酱-小羊</span> <a class="tag" taget="_blank" href="/search/git/1.htm">git</a><a class="tag" taget="_blank" href="/search/%E7%AC%94%E8%AE%B0/1.htm">笔记</a> <div>###用习惯了idea总是不记得git的一些常见命令,需要用到的时候总是担心旁边站了人~~~记个笔记@_@,告诉自己看笔记不丢人初始化初始化一个新的Git仓库gitinit配置配置用户信息gitconfig--globaluser.name"YourName"gitconfig--globaluser.email"youremail@example.com"基本操作克隆远程仓库gitclone查看</div> </li> <li><a href="/article/1835504817905168384.htm" title="2019-12-22-22:30" target="_blank">2019-12-22-22:30</a> <span class="text-muted">涓涓1016</span> <div>今天是冬至,写下我的日更,是因为这两天的学习真的是能量的满满,让我看到了自己,未来另外一种可能性,也让我看到了这两年这几年的过程中我所接受那些痛苦的来源。一切的根源和痛苦都来自于人生,家庭,而你的原生家庭,你的爸爸和妈妈,是因为你这个灵魂在那一刻选择他们作为你的爸爸和妈妈来的,所以你得接受他,你得接纳他,他就是因为他的存在而给你的学习和成长带来这些痛苦,那其实是你必然要经历的这个过程,当你去接纳的</div> </li> <li><a href="/article/1835504217729626112.htm" title="Python教程:一文了解使用Python处理XPath" target="_blank">Python教程:一文了解使用Python处理XPath</a> <span class="text-muted">旦莫</span> <a class="tag" taget="_blank" href="/search/Python%E8%BF%9B%E9%98%B6/1.htm">Python进阶</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>目录1.环境准备1.1安装lxml1.2验证安装2.XPath基础2.1什么是XPath?2.2XPath语法2.3示例XML文档3.使用lxml解析XML3.1解析XML文档3.2查看解析结果4.XPath查询4.1基本路径查询4.2使用属性查询4.3查询多个节点5.XPath的高级用法5.1使用逻辑运算符5.2使用函数6.实战案例6.1从网页抓取数据6.1.1安装Requests库6.1.2代</div> </li> <li><a href="/article/1835502704827396096.htm" title="将cmd中命令输出保存为txt文本文件" target="_blank">将cmd中命令输出保存为txt文本文件</a> <span class="text-muted">落难Coder</span> <a class="tag" taget="_blank" href="/search/Windows/1.htm">Windows</a><a class="tag" taget="_blank" href="/search/cmd/1.htm">cmd</a><a class="tag" taget="_blank" href="/search/window/1.htm">window</a> <div>最近深度学习本地的训练中我们常常要在命令行中运行自己的代码,无可厚非,我们有必要保存我们的炼丹结果,但是复制命令行输出到txt是非常麻烦的,其实Windows下的命令行为我们提供了相应的操作。其基本的调用格式就是:运行指令>输出到的文件名称或者具体保存路径测试下,我打开cmd并且ping一下百度:pingwww.baidu.com>./data.txt看下相同目录下data.txt的输出:如果你再</div> </li> <li><a href="/article/1835502282603589632.htm" title="509. 斐波那契数(每日一题)" target="_blank">509. 斐波那契数(每日一题)</a> <span class="text-muted">lzyprime</span> <div>lzyprime博客(github)创建时间:2021.01.04qq及邮箱:2383518170leetcode笔记题目描述斐波那契数,通常用F(n)表示,形成的序列称为斐波那契数列。该数列由0和1开始,后面的每一项数字都是前面两项数字的和。也就是:F(0)=0,F(1)=1F(n)=F(n-1)+F(n-2),其中n>1给你n,请计算F(n)。示例1:输入:2输出:1解释:F(2)=F(1)+</div> </li> <li><a href="/article/1835500750684385280.htm" title="拥有断舍离的心态,过精简生活--《断舍离》读书笔记" target="_blank">拥有断舍离的心态,过精简生活--《断舍离》读书笔记</a> <span class="text-muted">爱吃丸子的小樱桃</span> <div>不知不觉间房间里的东西越来越多,虽然摆放整齐,但也时常会觉得空间逼仄,令人心生烦闷。抱着断舍离的态度,我开始阅读《断舍离》这本书,希望从书中能找到一些有效的方法,帮助我实现空间、物品上的断舍离。《断舍离》是日本作家山下英子通过自己的经历、思考和实践总结而成的,整体内涵也从刚开始的私人生活哲学的“断舍离”升华成了“人生实践哲学”,接着又成为每个人都能实行的“改变人生的断舍离”,从“哲学”逐渐升华成“</div> </li> <li><a href="/article/1835499615491813376.htm" title="四章-32-点要素的聚合" target="_blank">四章-32-点要素的聚合</a> <span class="text-muted">彩云飘过</span> <div>本文基于腾讯课堂老胡的课《跟我学Openlayers--基础实例详解》做的学习笔记,使用的openlayers5.3.xapi。源码见1032.html,对应的官网示例https://openlayers.org/en/latest/examples/cluster.htmlhttps://openlayers.org/en/latest/examples/earthquake-clusters.</div> </li> <li><a href="/article/1835498925755297792.htm" title="DIV+CSS+JavaScript技术制作网页(旅游主题网页设计与制作)云南大理" target="_blank">DIV+CSS+JavaScript技术制作网页(旅游主题网页设计与制作)云南大理</a> <span class="text-muted">STU学生网页设计</span> <a class="tag" taget="_blank" href="/search/%E7%BD%91%E9%A1%B5%E8%AE%BE%E8%AE%A1/1.htm">网页设计</a><a class="tag" taget="_blank" href="/search/%E6%9C%9F%E6%9C%AB%E7%BD%91%E9%A1%B5%E4%BD%9C%E4%B8%9A/1.htm">期末网页作业</a><a class="tag" taget="_blank" href="/search/html%E9%9D%99%E6%80%81%E7%BD%91%E9%A1%B5/1.htm">html静态网页</a><a class="tag" taget="_blank" href="/search/html5%E6%9C%9F%E6%9C%AB%E5%A4%A7%E4%BD%9C%E4%B8%9A/1.htm">html5期末大作业</a><a class="tag" taget="_blank" href="/search/%E7%BD%91%E9%A1%B5%E8%AE%BE%E8%AE%A1/1.htm">网页设计</a><a class="tag" taget="_blank" href="/search/web%E5%A4%A7%E4%BD%9C%E4%B8%9A/1.htm">web大作业</a> <div>️精彩专栏推荐作者主页:【进入主页—获取更多源码】web前端期末大作业:【HTML5网页期末作业(1000套)】程序员有趣的告白方式:【HTML七夕情人节表白网页制作(110套)】文章目录二、网站介绍三、网站效果▶️1.视频演示2.图片演示四、网站代码HTML结构代码CSS样式代码五、更多源码二、网站介绍网站布局方面:计划采用目前主流的、能兼容各大主流浏览器、显示效果稳定的浮动网页布局结构。网站程</div> </li> <li><a href="/article/1835498219489030144.htm" title="高端密码学院笔记285" target="_blank">高端密码学院笔记285</a> <span class="text-muted">柚子_b4b4</span> <div>高端幸福密码学院(高级班)幸福使者:李华第(598)期《幸福》之回归内在深层生命原动力基础篇——揭秘“激励”成长的喜悦心理案例分析主讲:刘莉一,知识扩充:成功=艰苦劳动+正确方法+少说空话。贪图省力的船夫,目标永远下游。智者的梦再美,也不如愚人实干的脚印。幸福早课堂2020.10.16星期五一笔记:1,重视和珍惜的前提是知道它的价值非常重要,当你珍惜了,你就真正定下来,真正的学到身上。2,大家需要</div> </li> <li><a href="/article/1835497792265613312.htm" title="【加密社】Solidity 中的事件机制及其应用" target="_blank">【加密社】Solidity 中的事件机制及其应用</a> <span class="text-muted">加密社</span> <a class="tag" taget="_blank" href="/search/%E9%97%B2%E4%BE%83/1.htm">闲侃</a><a class="tag" taget="_blank" href="/search/%E5%8C%BA%E5%9D%97%E9%93%BE/1.htm">区块链</a><a class="tag" taget="_blank" href="/search/%E6%99%BA%E8%83%BD%E5%90%88%E7%BA%A6/1.htm">智能合约</a><a class="tag" taget="_blank" href="/search/%E5%8C%BA%E5%9D%97%E9%93%BE/1.htm">区块链</a> <div>加密社引言在Solidity合约开发过程中,事件(Events)是一种非常重要的机制。它们不仅能够让开发者记录智能合约的重要状态变更,还能够让外部系统(如前端应用)监听这些状态的变化。本文将详细介绍Solidity中的事件机制以及如何利用不同的手段来触发、监听和获取这些事件。事件存储的地方当我们在Solidity合约中使用emit关键字触发事件时,该事件会被记录在区块链的交易收据中。具体而言,事件</div> </li> <li><a href="/article/1835496402042580992.htm" title="GitHub上克隆项目" target="_blank">GitHub上克隆项目</a> <span class="text-muted">bigbig猩猩</span> <a class="tag" taget="_blank" href="/search/github/1.htm">github</a> <div>从GitHub上克隆项目是一个简单且直接的过程,它允许你将远程仓库中的项目复制到你的本地计算机上,以便进行进一步的开发、测试或学习。以下是一个详细的步骤指南,帮助你从GitHub上克隆项目。一、准备工作1.安装Git在克隆GitHub项目之前,你需要在你的计算机上安装Git工具。Git是一个开源的分布式版本控制系统,用于跟踪和管理代码变更。你可以从Git的官方网站(https://git-scm.</div> </li> <li><a href="/article/1835496149843275776.htm" title="关于城市旅游的HTML网页设计——(旅游风景云南 5页)HTML+CSS+JavaScript" target="_blank">关于城市旅游的HTML网页设计——(旅游风景云南 5页)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/javascript/1.htm">javascript</a><a class="tag" taget="_blank" href="/search/html/1.htm">html</a><a class="tag" taget="_blank" href="/search/css/1.htm">css</a><a class="tag" taget="_blank" href="/search/%E6%97%85%E6%B8%B8/1.htm">旅游</a><a class="tag" taget="_blank" href="/search/%E9%A3%8E%E6%99%AF/1.htm">风景</a> <div>⛵源码获取文末联系✈Web前端开发技术描述网页设计题材,DIV+CSS布局制作,HTML+CSS网页设计期末课程大作业|游景点介绍|旅游风景区|家乡介绍|等网站的设计与制作|HTML期末大学生网页设计作业,Web大学生网页HTML:结构CSS:样式在操作方面上运用了html5和css3,采用了div+css结构、表单、超链接、浮动、绝对定位、相对定位、字体样式、引用视频等基础知识JavaScrip</div> </li> <li><a href="/article/1835496148601761792.htm" title="HTML网页设计制作大作业(div+css) 云南我的家乡旅游景点 带文字滚动" target="_blank">HTML网页设计制作大作业(div+css) 云南我的家乡旅游景点 带文字滚动</a> <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/web%E8%AE%BE%E8%AE%A1%E7%BD%91%E9%A1%B5%E8%A7%84%E5%88%92%E4%B8%8E%E8%AE%BE%E8%AE%A1/1.htm">web设计网页规划与设计</a><a class="tag" taget="_blank" href="/search/html/1.htm">html</a><a class="tag" taget="_blank" href="/search/css/1.htm">css</a><a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a><a class="tag" taget="_blank" href="/search/dreamweaver/1.htm">dreamweaver</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a> <div>Web前端开发技术描述网页设计题材,DIV+CSS布局制作,HTML+CSS网页设计期末课程大作业游景点介绍|旅游风景区|家乡介绍|等网站的设计与制作HTML期末大学生网页设计作业HTML:结构CSS:样式在操作方面上运用了html5和css3,采用了div+css结构、表单、超链接、浮动、绝对定位、相对定位、字体样式、引用视频等基础知识JavaScript:做与用户的交互行为文章目录前端学习路线</div> </li> <li><a href="/article/1835495770502033408.htm" title="Day17笔记-高阶函数" target="_blank">Day17笔记-高阶函数</a> <span class="text-muted">~在杰难逃~</span> <a class="tag" taget="_blank" href="/search/Python/1.htm">Python</a><a class="tag" taget="_blank" href="/search/%E7%AC%94%E8%AE%B0/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><a class="tag" taget="_blank" href="/search/pycharm/1.htm">pycharm</a><a class="tag" taget="_blank" href="/search/%E6%95%B0%E6%8D%AE%E5%88%86%E6%9E%90/1.htm">数据分析</a> <div>高阶函数【重点掌握】函数的本质:函数是一个变量,函数名是一个变量名,一个函数可以作为另一个函数的参数或返回值使用如果A函数作为B函数的参数,B函数调用完成之后,会得到一个结果,则B函数被称为高阶函数常用的高阶函数:map(),reduce(),filter(),sorted()1.map()map(func,iterable),返回值是一个iterator【容器,迭代器】func:函数iterab</div> </li> <li><a href="/article/1835495644123459584.htm" title="Day1笔记-Python简介&标识符和关键字&输入输出" target="_blank">Day1笔记-Python简介&标识符和关键字&输入输出</a> <span class="text-muted">~在杰难逃~</span> <a class="tag" taget="_blank" href="/search/Python/1.htm">Python</a><a class="tag" taget="_blank" href="/search/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><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/%E6%95%B0%E6%8D%AE%E5%88%86%E6%9E%90/1.htm">数据分析</a><a class="tag" taget="_blank" href="/search/%E6%95%B0%E6%8D%AE%E6%8C%96%E6%8E%98/1.htm">数据挖掘</a> <div>大家好,从今天开始呢,杰哥开展一个新的专栏,当然,数据分析部分也会不定时更新的,这个新的专栏主要是讲解一些Python的基础语法和知识,帮助0基础的小伙伴入门和学习Python,感兴趣的小伙伴可以开始认真学习啦!一、Python简介【了解】1.计算机工作原理编程语言就是用来定义计算机程序的形式语言。我们通过编程语言来编写程序代码,再通过语言处理程序执行向计算机发送指令,让计算机完成对应的工作,编程</div> </li> <li><a href="/article/1835494131535802368.htm" title="人工智能时代,程序员如何保持核心竞争力?" target="_blank">人工智能时代,程序员如何保持核心竞争力?</a> <span class="text-muted">jmoych</span> <a class="tag" taget="_blank" href="/search/%E4%BA%BA%E5%B7%A5%E6%99%BA%E8%83%BD/1.htm">人工智能</a> <div>随着AIGC(如chatgpt、midjourney、claude等)大语言模型接二连三的涌现,AI辅助编程工具日益普及,程序员的工作方式正在发生深刻变革。有人担心AI可能取代部分编程工作,也有人认为AI是提高效率的得力助手。面对这一趋势,程序员应该如何应对?是专注于某个领域深耕细作,还是广泛学习以适应快速变化的技术环境?又或者,我们是否应该将重点转向AI无法轻易替代的软技能?让我们一起探讨程序员</div> </li> <li><a href="/article/31.htm" title="312个免费高速HTTP代理IP(能隐藏自己真实IP地址)" target="_blank">312个免费高速HTTP代理IP(能隐藏自己真实IP地址)</a> <span class="text-muted">yangshangchuan</span> <a class="tag" taget="_blank" href="/search/%E9%AB%98%E9%80%9F/1.htm">高速</a><a class="tag" taget="_blank" href="/search/%E5%85%8D%E8%B4%B9/1.htm">免费</a><a class="tag" taget="_blank" href="/search/superword/1.htm">superword</a><a class="tag" taget="_blank" href="/search/HTTP%E4%BB%A3%E7%90%86/1.htm">HTTP代理</a> <div>    124.88.67.20:843 190.36.223.93:8080 117.147.221.38:8123 122.228.92.103:3128 183.247.211.159:8123 124.88.67.35:81 112.18.51.167:8123 218.28.96.39:3128 49.94.160.198:3128 183.20</div> </li> <li><a href="/article/158.htm" title="pull解析和json编码" target="_blank">pull解析和json编码</a> <span class="text-muted">百合不是茶</span> <a class="tag" taget="_blank" href="/search/android/1.htm">android</a><a class="tag" taget="_blank" href="/search/pull%E8%A7%A3%E6%9E%90/1.htm">pull解析</a><a class="tag" taget="_blank" href="/search/json/1.htm">json</a> <div>n.json文件: [{name:java,lan:c++,age:17},{name:android,lan:java,age:8}]   pull.xml文件 <?xml version="1.0" encoding="utf-8"?> <stu>     <name>java</div> </li> <li><a href="/article/285.htm" title="[能源与矿产]石油与地球生态系统" target="_blank">[能源与矿产]石油与地球生态系统</a> <span class="text-muted">comsci</span> <a class="tag" taget="_blank" href="/search/%E8%83%BD%E6%BA%90/1.htm">能源</a> <div>       按照苏联的科学界的说法,石油并非是远古的生物残骸的演变产物,而是一种可以由某些特殊地质结构和物理条件生产出来的东西,也就是说,石油是可以自增长的....       那么我们做一个猜想: 石油好像是地球的体液,我们地球具有自动产生石油的某种机制,只要我们不过量开采石油,并保护好</div> </li> <li><a href="/article/412.htm" title="类与对象浅谈" target="_blank">类与对象浅谈</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/%E5%9F%BA%E7%A1%80/1.htm">基础</a> <div>        类,字面理解,便是同一种事物的总称,比如人类,是对世界上所有人的一个总称。而对象,便是类的具体化,实例化,是一个具体事物,比如张飞这个人,就是人类的一个对象。但要注意的是:张飞这个人是对象,而不是张飞,张飞只是他这个人的名字,是他的属性而已。而一个类中包含了属性和方法这两兄弟,他们分别用来描述对象的行为和性质(感觉应该是</div> </li> <li><a href="/article/539.htm" title="新站开始被收录后,我们应该做什么?" target="_blank">新站开始被收录后,我们应该做什么?</a> <span class="text-muted">IT独行者</span> <a class="tag" taget="_blank" href="/search/PHP/1.htm">PHP</a><a class="tag" taget="_blank" href="/search/seo/1.htm">seo</a> <div>新站开始被收录后,我们应该做什么?         百度终于开始收录自己的网站了,作为站长,你是不是觉得那一刻很有成就感呢,同时,你是不是又很茫然,不知道下一步该做什么了?至少我当初就是这样,在这里和大家一份分享一下新站收录后,我们要做哪些工作。       至于如何让百度快速收录自己的网站,可以参考我之前的帖子《新站让百</div> </li> <li><a href="/article/666.htm" title="oracle 连接碰到的问题" target="_blank">oracle 连接碰到的问题</a> <span class="text-muted">文强chu</span> <a class="tag" taget="_blank" href="/search/oracle/1.htm">oracle</a> <div>Unable to find a java Virtual Machine--安装64位版Oracle11gR2后无法启动SQLDeveloper的解决方案 作者:草根IT网 来源:未知 人气:813标签: 导读:安装64位版Oracle11gR2后发现启动SQLDeveloper时弹出配置java.exe的路径,找到Oracle自带java.exe后产生的路径“C:\app\用户名\prod</div> </li> <li><a href="/article/793.htm" title="Swing中按ctrl键同时移动鼠标拖动组件(类中多借口共享同一数据)" target="_blank">Swing中按ctrl键同时移动鼠标拖动组件(类中多借口共享同一数据)</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%BB%A7%E6%89%BF/1.htm">继承</a><a class="tag" taget="_blank" href="/search/swing/1.htm">swing</a><a class="tag" taget="_blank" href="/search/%E6%8E%A5%E5%8F%A3/1.htm">接口</a><a class="tag" taget="_blank" href="/search/%E7%9B%91%E5%90%AC/1.htm">监听</a> <div>        都知道java中类只能单继承,但可以实现多个接口,但我发现实现多个接口之后,多个接口却不能共享同一个数据,应用开发中想实现:当用户按着ctrl键时,可以用鼠标点击拖动组件,比如说文本框。 编写一个监听实现KeyListener,NouseListener,MouseMotionListener三个接口,重写方法。定义一个全局变量boolea</div> </li> <li><a href="/article/920.htm" title="linux常用的命令" target="_blank">linux常用的命令</a> <span class="text-muted">aichenglong</span> <a class="tag" taget="_blank" href="/search/linux/1.htm">linux</a><a class="tag" taget="_blank" href="/search/%E5%B8%B8%E7%94%A8%E5%91%BD%E4%BB%A4/1.htm">常用命令</a> <div>1 startx切换到图形化界面 2 man命令:查看帮助信息 man 需要查看的命令,man命令提供了大量的帮助信息,一般可以分成4个部分 name:对命令的简单说明 synopsis:命令的使用格式说明 description:命令的详细说明信息 options:命令的各项说明 3 date:显示时间 语法:date [OPTION]... [+FORMAT] </div> </li> <li><a href="/article/1047.htm" title="eclipse内存优化" target="_blank">eclipse内存优化</a> <span class="text-muted">AILIKES</span> <a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/eclipse/1.htm">eclipse</a><a class="tag" taget="_blank" href="/search/jvm/1.htm">jvm</a><a class="tag" taget="_blank" href="/search/jdk/1.htm">jdk</a> <div>一 基本说明      在JVM中,总体上分2块内存区,默认空余堆内存小于 40%时,JVM就会增大堆直到-Xmx的最大限制;空余堆内存大于70%时,JVM会减少堆直到-Xms的最小限制。     1)堆内存(Heap memory):堆是运行时数据区域,所有类实例和数组的内存均从此处分配,是Java代码可及的内存,是留给开发人</div> </li> <li><a href="/article/1174.htm" title="关键字的使用探讨" target="_blank">关键字的使用探讨</a> <span class="text-muted">百合不是茶</span> <a class="tag" taget="_blank" href="/search/%E5%85%B3%E9%94%AE%E5%AD%97/1.htm">关键字</a> <div>//关键字的使用探讨/*访问关键词private 只能在本类中访问public 只能在本工程中访问protected 只能在包中和子类中访问默认的 只能在包中访问*//*final   类 方法 变量 final 类 不能被继承 final 方法 不能被子类覆盖,但可以继承 final 变量 只能有一次赋值,赋值后不能改变 final 不能用来修饰构造方法*///this()</div> </li> <li><a href="/article/1301.htm" title="JS中定义对象的几种方式" target="_blank">JS中定义对象的几种方式</a> <span class="text-muted">bijian1013</span> <a class="tag" taget="_blank" href="/search/js/1.htm">js</a> <div>    1. 基于已有对象扩充其对象和方法(只适合于临时的生成一个对象): <html> <head> <title>基于已有对象扩充其对象和方法(只适合于临时的生成一个对象)</title> </head> <script> var obj = new Object(); </div> </li> <li><a href="/article/1428.htm" title="表驱动法实例" target="_blank">表驱动法实例</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/%E8%A1%A8%E9%A9%B1%E5%8A%A8%E6%B3%95/1.htm">表驱动法</a><a class="tag" taget="_blank" href="/search/TDD/1.htm">TDD</a> <div>获得月的天数是典型的直接访问驱动表方式的实例,下面我们来展示一下: MonthDaysTest.java package com.study.test; import org.junit.Assert; import org.junit.Test; import com.study.MonthDays; public class MonthDaysTest { @T</div> </li> <li><a href="/article/1555.htm" title="LInux启停重启常用服务器的脚本" target="_blank">LInux启停重启常用服务器的脚本</a> <span class="text-muted">bit1129</span> <a class="tag" taget="_blank" href="/search/linux/1.htm">linux</a> <div>启动,停止和重启常用服务器的Bash脚本,对于每个服务器,需要根据实际的安装路径做相应的修改   #! /bin/bash Servers=(Apache2, Nginx, Resin, Tomcat, Couchbase, SVN, ActiveMQ, Mongo); Ops=(Start, Stop, Restart); currentDir=$(pwd); echo</div> </li> <li><a href="/article/1682.htm" title="【HBase六】REST操作HBase" target="_blank">【HBase六】REST操作HBase</a> <span class="text-muted">bit1129</span> <a class="tag" taget="_blank" href="/search/hbase/1.htm">hbase</a> <div>HBase提供了REST风格的服务方便查看HBase集群的信息,以及执行增删改查操作   1. 启动和停止HBase REST 服务 1.1 启动REST服务 前台启动(默认端口号8080) [hadoop@hadoop bin]$ ./hbase rest start   后台启动 hbase-daemon.sh start rest   启动时指定</div> </li> <li><a href="/article/1809.htm" title="大话zabbix 3.0设计假设" target="_blank">大话zabbix 3.0设计假设</a> <span class="text-muted">ronin47</span> <div>What’s new in Zabbix 2.0? 去年开始使用Zabbix的时候,是1.8.X的版本,今年Zabbix已经跨入了2.0的时代。看了2.0的release notes,和performance相关的有下面几个:          :: Performance improvements::Trigger related da</div> </li> <li><a href="/article/1936.htm" title="http错误码大全" target="_blank">http错误码大全</a> <span class="text-muted">byalias</span> <a class="tag" taget="_blank" href="/search/http%E5%8D%8F%E8%AE%AE/1.htm">http协议</a><a class="tag" taget="_blank" href="/search/javaweb/1.htm">javaweb</a> <div>响应码由三位十进制数字组成,它们出现在由HTTP服务器发送的响应的第一行。 响应码分五种类型,由它们的第一位数字表示: 1)1xx:信息,请求收到,继续处理 2)2xx:成功,行为被成功地接受、理解和采纳 3)3xx:重定向,为了完成请求,必须进一步执行的动作 4)4xx:客户端错误,请求包含语法错误或者请求无法实现 5)5xx:服务器错误,服务器不能实现一种明显无效的请求 </div> </li> <li><a href="/article/2063.htm" title="J2EE设计模式-Intercepting Filter" target="_blank">J2EE设计模式-Intercepting Filter</a> <span class="text-muted">bylijinnan</span> <a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/%E8%AE%BE%E8%AE%A1%E6%A8%A1%E5%BC%8F/1.htm">设计模式</a><a class="tag" taget="_blank" href="/search/%E6%95%B0%E6%8D%AE%E7%BB%93%E6%9E%84/1.htm">数据结构</a> <div>Intercepting Filter类似于职责链模式 有两种实现 其中一种是Filter之间没有联系,全部Filter都存放在FilterChain中,由FilterChain来有序或无序地把把所有Filter调用一遍。没有用到链表这种数据结构。示例如下: package com.ljn.filter.custom; import java.util.ArrayList;</div> </li> <li><a href="/article/2190.htm" title="修改jboss端口" target="_blank">修改jboss端口</a> <span class="text-muted">chicony</span> <a class="tag" taget="_blank" href="/search/jboss/1.htm">jboss</a> <div>修改jboss端口   %JBOSS_HOME%\server\{服务实例名}\conf\bindingservice.beans\META-INF\bindings-jboss-beans.xml   中找到 <!-- The ports-default bindings are obtained by taking the base bindin</div> </li> <li><a href="/article/2317.htm" title="c++ 用类模版实现数组类" target="_blank">c++ 用类模版实现数组类</a> <span class="text-muted">CrazyMizzz</span> <a class="tag" taget="_blank" href="/search/C%2B%2B/1.htm">C++</a> <div>最近c++学到数组类,写了代码将他实现,基本具有vector类的功能 #include<iostream> #include<string> #include<cassert> using namespace std; template<class T> class Array { public: //构造函数 </div> </li> <li><a href="/article/2444.htm" title="hadoop dfs.datanode.du.reserved 预留空间配置方法" target="_blank">hadoop dfs.datanode.du.reserved 预留空间配置方法</a> <span class="text-muted">daizj</span> <a class="tag" taget="_blank" href="/search/hadoop/1.htm">hadoop</a><a class="tag" taget="_blank" href="/search/%E9%A2%84%E7%95%99%E7%A9%BA%E9%97%B4/1.htm">预留空间</a> <div>对于datanode配置预留空间的方法 为:在hdfs-site.xml添加如下配置  <property>     <name>dfs.datanode.du.reserved</name>     <value>10737418240</value>    </div> </li> <li><a href="/article/2571.htm" title="mysql远程访问的设置" target="_blank">mysql远程访问的设置</a> <span class="text-muted">dcj3sjt126com</span> <a class="tag" taget="_blank" href="/search/mysql/1.htm">mysql</a><a class="tag" taget="_blank" href="/search/%E9%98%B2%E7%81%AB%E5%A2%99/1.htm">防火墙</a> <div>第一步: 激活网络设置 你需要编辑mysql配置文件my.cnf. 通常状况,my.cnf放置于在以下目录: /etc/mysql/my.cnf (Debian linux) /etc/my.cnf (Red Hat Linux/Fedora Linux) /var/db/mysql/my.cnf (FreeBSD) 然后用vi编辑my.cnf,修改内容从以下行: [mysqld] 你所需要: 1</div> </li> <li><a href="/article/2698.htm" title="ios 使用特定的popToViewController返回到相应的Controller" target="_blank">ios 使用特定的popToViewController返回到相应的Controller</a> <span class="text-muted">dcj3sjt126com</span> <a class="tag" taget="_blank" href="/search/controller/1.htm">controller</a> <div>1、取navigationCtroller中的Controllers NSArray * ctrlArray = self.navigationController.viewControllers; 2、取出后,执行, [self.navigationController popToViewController:[ctrlArray objectAtIndex:0] animated:YES</div> </li> <li><a href="/article/2825.htm" title="Linux正则表达式和通配符的区别" target="_blank">Linux正则表达式和通配符的区别</a> <span class="text-muted">eksliang</span> <a class="tag" taget="_blank" href="/search/%E6%AD%A3%E5%88%99%E8%A1%A8%E8%BE%BE%E5%BC%8F/1.htm">正则表达式</a><a class="tag" taget="_blank" href="/search/%E9%80%9A%E9%85%8D%E7%AC%A6%E5%92%8C%E6%AD%A3%E5%88%99%E8%A1%A8%E8%BE%BE%E5%BC%8F%E7%9A%84%E5%8C%BA%E5%88%AB/1.htm">通配符和正则表达式的区别</a><a class="tag" taget="_blank" href="/search/%E9%80%9A%E9%85%8D%E7%AC%A6/1.htm">通配符</a> <div>转载请出自出处:http://eksliang.iteye.com/blog/1976579 首先得明白二者是截然不同的 通配符只能用在shell命令中,用来处理字符串的的匹配。 判断一个命令是否为bash shell(linux 默认的shell)的内置命令 type -t commad 返回结果含义 file  表示为外部命令 alias  表示该</div> </li> <li><a href="/article/2952.htm" title="Ubuntu Mysql Install and CONF" target="_blank">Ubuntu Mysql Install and CONF</a> <span class="text-muted">gengzg</span> <a class="tag" taget="_blank" href="/search/Install/1.htm">Install</a> <div>http://www.navicat.com.cn/download/navicat-for-mysql Step1: 下载Navicat ,网址:http://www.navicat.com/en/download/download.html Step2:进入下载目录,解压压缩包:tar -zxvf navicat11_mysql_en.tar.gz </div> </li> <li><a href="/article/3079.htm" title="批处理,删除文件bat" target="_blank">批处理,删除文件bat</a> <span class="text-muted">huqiji</span> <a class="tag" taget="_blank" href="/search/windows/1.htm">windows</a><a class="tag" taget="_blank" href="/search/dos/1.htm">dos</a> <div>@echo off ::演示:删除指定路径下指定天数之前(以文件名中包含的日期字符串为准)的文件。 ::如果演示结果无误,把del前面的echo去掉,即可实现真正删除。 ::本例假设文件名中包含的日期字符串(比如:bak-2009-12-25.log) rem 指定待删除文件的存放路径 set SrcDir=C:/Test/BatHome rem 指定天数 set DaysAgo=1</div> </li> <li><a href="/article/3206.htm" title="跨浏览器兼容的HTML5视频音频播放器" target="_blank">跨浏览器兼容的HTML5视频音频播放器</a> <span class="text-muted">天梯梦</span> <a class="tag" taget="_blank" href="/search/html5/1.htm">html5</a> <div>HTML5的video和audio标签是用来在网页中加入视频和音频的标签,在支持html5的浏览器中不需要预先加载Adobe Flash浏览器插件就能轻松快速的播放视频和音频文件。而html5media.js可以在不支持html5的浏览器上使video和audio标签生效。   How to enable <video> and <audio> tags in </div> </li> <li><a href="/article/3333.htm" title="Bundle自定义数据传递" target="_blank">Bundle自定义数据传递</a> <span class="text-muted">hm4123660</span> <a class="tag" taget="_blank" href="/search/android/1.htm">android</a><a class="tag" taget="_blank" href="/search/Serializable/1.htm">Serializable</a><a class="tag" taget="_blank" href="/search/%E8%87%AA%E5%AE%9A%E4%B9%89%E6%95%B0%E6%8D%AE%E4%BC%A0%E9%80%92/1.htm">自定义数据传递</a><a class="tag" taget="_blank" href="/search/Bundle/1.htm">Bundle</a><a class="tag" taget="_blank" href="/search/Parcelable/1.htm">Parcelable</a> <div>      我们都知道Bundle可能过put****()方法添加各种基本类型的数据,Intent也可以通过putExtras(Bundle)将数据添加进去,然后通过startActivity()跳到下一下Activity的时候就把数据也传到下一个Activity了。如传递一个字符串到下一个Activity   把数据放到Intent</div> </li> <li><a href="/article/3460.htm" title="C#:异步编程和线程的使用(.NET 4.5 )" target="_blank">C#:异步编程和线程的使用(.NET 4.5 )</a> <span class="text-muted">powertoolsteam</span> <a class="tag" taget="_blank" href="/search/.net/1.htm">.net</a><a class="tag" taget="_blank" href="/search/%E7%BA%BF%E7%A8%8B/1.htm">线程</a><a class="tag" taget="_blank" href="/search/C%23/1.htm">C#</a><a class="tag" taget="_blank" href="/search/%E5%BC%82%E6%AD%A5%E7%BC%96%E7%A8%8B/1.htm">异步编程</a> <div>异步编程和线程处理是并发或并行编程非常重要的功能特征。为了实现异步编程,可使用线程也可以不用。将异步与线程同时讲,将有助于我们更好的理解它们的特征。 本文中涉及关键知识点 1. 异步编程 2. 线程的使用 3. 基于任务的异步模式 4. 并行编程 5. 总结 异步编程 什么是异步操作?异步操作是指某些操作能够独立运行,不依赖主流程或主其他处理流程。通常情况下,C#程序</div> </li> <li><a href="/article/3587.htm" title="spark 查看 job history 日志" target="_blank">spark 查看 job history 日志</a> <span class="text-muted">Stark_Summer</span> <a class="tag" taget="_blank" href="/search/%E6%97%A5%E5%BF%97/1.htm">日志</a><a class="tag" taget="_blank" href="/search/spark/1.htm">spark</a><a class="tag" taget="_blank" href="/search/history/1.htm">history</a><a class="tag" taget="_blank" href="/search/job/1.htm">job</a> <div>SPARK_HOME/conf 下: spark-defaults.conf 增加如下内容 spark.eventLog.enabled true spark.eventLog.dir hdfs://master:8020/var/log/spark spark.eventLog.compress true spark-env.sh 增加如下内容 export SP</div> </li> <li><a href="/article/3714.htm" title="SSH框架搭建" target="_blank">SSH框架搭建</a> <span class="text-muted">wangxiukai2015eye</span> <a class="tag" taget="_blank" href="/search/spring/1.htm">spring</a><a class="tag" taget="_blank" href="/search/Hibernate/1.htm">Hibernate</a><a class="tag" taget="_blank" href="/search/struts/1.htm">struts</a> <div>MyEclipse搭建SSH框架 Struts Spring Hibernate 1、new一个web project。 2、右键项目,为项目添加Struts支持。    选择Struts2 Core Libraries -<MyEclipes-Library>      点击Finish。src目录下多了struts</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>