m0_59519985

html基础

MDN官方文档

MDN Web Docs

VScode

安装插件 Live Server Auto Rename Tag

自动格式化点击settings，然后输入format，然后勾选上Format On Save

html文件结构

文档结构
html的所有标签为树形结构，例如：




    
    
    Web应用课


    第一讲

标签
HTML  元素 表示一个 HTML 文档的根（顶级元素），所以它也被称为根元素。所有其他元素必须是此元素的后代。

标签
HTML head 元素 规定文档相关的配置信息（元数据），包括文档的标题，引用的文档样式和脚本等。

标签
HTML body 元素表示文档的内容。document.body 属性提供了可以轻松访问文档的 body 元素的脚本。

标签
HTML <title> 元素 定义文档的标题，显示在浏览器的标题栏或标签页上。它只应该包含文本，若是包含有标签，则它包含的任何标签都将被忽略。

<meta>
HTML <meta> 元素表示那些不能由其它 HTML 元相关（meta-related）元素（(<base>、<link>, <script>、<style> 或 <title>）之一表示的任何元数据信息。

常见属性：

charset：这个属性声明了文档的字符编码。如果使用了这个属性，其值必须是与 ASCII 大小写无关（ASCII case-insensitive）的”utf-8”。
name：name 和 content 属性可以一起使用，以名 - 值对的方式给文档提供元数据，其中 name 作为元数据的名称，content 作为元数据的值。
icon
<link rel="icon" href="images/icon.png">

<!-- 多行注释 -->
示例：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document

文本标签

文本标签虽然很多，但大部分可看成是预定好样式的

和。

, , , 。
标签

  元素是短语内容的通用行内容器，并没有任何特殊语义。可以使用它来编组元素以达到某种样式意图（通过使用类或者 Id 属性），或者这些元素有着共同的属性，比如lang。应该在没有其他合适的语义元素时才使用它。 与 
 元素很相似，但  是一个 块元素 而  则是 行内元素
 其他内联标签例如：, , , , 
 
    
   , 。 
   
 - 
标签 
   
 HTML 
–
 标题 (Heading) 元素呈现了六个不同的级别的标题，
 级别最高，而 
 级别最低。 
   
标签 
   
 HTML 
元素（或者说 HTML 段落元素）表示文本的一个段落。该元素通常表现为一整块与相邻文本分离的文本，或以垂直的空白隔离或以首行缩进。另外，
 是块级元素。 
   标签 
   
 HTML  元素表示预定义格式文本。在该元素中的文本通常按照原文件中的编排，以等宽字体的形式展现出来，文本中的空白符（比如空格和换行符）都会显示出来。(紧跟在  开始标签后的换行符也会被省略) 
   
标签 
   
 HTML 
 元素在文本中生成一个换行（回车）符号。此元素在写诗和地址时很有用，这些地方的换行都非常重要。 
   
标签 
   
 HTML 
 元素表示段落级元素之间的主题转换（例如，一个故事中的场景的改变，或一个章节的主题的改变）。 
   在 HTML 的早期版本中，它是一个水平线。现在它仍能在可视化浏览器中表现为水平线，但目前被定义为语义上的，而不是表现层面上。所以如果想画一条横线，请使用适当的 css 样式来修饰。 
   标签
 
   
 HTML 元素  用于表现因某些原因需要区分普通文本的一系列文本。例如技术术语、外文短语或是小说中人物的思想活动等，它的内容通常以斜体显示。
 
   标签
 
   
 HTML 提醒注意（Bring Attention To）元素（）用于吸引读者的注意到该元素的内容上（如果没有另加特别强调）。这个元素过去被认为是粗体（Boldface）元素，并且大多数浏览器仍然将文字显示为粗体。尽管如此，你不应将  元素用于显示粗体文字；替代方案是使用 CSS font-weight 属性来创建粗体文字。
 
   标签 
   
 HTML 的标签表示一些被从文档中删除的文字内容。比如可以在需要显示修改记录或者源代码差异的情况使用这个标签。标签的作用恰恰于此相反：表示文档中添加的内容。 
   标签 
   
 HTML  元素定义已经被插入文档中的文本。 
   
   
    图片 
   HTML  元素将一份图像嵌入文档。
 默认为行内元素，即display: inline。 
   src属性 
   
 该属性是必须的，它包含了你想嵌入的图片的文件路径。 
   alt属性 
   
 该属性包含一条对图像的文本描述，这不是强制性的，但对可访问性而言，它难以置信地有用——屏幕阅读器会将这些描述读给需要使用阅读器的使用者听，让他们知道图像的含义。如果由于某种原因无法加载图像，普通浏览器也会在页面上显示alt 属性中的备用文本：例如，网络错误、内容被屏蔽或链接过期时。 
   height属性 
   
 图像的高度，在 HTML5 中的单位是 CSS 像素，在 HTML 4 中既可以是像素，也可以是百分比。可以只指定 width 和 height 中的一个值，浏览器会根据原始图像进行缩放。 
   width属性 
   
 图像的宽度，在 HTML5 中单位是 CSS 像素， 在 HTML 4 中可以是像素也可以是百分比。 
    
   
   
   音频和视频  
    
   
 HTML  
   使用src属性播放
 示例： 
    
    
    
   资源
 mp3
 sound1
 sound2
  
   示例： 
    
   
   
    表单 
   标签 
   
 HTML  元素表示文档中的一个区域，此区域包含交互控件，用于向 Web 服务器提交信息。 
   标签 
   
 HTML 用来填写内容，常见类型有： 
   ：创建基础的单行文本框。
 ：用于让用户输入一个数字。其包括内置验证以拒绝非数字输入。浏览器可能会选择提供步进箭头，让用户可以使用鼠标增加和减少输入的值，或者只需用指尖敲击即可。
 ：带有 “email” (电子邮箱) 类型标记的输入框元素 () 能够让用户输入或编辑一个电子邮箱地址，此外，如果指定了multiple属性，用户还可以输入多个电子邮箱地址。在表单提交前，输入框会自动验证输入值是否是一个或多个合法的电子邮箱地址 (非空值且符合电子邮箱地址格式). CSS 伪标签 :valid 和 :invalid 能够在校验后自动应用。
 ： 元素 里有一种叫做 “password” 的值，给我们一个方法让用户更加安全的输入密码。这个元素是作为一行纯文本编辑器控件呈现的，其中文本被遮蔽以致于无法读取，通常通过用诸如星号（“*”）或点（“•”）等符号替换每个字符来实现。这个符号会根据用户的浏览器和操作系统来具体显示哪个。
 ： 的 radio 类型元素默认渲染为小型圆圈图表，填充即为激活，类似于之前描述额复选框（checkbox）类型。单选按钮允许你选择单一的值来提交表单。
 常用属性有： 
   name: 名称
 id: 唯一ID
 maxlength：最大长度
 minlength：最小长度
 required：是否必填
 placeholder：当表单控件为空时，控件中显示的内容 
   
 标签</h3> 
   <p><br> HTML <textarea> 元素表示一个多行纯文本编辑控件，当你希望用户输入一段相当长的、不限格式的文本，例如评论或反馈表单中的一段意见时，这很有用。</p> 
   <h3><select>与<option>标签</h3> 
   <p><br> HTML <select> 元素表示一个提供选项菜单的控件。</p> 
   <p>示例：</p> 
   <p><label for="pet-select">Choose a pet:</label></p> 
   <p><select name="pets" id="pet-select"><br>     <option value="">--Please choose an option--</option><br>     <option value="dog">Dog</option><br>     <option value="cat">Cat</option><br>     <option value="hamster">Hamster</option><br>     <option value="parrot">Parrot</option><br>     <option value="spider">Spider</option><br>     <option value="goldfish">Goldfish</option><br> </select></p> 
   <h3><br> <button>标签</h3> 
   <p>HTML <button> 元素表示一个可点击的按钮，可以用在表单或文档其它需要使用简单标准按钮的地方。 默认情况下，HTML 按钮的显示样式接近于 user agent 所在的宿主系统平台（用户操作系统）的按钮， 但你可以使用 CSS 来改变按钮的样貌。</p> 
  </blockquote> 
  <blockquote> 
   <h2> 列表</h2> 
   <h3><ul>与<li>标签</h3> 
   <p>HTML <ul> 元素（或称 HTML 无序列表元素）表示一个内可含多个元素的无序列表或项目符号列表。</p> 
   <p>示例：</p> 
   <pre><code class="language-html"><ul>
  <li>first item</li>
  <li>second item</li>
  <li>third item</li>
</ul></code></pre> 
   <h3><ol>与<li>标签</h3> 
   <p>HTML <ol> 元素表示有序列表，通常渲染为一个带编号的列表。</p> 
   <p>示例：</p> 
   <pre><code class="language-html"><ol>
  <li>Fee</li>
  <li>Fi</li>
  <li>Fo</li>
  <li>Fum</li>
</ol></code></pre> 
   <h3><dl>、<dt>与<dd>标签</h3> 
   <p>HTML <dl> 元素 （或 HTML 描述列表元素）是一个包含术语定义以及描述的列表，通常用于展示词汇表或者元数据 (键 - 值对列表)。</p> 
   <p>示例：</p> 
   <pre><code class="language-html"><dl>
    <dt>Name</dt>
    <dd>Godzilla</dd>
    <dt>Born</dt>
    <dd>1952</dd>
    <dt>Birthplace</dt>
    <dd>Japan</dd>
    <dt>Color</dt>
    <dd>Green</dd>
    <dd>Orange</dd>
</dl></code></pre> 
  </blockquote> 
  <blockquote> 
   <h2> 表格</h2> 
   <h3><table>标签</h3> 
   <p>HTML的 table 元素表示表格数据 — 即通过二维数据表表示的信息。</p> 
   <h3><thead>标签</h3> 
   <p>HTML的<thead>元素定义了一组定义表格的列头的行。</p> 
   <h3><tbody>标签</h3> 
   <p>HTML的<tbody>元素定义一组数据行。</p> 
   <h3><tr>标签</h3> 
   <p>HTML <tr> 元素定义表格中的行。 同一行可同时出现<td> 和<th> 元素。</p> 
   <h3><th>标签</h3> 
   <p>HTML <th>元素定义表格内的表头单元格。</p> 
   <h3><td>标签</h3> 
   <p>HTML <td> 元素 定义了一个包含数据的表格单元格。</p> 
   <h3><caption>标签</h3> 
   <p>HTML <caption> 元素 (or HTML 表格标题元素) 展示一个表格的标题， 它常常作为 <table> 的第一个子元素出现，同时显示在表格内容的最前面，但是，它同样可以被 CSS 样式化，所以，它同样可以出现在相对于表格的任意位置。</p> 
   <p>示例<br>  </p> 
   <pre><code class="language-html"><table>
    <caption>My Table</caption>
    <thead>
        <tr>
            <th colspan="2">The table header</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>The table body</td>
            <td>with two columns</td>
        </tr>
    </tbody>
</table></code></pre> 
  </blockquote> 
  <blockquote> 
   <h2> 语义标签</h2> 
   <p><a href="http://img.e-com-net.com/image/info8/c2549ccecb8c4881bafc90590ef599b5.jpg" target="_blank"><img alt="html基础_第2张图片" height="354" src="http://img.e-com-net.com/image/info8/c2549ccecb8c4881bafc90590ef599b5.jpg" width="354" style="border:1px solid black;"></a></p> 
   <h3><header></h3> 
   <p>HTML <header> 元素用于展示介绍性内容，通常包含一组介绍性的或是辅助导航的实用元素。它可能包含一些标题元素，但也可能包含其他元素，比如 Logo、搜索框、作者名称，等等。</p> 
   <h3><nav></h3> 
   <p>HTML <nav>元素表示页面的一部分，其目的是在当前文档或其他文档中提供导航链接。导航部分的常见示例是菜单，目录和索引。</p> 
   <h3><section></h3> 
   <p>HTML <section>元素表示一个包含在 HTML 文档中的独立部分，它没有更具体的语义元素来表示，一般来说会有包含一个标题。</p> 
   <h3><figure></h3> 
   <p>HTML <figure> 元素代表一段独立的内容，经常与说明（caption）<figcaption> 配合使用，并且作为一个独立的引用单元。当它属于主内容流（main flow）时，它的位置独立于主体。这个标签经常是在主文中引用的图片，插图，表格，代码段等等，当这部分转移到附录中或者其他页面时不会影响到主体。</p> 
   <h3><figcaption></h3> 
   <p>HTML <figcaption> 元素 是与其相关联的图片的说明/标题，用于描述其父节点 <figure> 元素里的其他数据。这意味着 <figcaption> 在<figure> 块里是第一个或最后一个。同时 HTML Figcaption 元素是可选的；如果没有该元素，这个父节点的图片只是会没有说明/标题。</p> 
   <h3><article></h3> 
   <p>HTML <article>元素表示文档、页面、应用或网站中的独立结构，其意在成为可独立分配的或可复用的结构，如在发布中，它可能是论坛帖子、杂志或新闻文章、博客、用户提交的评论、交互式组件，或者其他独立的内容项目。</p> 
   <h3><aside></h3> 
   <p>HTML <aside> 元素表示一个和其余页面内容几乎无关的部分，被认为是独立于该内容的一部分并且可以被单独的拆分出来而不会使整体受影响。其通常表现为侧边栏或者标注框（call-out boxes）。</p> 
   <h3><footer></h3> 
   <p>HTML <footer> 元素表示最近一个章节内容或者根节点（sectioning root ）元素的页脚。一个页脚通常包含该章节作者、版权数据或者与文档相关的链接等信息。</p> 
  </blockquote> 
  <blockquote> 
   <h2>语义符号</h2> 
   <p><a href="http://img.e-com-net.com/image/info8/9e2abb1fe2a14c32a502d717ac2f9bb8.jpg" target="_blank"><img alt="html基础_第3张图片" height="446" src="http://img.e-com-net.com/image/info8/9e2abb1fe2a14c32a502d717ac2f9bb8.jpg" width="650" style="border:1px solid black;"></a></p> 
  </blockquote> 
  <blockquote> 
   <h2><span style="color:#4da8ee;"><strong> 格式案例</strong></span></h2> 
  </blockquote> 
  <pre><code class="language-html"><!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <!-- 搜索的关键字 -->
    <meta name="keywords" content="打卡，刷题">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <!-- 搜索标题 -->
    <title>webtmp</title>
    <link rel="icon" href="images/flag.png">
</head>

<body>
    <p>
        换行是div的后代
        不换行是span的后代
    </p>
    <div>
        独立寒秋，湘江北去，橘子洲头。
        看万山红遍，层林尽染；漫江碧透，百舸争流。
        鹰击长空，鱼翔浅底，万类霜天竞自由。
        怅寥廓，问苍茫大地，谁主沉浮？
        携来百侣曾游，忆往昔峥嵘岁月稠。
        恰同学少年，风华正茂；书生意气，挥斥方遒。
        指点江山，激扬文字，粪土当年万户侯。
        曾记否，到中流击水，浪遏飞舟？
    </div>
    <h1>
        独立寒秋，湘江北去，橘子洲头。
        看万山红遍，层林尽染；漫江碧透，百舸争流。
        鹰击长空，鱼翔浅底，万类霜天竞自由。
        怅寥廓，问苍茫大地，谁主沉浮？
        携来百侣曾游，忆往昔峥嵘岁月稠。
        恰同学少年，风华正茂；书生意气，挥斥方遒。
        指点江山，激扬文字，粪土当年万户侯。
        曾记否，到中流击水，浪遏飞舟？
    </h1>
    <p>
        独立寒秋，湘江北去，橘子洲头。
        看万山红遍，层林尽染；漫江碧透，百舸争流。
        鹰击长空，鱼翔浅底，万类霜天竞自由。
        怅寥廓，问苍茫大地，谁主沉浮？
        携来百侣曾游，忆往昔峥嵘岁月稠。
        恰同学少年，风华正茂；书生意气，挥斥方遒。
        指点江山，激扬文字，粪土当年万户侯。
        曾记否，到中流击水，浪遏飞舟？
    </p>
    <pre>
        <i>独立寒秋，湘江北去，橘子洲头。</i>
        <b>看万山红遍，层林尽染；漫江碧透，百舸争流。</b>
        <del>鹰击长空，鱼翔浅底，万类霜天竞自由。</del>
        <strong>怅寥廓，问苍茫大地，谁主沉浮？</strong>
        <mark>携来百侣曾游，忆往昔峥嵘岁月稠。</mark>
        恰同学少年，风华正茂；书生意气，挥斥方遒。
        指点江山，激扬文字，粪土当年万户侯。
        曾记否，到中流击水，浪遏飞舟？
        >>>>>
        <<<
    </pre>
    <img width="100" height="100" src="/images/exam.png" alt="解释图片">
    <audio controls src="/audio/bgm.mp3">无法播放</audio>
    <div>
        <audio controls>
            <source src="/audio/bgm.mp3" type="audio/mpeg">
            <source src="/audio/sound.mp3" type="audio/mpeg">
        </audio>
    </div>
    <div>
        <video controls width="200" height="200" src="videos/video2.mp4"></video>
    </div>
    <video width="300" controls>
        <source src="videos/video1.mp4" type="video/mp4">
        <source src="videos/video2.mp4" type="video/mp4">
    </video>
    <div>
        <a href="https://blog.csdn.net/m0_59519985?spm=1000.2115.3001.5343">CSDN</a>
        <h1></h1>
        <a href="https://blog.csdn.net/m0_59519985?spm=1000.2115.3001.5343">
            <img width="100" src="images/flag.png" alt="flag ">
        </a>
    </div>

    <!-- action 提交信息给一个函数   -->
    <form action="https://blog.csdn.net/m0_59519985?spm=1000.2115.3001.5343">
        <!-- name是后端的参数名称 -->
        <!-- required  为必填 -->
        <label for="username">用户名</label>
        <input placeholder="用户名" type="text" name="username2" id="username">
        <br>
        <label for="sex">性别</label>
        <input required type="text" maxlength="2" minlength="1" name="sexs" id="sex">
        <br>
        <label for="email">邮箱</label>
        <input placeholder="邮箱" type="email" name="email" id="email" required>
        <br>
        <label for="password">密码</label>
        <input type="password" name="pass" id="password">
        <br>
        <!-- radio互斥，所有name相同的构成一组，只能选一个选项 -->
        <label for="cpp">C++</label>
        <input required type="radio" name="lang" value="cpp" vaid="cpp">
        <br>
        <label for="java">Java</label>
        <input type="radio" name="lang" value="java" vaid="java">
        <br>
        <label for="python">Python</label>
        <input type="radio" name="short" value="python" vaid="python">
        <br>
        <label for="file"></label>
        <input placeholder="文件" required type="file" name="file" id="file">
        <br>
        <button type="submit">提交</button>
        <br>
        <label for="resume">自我介绍</label>
        <br>
        <textarea name="resume" id="resume" cols="10" rows="10">
        

        
        
    

    
无序列表
    
        first item
        second item
        third item
    
    有序列表
    
        发疯
            
                啊啊啊
                不得鸟
                future
                学习
                    
                        1.1.1高数
                        1.1.2数据结构
                        
                            1.1.3transform
                        
                        博客
                            CSDN
                        
                        dirty work
                    
                
            
        
        Fi
        Fo
        Fum
    

    
        Name
        Godzilla
        Born
        1952
        Birthplace
        Japan
        Color
        Green
        Orange
    



 
   
  

                            
                        
                    
                    
                    
                    
                    
                    
                
                
                    
                        
                        
                             
                        
                        
                        
                            
                        
                        
                        
                            
                        
                    
                
            
        
    
    
        你可能感兴趣的:(web,web,html)
        
            
                
                    理解Gunicorn：Python WSGI服务器的基石
                        范范0825
ipythonlinux运维
                        理解Gunicorn：PythonWSGI服务器的基石介绍Gunicorn，全称GreenUnicorn，是一个为PythonWSGI（WebServerGatewayInterface）应用设计的高效、轻量级HTTP服务器。作为PythonWeb应用部署的常用工具，Gunicorn以其高性能和易用性著称。本文将介绍Gunicorn的基本概念、安装和配置，帮助初学者快速上手。1.什么是Gunico
                    
                    swagger访问路径
                        igotyback
swagger
                        Swagger2.x版本访问地址：http://{ip}:{port}/{context-path}/swagger-ui.html{ip}是你的服务器IP地址。{port}是你的应用服务端口，通常为8080。{context-path}是你的应用上下文路径，如果应用部署在根路径下，则为空。Swagger3.x版本对于Swagger3.x版本（也称为OpenAPI3）访问地址：http://{ip
                    
                    html 中如何使用 uniapp 的部分方法
                        某公司摸鱼前端
htmluni-app前端
                        示例代码：Documentconsole.log(window);效果展示：好了，现在就可以uni.使用相关的方法了
                    
                    Google earth studio 简介
                        陟彼高冈yu
旅游
                        GoogleEarthStudio是一个基于Web的动画工具，专为创作使用GoogleEarth数据的动画和视频而设计。它利用了GoogleEarth强大的三维地图和卫星影像数据库，使用户能够轻松地创建逼真的地球动画、航拍视频和动态地图可视化。网址为https://www.google.com/earth/studio/。GoogleEarthStudio是一个基于Web的动画工具，专为创作使用G
                    
                    PHP环境搭建详细教程
                        好看资源平台
前端php
                        PHP是一个流行的服务器端脚本语言，广泛用于Web开发。为了使PHP能够在本地或服务器上运行，我们需要搭建一个合适的PHP环境。本教程将结合最新资料，介绍在不同操作系统上搭建PHP开发环境的多种方法，包括Windows、macOS和Linux系统的安装步骤，以及本地和Docker环境的配置。1.PHP环境搭建概述PHP环境的搭建主要分为以下几类：集成开发环境：例如XAMPP、WAMP、MAMP，这
                    
                    四章-32-点要素的聚合
                        彩云飘过

                        本文基于腾讯课堂老胡的课《跟我学Openlayers--基础实例详解》做的学习笔记，使用的openlayers5.3.xapi。源码见1032.html，对应的官网示例https://openlayers.org/en/latest/examples/cluster.htmlhttps://openlayers.org/en/latest/examples/earthquake-clusters.
                    
                    DIV+CSS+JavaScript技术制作网页（旅游主题网页设计与制作）云南大理
                        STU学生网页设计
网页设计期末网页作业html静态网页html5期末大作业网页设计web大作业
                        ️精彩专栏推荐作者主页:【进入主页—获取更多源码】web前端期末大作业：【HTML5网页期末作业(1000套)】程序员有趣的告白方式：【HTML七夕情人节表白网页制作(110套)】文章目录二、网站介绍三、网站效果▶️1.视频演示2.图片演示四、网站代码HTML结构代码CSS样式代码五、更多源码二、网站介绍网站布局方面：计划采用目前主流的、能兼容各大主流浏览器、显示效果稳定的浮动网页布局结构。网站程
                    
                    关于城市旅游的HTML网页设计——(旅游风景云南 5页)HTML+CSS+JavaScript
                        二挡起步
web前端期末大作业javascripthtmlcss旅游风景
                        ⛵源码获取文末联系✈Web前端开发技术描述网页设计题材，DIV+CSS布局制作,HTML+CSS网页设计期末课程大作业|游景点介绍|旅游风景区|家乡介绍|等网站的设计与制作|HTML期末大学生网页设计作业，Web大学生网页HTML：结构CSS：样式在操作方面上运用了html5和css3，采用了div+css结构、表单、超链接、浮动、绝对定位、相对定位、字体样式、引用视频等基础知识JavaScrip
                    
                    HTML网页设计制作大作业（div+css） 云南我的家乡旅游景点 带文字滚动
                        二挡起步
web前端期末大作业web设计网页规划与设计htmlcssjavascriptdreamweaver前端
                        Web前端开发技术描述网页设计题材，DIV+CSS布局制作,HTML+CSS网页设计期末课程大作业游景点介绍|旅游风景区|家乡介绍|等网站的设计与制作HTML期末大学生网页设计作业HTML：结构CSS：样式在操作方面上运用了html5和css3，采用了div+css结构、表单、超链接、浮动、绝对定位、相对定位、字体样式、引用视频等基础知识JavaScript：做与用户的交互行为文章目录前端学习路线
                    
                    git - Webhook让部署自动化
                        大猪大猪

                        我们现在有一个需求，将项目打包上传到gitlab或者github后，程序能自动部署，不用手动地去服务器中进行项目更新并运行，如何做到？这里我们可以使用gitlab与github的挂钩，挂钩的原理就是，每当我们有请求到gitlab与github服务器时，这时他俩会根据我们配置的挂钩地扯进行访问，webhook挂钩程序会一直监听着某个端口请求，一但收到他们发过来的请求，这时就知道用户有请求提交了，这时
                    
                    webpack图片等资源的处理
                        dmengmeng

                        需要的loaderfile-loader（让我们可以引入这些资源文件）url-loader（其实是file-loader的二次封装）img-loader（处理图片所需要的）在没有使用任何处理图片的loader之前，比如说css中用到了背景图片，那么最后打包会报错的，因为他没办法处理图片。其实你只想能够使用图片的话。只加一个file-loader就可以，打开网页能准确看到图片。{test:/\.(p
                    
                    「豆包Marscode体验官」 | 云端 IDE 启动 & Rust 体验
                        张风捷特烈
iderust开发语言后端
                        theme:cyanosis我正在参加「豆包MarsCode初体验」征文活动MarsCode可以看作一个运行在服务端的远程VSCode开发环境。对于我这种想要学习体验某些语言，但不想在电脑里装环境的人来说非常友好。本文就来介绍一下在MarsCode里，我的体验rust开发体验。一、MarsCode是什么它的本质是:提供代码助手和云端IDE服务的web网站，可通过下面的链接访问https://www
                    
                    Python神器！WEB自动化测试集成工具 DrissionPage
                        亚丁号
python开发语言
                        一、前言用requests做数据采集面对要登录的网站时，要分析数据包、JS源码，构造复杂的请求，往往还要应付验证码、JS混淆、签名参数等反爬手段，门槛较高。若数据是由JS计算生成的，还须重现计算过程，体验不好，开发效率不高。使用浏览器，可以很大程度上绕过这些坑，但浏览器运行效率不高。因此，这个库设计初衷，是将它们合而为一，能够在不同须要时切换相应模式，并提供一种人性化的使用方法，提高开发和运行效率
                    
                    Java爬虫框架（一）--架构设计
                        狼图腾-狼之传说
java框架java任务html解析器存储电子商务
                        一、架构图那里搜网络爬虫框架主要针对电子商务网站进行数据爬取，分析，存储，索引。爬虫：爬虫负责爬取，解析，处理电子商务网站的网页的内容数据库：存储商品信息索引：商品的全文搜索索引Task队列：需要爬取的网页列表Visited表：已经爬取过的网页列表爬虫监控平台：web平台可以启动，停止爬虫，管理爬虫，task队列，visited表。二、爬虫1.流程1)Scheduler启动爬虫器，TaskMast
                    
                    Java：爬虫框架
                        dingcho
Javajava爬虫
                        一、ApacheNutch2【参考地址】Nutch是一个开源Java实现的搜索引擎。它提供了我们运行自己的搜索引擎所需的全部工具。包括全文搜索和Web爬虫。Nutch致力于让每个人能很容易,同时花费很少就可以配置世界一流的Web搜索引擎.为了完成这一宏伟的目标,Nutch必须能够做到:每个月取几十亿网页为这些网页维护一个索引对索引文件进行每秒上千次的搜索提供高质量的搜索结果简单来说Nutch支持分
                    
                    MongoDB知识概括
                        GeorgeLin98
持久层mongodb
                        MongoDB知识概括MongoDB相关概念单机部署基本常用命令索引-IndexSpirngDataMongoDB集成副本集分片集群安全认证MongoDB相关概念业务应用场景：传统的关系型数据库（如MySQL），在数据操作的“三高”需求以及应对Web2.0的网站需求面前，显得力不从心。解释：“三高”需求：①Highperformance-对数据库高并发读写的需求。②HugeStorage-对海量数
                    
                    Python实现下载当前年份的谷歌影像
                        sand&wich
python开发语言
                        在GIS项目和地图应用中，获取最新的地理影像数据是非常重要的。本文将介绍如何使用Python代码从Google地图自动下载当前年份的影像数据，并将其保存为高分辨率的TIFF格式文件。这个过程涉及地理坐标转换、多线程下载和图像处理。关键功能该脚本的核心功能包括：坐标转换：支持WGS-84与WebMercator投影之间转换，以及处理中国GCJ-02偏移。自动化下载：多线程下载地图瓦片，提高效率。图像
                    
                    Spring MVC 全面指南：从入门到精通的详细解析
                        一杯梅子酱
技术栈学习springmvcjava
                        引言：SpringMVC，作为Spring框架的一个重要模块，为构建Web应用提供了强大的功能和灵活性。无论是初学者还是有一定经验的开发者，掌握SpringMVC都将显著提升你的Web开发技能。本文旨在为初学者提供一个全面且易于理解的学习路径，通过详细的知识点分析和实际案例，帮助你快速上手SpringMVC，让学习过程既深刻又高效。一、SpringMVC简介1.1什么是SpringMVC？Spri
                    
                    Spring Boot中实现跨域请求
                        BABA8891
springboot后端java
                        在SpringBoot中实现跨域请求（CORS，Cross-OriginResourceSharing）可以通过多种方式，以下是几种常见的方法：1.使用@CrossOrigin注解在SpringBoot中，你可以在控制器或者具体的请求处理方法上使用@CrossOrigin注解来允许跨域请求。在控制器上应用：importorg.springframework.web.bind.annotation.
                    
                    WebMagic：强大的Java爬虫框架解析与实战
                        Aaron_945
Javajava爬虫开发语言
                        文章目录引言官网链接WebMagic原理概述基础使用1.添加依赖2.编写PageProcessor高级使用1.自定义Pipeline2.分布式抓取优点结论引言在大数据时代，网络爬虫作为数据收集的重要工具，扮演着不可或缺的角色。Java作为一门广泛使用的编程语言，在爬虫开发领域也有其独特的优势。WebMagic是一个开源的Java爬虫框架，它提供了简单灵活的API，支持多线程、分布式抓取，以及丰富的
                    
                    00. 这里整理了最全的爬虫框架（Java + Python）
                        有一只柴犬
爬虫系列爬虫javapython
                        目录1、前言2、什么是网络爬虫3、常见的爬虫框架3.1、java框架3.1.1、WebMagic3.1.2、Jsoup3.1.3、HttpClient3.1.4、Crawler4j3.1.5、HtmlUnit3.1.6、Selenium3.2、Python框架3.2.1、Scrapy3.2.2、BeautifulSoup+Requests3.2.3、Selenium3.2.4、PyQuery3.2
                    
                    详解：如何设计出健壮的秒杀系统？
                        夜空_2cd3

                        作者：Yrion博客园：cnblogs.com/wyq178/p/11261711.html前言：秒杀系统相信很多人见过，比如京东或者淘宝的秒杀，小米手机的秒杀。那么秒杀系统的后台是如何实现的呢？我们如何设计一个秒杀系统呢？对于秒杀系统应该考虑哪些问题？如何设计出健壮的秒杀系统？本期我们就来探讨一下这个问题：image目录一：****秒杀系统应该考虑的问题二：****秒杀系统的设计和技术方案三：*
                    
                    最简单将静态网页挂载到服务器上(不用nginx)
                        全能全知者
服务器nginx运维前端html笔记
                        最简单将静态网页挂载到服务器上(不用nginx)如果随便弄个静态网页挂在服务器都要用nignx就太麻烦了，所以直接使用Apache来搭建一些简单前端静态网页会相对方便很多检查Web服务器服务状态：sudosystemctlstatushttpd#ApacheWeb服务器如果发现没有安装web服务器：安装Apache：sudoyuminstallhttpd启动Apache：sudosystemctl
                    
                    斟一小组鸡血视频
                        和自己一起成长

                        http://m.v.qq.com/play/play.html?coverid=&vid=c0518henl2a&ptag=2_6.0.0.14297_copy有一种努力叫做靠自己http://m.v.qq.com/play/play.html?coverid=&vid=i0547o426g4&ptag=2_6.0.0.14297_copy世界最励志短片https://v.qq.com/x/pa
                    
                    uniapp使用内置地图选择插件，实现地址选择并在地图上标点
                        神夜大侠
Uniappvue.jsuniapp
                        uniapp使用内置地图选择插件，实现地址选择并在地图上标点代码如下：page{background:#F4F5F6;}::-webkit-scrollbar{width:0;height:0;color:transparent;}page{height:100%;width:100%;font-size:24rpx;}image,view,input,textarea,label,text,na
                    
                    【Golang】实现 Excel 文件下载功能
                        RumIV
Golanggolangexcel开发语言
                        在当今的网络应用开发中，提供数据导出功能是一项常见的需求。Excel作为一种广泛使用的电子表格格式，通常是数据导出的首选格式之一。在本教程中，我们将学习如何使用Go语言和GinWeb框架来创建一个Excel文件，并允许用户通过HTTP请求下载该文件。准备工作在开始之前，请确保您的开发环境中已经安装了Go语言和相关的开发工具。此外，您还需要安装GinWeb框架和excelize包，这两个包都将用于我
                    
                    Dockerfile命令详解之 FROM
                        清风怎不知意
容器化java前端javascript
                        许多同学不知道Dockerfile应该如何写，不清楚Dockerfile中的指令分别有什么意义，能达到什么样的目的，接下来我将在容器化专栏中详细的为大家解释每一个指令的含义以及用法。专栏订阅传送门https://blog.csdn.net/qq_38220908/category_11989778.html指令不区分大小写。但是，按照惯例，它们应该是大写的，以便更容易地将它们与参数区分开来。(引用
                    
                    VUE3 + xterm + nestjs实现web远程终端 或 连接开启SSH登录的路由器和交换机。
                        焚木灵
node.jsvue
                        可远程连接系统终端或开启SSH登录的路由器和交换机。相关资料：xtermjs/xterm.js:Aterminalfortheweb(github.com)后端实现(NestJS)：1、安装依赖：npminstallnode-ssh@nestjs/websockets@nestjs/platform-socket.io2、我们将创建一个名为RemoteControlModule的NestJS模块，
                    
                    metaRTC8.0，一个全新架构的webRTC SDK库
                        metaRTC
webrtc音视频
                        概述metaRTC8.0是metaRTC开源以来架构变化最大的一个版本，是metaIPC3.0等高性能的基础。metaRTC8.0是一个全新架构版本，并非在metaRTC7.0版本上简单升级，在QOS/语音对讲/内存占用/视频文件录制读取等方面新增多个模块，在弱网对抗/语音对讲/内存优化等效果上有显著提升。metaRTC8.0在一年多的开发中进行了近200次迭代，metaRTC8.0社区版计划在2
                    
                    metaRTC/webRTC QOS 方案与实践
                        metaRTC
metaRTC解决方案webrtcqos
                        概述质量服务(QOS/QualityofService)是指利用各种技术方案提高网络通信质量的技术，网络通信质量需要解决下面两个问题：网络问题：UDP/不稳定网络/弱网下的丢包/延时/乱序/抖动数据量问题：发送数据量超带宽负载和平滑发送拥塞控制是各种技术方案的数据基础，丢包恢复解决丢包问题，抗乱序抖动解决网络乱序抖动问题，流量控制解决平滑发送数据/数据超带宽负载/延时问题。拥塞控制(Congest
                    
                                Nginx负载均衡
                                    510888780
nginx应用服务器
                                    Nginx负载均衡一些基础知识: 
 
nginx 的 upstream目前支持 4 种方式的分配 
1)、轮询（默认） 
      每个请求按时间顺序逐一分配到不同的后端服务器，如果后端服务器down掉，能自动剔除。 
2)、weight 
      指定轮询几率，weight和访问比率成正比
                                
                                RedHat 6.4 安装 rabbitmq
                                    bylijinnan
erlangrabbitmqredhat
                                    在 linux 下安装软件就是折腾，首先是测试机不能上外网要找运维开通，开通后发现测试机的 yum 不能使用于是又要配置 yum 源，最后安装 rabbitmq 时也尝试了两种方法最后才安装成功 
 
机器版本： 
 
[root@redhat1 rabbitmq]# lsb_release
LSB Version:    :base-4.0-amd64:base-4.0-noarch:core
                                
                                FilenameUtils工具类
                                    eksliang
FilenameUtilscommon-io
                                    转载请出自出处：http://eksliang.iteye.com/blog/2217081 一、概述 
这是一个Java操作文件的常用库，是Apache对java的IO包的封装，这里面有两个非常核心的类FilenameUtils跟FileUtils，其中FilenameUtils是对文件名操作的封装;FileUtils是文件封装，开发中对文件的操作，几乎都可以在这个框架里面找到。 非常的好用。 
                                
                                xml文件解析SAX
                                    不懂事的小屁孩
xml
                                    xml文件解析:xml文件解析有四种方式， 
1.DOM生成和解析XML文档(SAX是基于事件流的解析) 
2.SAX生成和解析XML文档(基于XML文档树结构的解析) 
3.DOM4J生成和解析XML文档 
4.JDOM生成和解析XML  
本文章用第一种方法进行解析，使用android常用的DefaultHandler 
 
 
import org.xml.sax.Attributes;

                                
                                通过定时任务执行mysql的定期删除和新建分区，此处是按日分区
                                    酷的飞上天空
mysql
                                    使用python脚本作为命令脚本，linux的定时任务来每天定时执行 
  
#!/usr/bin/python
# -*- coding: utf8 -*-
import pymysql
import datetime
import calendar

#要分区的表
table_name = 'my_table'
#连接数据库的信息
host,user,passwd,db = 
                                
                                如何搭建数据湖架构？听听专家的意见
                                    蓝儿唯美
架构
                                    Edo Interactive在几年前遇到一个大问题：公司使用交易数据来帮助零售商和餐馆进行个性化促销，但其数据仓库没有足够时间去处理所有的信用卡和借记卡交易数据 
 “我们要花费27小时来处理每日的数据量，”Edo主管基础设施和信息系统的高级副总裁Tim Garnto说道：“所以在2013年，我们放弃了现有的基于PostgreSQL的关系型数据库系统，使用了Hadoop集群作为公司的数
                                
                                spring学习——控制反转与依赖注入
                                    a-john
spring
                                           控制反转（Inversion of Control，英文缩写为IoC）是一个重要的面向对象编程的法则来削减计算机程序的耦合问题，也是轻量级的Spring框架的核心。 控制反转一般分为两种类型，依赖注入（Dependency Injection，简称DI）和依赖查找（Dependency Lookup）。依赖注入应用比较广泛。 
  

                                
                                用spool+unixshell生成文本文件的方法
                                    aijuans
xshell
                                    例如我们把scott.dept表生成文本文件的语句写成dept.sql,内容如下:  
　　set pages 50000; 
　　set lines 200; 
　　set trims on; 
　　set heading off; 
　　spool /oracle_backup/log/test/dept.lst; 
　　select deptno||','||dname||','||loc 
                                
                                1、基础--名词解析(OOA/OOD/OOP)
                                    asia007
学习基础知识
                                    OOA:Object-Oriented Analysis（面向对象分析方法） 
是在一个系统的开发过程中进行了系统业务调查以后，按照面向对象的思想来分析问题。OOA与结构化分析有较大的区别。OOA所强调的是在系统调查资料的基础上，针对OO方法所需要的素材进行的归类分析和整理，而不是对管理业务现状和方法的分析。 
　　OOA（面向对象的分析）模型由5个层次（主题层、对象类层、结构层、属性层和服务层）
                                
                                浅谈java转成json编码格式技术
                                    百合不是茶
json编码java转成json编码
                                    json编码;是一个轻量级的数据存储和传输的语言 
   
   在java中需要引入json相关的包,引包方式在工程的lib下就可以了 
  
JSON与JAVA数据的转换（JSON 即 JavaScript Object Natation，它是一种轻量级的数据交换格式，非 
  
常适合于服务器与 JavaScript 之间的数据的交
                                
                                web.xml之Spring配置(基于Spring+Struts+Ibatis)
                                    bijian1013
javaweb.xmlSSIspring配置
                                    指定Spring配置文件位置 
<context-param>
		<param-name>contextConfigLocation</param-name>
		<param-value>
			/WEB-INF/spring-dao-bean.xml,/WEB-INF/spring-resources.xml,
			/WEB-INF/
                                
                                Installing SonarQube（Fail to download libraries from server）
                                    sunjing
InstallSonar
                                    1.  Download and unzip the SonarQube distribution  
2.  Starting the Web Server 
The default port is "9000" and the context path is "/". These values can be changed in &l
                                
                                【MongoDB学习笔记十一】Mongo副本集基本的增删查
                                    bit1129
mongodb
                                    一、创建复本集 
  
假设mongod,mongo已经配置在系统路径变量上，启动三个命令行窗口，分别执行如下命令： 
  
mongod --port 27017 --dbpath  data1 --replSet rs0

mongod --port 27018 --dbpath  data2 --replSet rs0

mongod --port 27019 -
                                
                                Anychart图表系列二之执行Flash和HTML5渲染
                                    白糖_
Flash
                                    今天介绍Anychart的Flash和HTML5渲染功能 
  
 
 HTML5 
 
Anychart从6.0第一个版本起，已经逐渐开始支持各种图的HTML5渲染效果了，也就是说即使你没有安装Flash插件，只要浏览器支持HTML5，也能看到Anychart的图形（不过这些是需要做一些配置的）。 
这里要提醒下大家，Anychart6.0版本对HTML5的支持还不算很成熟，目前还处于
                                
                                Laravel版本更新异常4.2.8-> 4.2.9 Declaration of ... CompilerEngine ... should be compa
                                    bozch
laravel
                                    昨天在为了把laravel升级到最新的版本，突然之间就出现了如下错误： 
ErrorException thrown with message "Declaration of Illuminate\View\Engines\CompilerEngine::handleViewException() should be compatible with Illuminate\View\Eng
                                
                                编程之美-NIM游戏分析-石头总数为奇数时如何保证先动手者必胜
                                    bylijinnan
编程之美
                                    


import java.util.Arrays;
import java.util.Random;

public class Nim {

	/**编程之美 NIM游戏分析
问题：
有N块石头和两个玩家A和B，玩家A先将石头随机分成若干堆，然后按照BABA...的顺序不断轮流取石头，
能将剩下的石头一次取光的玩家获胜，每次取石头时，每个玩家只能从若干堆石头中任选一堆，
                                
                                lunce创建索引及简单查询
                                    chengxuyuancsdn
查询创建索引lunce
                                    import java.io.File;
import java.io.IOException;

import org.apache.lucene.analysis.Analyzer;
import org.apache.lucene.analysis.standard.StandardAnalyzer;
import org.apache.lucene.document.Docume
                                
                                [IT与投资]坚持独立自主的研究核心技术
                                    comsci
it
                                     
 
       和别人合作开发某项产品....如果互相之间的技术水平不同,那么这种合作很难进行,一般都会成为强者控制弱者的方法和手段..... 
 
 
       所以弱者,在遇到技术难题的时候,最好不要一开始就去寻求强者的帮助,因为在我们这颗星球上,生物都有一种控制其
                                
                                flashback transaction闪回事务查询
                                    daizj
oraclesql闪回事务
                                       
闪回事务查询有别于闪回查询的特点有以下3个： 
 
（1）其正常工作不但需要利用撤销数据，还需要事先启用最小补充日志。 
 
（2）返回的结果不是以前的“旧”数据，而是能够将当前数据修改为以前的样子的撤销SQL（Undo SQL）语句。 
 
（3）集中地在名为flashback_transaction_query表上查询，而不是在各个表上通过“as of”或“vers
                                
                                Java I/O之FilenameFilter类列举出指定路径下某个扩展名的文件
                                    游其是你
FilenameFilter
                                    这是一个FilenameFilter类用法的例子，实现的列举出“c:\\folder“路径下所有以“.jpg”扩展名的文件。        1   2   3   4   5   6   7   8   9   10   11   12   13   14   15   16   17   18   19   20   21   22   23   24   25   26   27   28  
                                
                                C语言学习五函数，函数的前置声明以及如何在软件开发中合理的设计函数来解决实际问题
                                    dcj3sjt126com
c
                                    # include <stdio.h>

int f(void)		//括号中的void表示该函数不能接受数据，int表示返回的类型为int类型
{
	return 10;	//向主调函数返回10
}

void g(void)	//函数名前面的void表示该函数没有返回值
{
	//return 10;	//error 与第8行行首的void相矛盾
}

in
                                
                                今天在测试环境使用yum安装，遇到一个问题： Error: Cannot retrieve metalink for repository: epel. Pl
                                    dcj3sjt126com
centos
                                    今天在测试环境使用yum安装，遇到一个问题： 
Error: Cannot retrieve metalink for repository: epel. Please verify its path and try again 
  
处理很简单，修改文件“/etc/yum.repos.d/epel.repo”， 将baseurl的注释取消， mirrorlist注释掉。即可。 
&n
                                
                                单例模式
                                    shuizhaosi888
单例模式
                                    单例模式        懒汉式 
public class RunMain {

	/**
	 * 私有构造
	 */
	private RunMain() {
	}
	
    /**
     * 内部类，用于占位，只有
     */
	private static class SingletonRunMain {
		priv
                                
                                Spring Security（09）——Filter
                                    234390216
Spring Security
                                    Filter 
目录 
1.1     Filter顺序 
1.2     添加Filter到FilterChain 
1.3     DelegatingFilterProxy 
1.4     FilterChainProxy 
1.5
                                
                                公司项目NODEJS实践0.1
                                    逐行分析JS源代码
mongodbnginxubuntunodejs
                                      
一、前言 
        前端如何独立用nodeJs实现一个简单的注册、登录功能，是不是只用nodejs+sql就可以了？其实是可以实现，但离实际应用还有距离，那要怎么做才是实际可用的。 
        网上有很多nod
                                
                                java.lang.Math
                                    liuhaibo_ljf
javaMathlang
                                    System.out.println(Math.PI); 
System.out.println(Math.abs(1.2)); 
System.out.println(Math.abs(1.2)); 
System.out.println(Math.abs(1)); 
System.out.println(Math.abs(111111111)); 
System.out.println(Mat
                                
                                linux下时间同步
                                    nonobaba
ntp
                                    今天在linux下做hbase集群的时候，发现hmaster启动成功了，但是用hbase命令进入shell的时候报了一个错误  PleaseHoldException: Master is initializing，查看了日志，大致意思是说master和slave时间不同步，没办法，只好找一种手动同步一下，后来发现一共部署了10来台机器，手动同步偏差又比较大，所以还是从网上找现成的解决方
                                
                                ZooKeeper3.4.6的集群部署
                                    roadrunners
zookeeper集群部署
                                    ZooKeeper是Apache的一个开源项目，在分布式服务中应用比较广泛。它主要用来解决分布式应用中经常遇到的一些数据管理问题，如：统一命名服务、状态同步、集群管理、配置文件管理、同步锁、队列等。这里主要讲集群中ZooKeeper的部署。 
  
1、准备工作 
我们准备3台机器做ZooKeeper集群，分别在3台机器上创建ZooKeeper需要的目录。 
  
数据存储目录
                                
                                Java高效读取大文件
                                    tomcat_oracle
java
                                    　　读取文件行的标准方式是在内存中读取，Guava 和Apache Commons IO都提供了如下所示快速读取文件行的方法：   　　Files.readLines(new File(path), Charsets.UTF_8);   　　FileUtils.readLines(new File(path));   　　这种方法带来的问题是文件的所有行都被存放在内存中，当文件足够大时很快就会导致
                                
                                微信支付api返回的xml转换为Map的方法
                                    xu3508620
xmlmap微信api
                                    举例如下： 
<xml> 
   <return_code><![CDATA[SUCCESS]]></return_code> 
   <return_msg><![CDATA[OK]]></return_msg> 
   <appid><
                                
                
            
        
    


    
        
            按字母分类：
            ABCDEFGHIJKLMNOPQRSTUVWXYZ其他
        
    


    
        
            首页 -
            关于我们 -
            站内搜索 -
            Sitemap -
            侵权投诉
        
        版权所有 IT知识库 CopyRight © 2000-2050 E-COM-NET.COM , All Rights Reserved.