@德玛玩前端

html 基础学习笔记

Date:20231212

html标签基础学习笔记

一、web和internet

1.1、Internet简介

Internet 是一个全球性的计算机互联网络，中文名称有"因特网"、“国际互联网”、“网际网”、"交互网络"等
Internet提供的主要服务
- Telnet、Email、www、BBS、FTP等
基本实现技术
- 分组交换原理：信息在Internet上被分成许多小数据包(分组)进行传输，到达目的地后将数据包重组为信息
- TCP/IP协议簇
Web与Internet的关系
- Web是运行在Internet之上最流行的应用之一，Internet为Web提供了网络环境
- Web的出现，极大的推动了Internet的普及与推广

1.2、Web简介

又称为万维网或环球网，即 WWW (World Wide Web)
把各种类型的信息和服务无缝连接，提供生动的图形用户界面（可以称之为文档）
万维网其实就是无数文档的集合，这些文档驻留在因特网的某些地方

1.3、web的工作原理

Web 是基于Internet 的一个多媒体信息服务系统
- 基于浏览器/服务器模式
- 由Web服务器、浏览器(Browser)和通信协议三部分组成
- 通信协议采用的是HTTP协议：超文本传输协议(Hypertext Transfer Protocol)
在Web服务器上，主要以网页的形式来发布多媒体信息、
- 网页采用超文本标记语言HTML(Hyper Text Markup Language)编写
浏览器软件连接到Web服务器并获取网页
- 浏览器解释HTML网页文档，并显示在用户的屏幕上

1.4、Web服务器

主要功能
- 存储Web上的内容信息（如:Web页文件），提供管理环境
- 响应浏览器的请求，执行服务端程序
- 安全功能等
主要web服务器产品
- TOMCAT
- IIS
- APACHE

1.5、服务端技术

运行于服务端
大多提供了数据库访问的能力
- PHP
- JSP
- ASP
- Node

1.6、客户端技术

运行于客户端，由浏览器来解释运行
- HTML
- CSS
- JavaScript

二、HTML

2.1、超文本

Web是一个超文本文件的集合
超文本文件时web的基本组成单元，也称为网页或HTML文档，web页等，通常以.html或htm为后缀的文件
Web页之间通过超文本中的超级链接组织在一起

2.2、什么是HTML

HTML(HyperText Markup Lanuage)：超文本标记语言，一种纯文本类型的语言
- 使用带有尖括号的"标记"将网页中的内容逐一标识出来
用来设计网页的标记语言
用该语言编写的文件，以.html或htm为后缀
由浏览器解释执行
HTML页面上，可以嵌套用脚本语言编写的程序段，如VBScript、JavaScript

2.3、标记语法

HTML 用于描述功能的符号称为"标记"，比如p、h1等
- 标记在使用时必须使用尖括号括起来
- 有封闭类型标记，又有非封闭类型的标记
封闭类型标记，也叫双标记，必须成对出现
- <标记>内容
非封闭类型标记，也叫空标记，或者单标记
- <标记/>
- 或者
- <标记>
- 不能包含内容

2.4、元素

元素，即标记
每一对尖括号包围的部分
- 如包围的元素就叫做body元素
- 元素就像是小标签，用于标识网页文档的不同部分

2.5、元素嵌套

元素之间可以相互嵌套，形成更为复杂的语法
在嵌套元素时需要注意标记的嵌套顺序
案例
```
<body>
  <p>段落1p>
body>
```

2.6、属性和值

属性用来修饰元素
- 属性的声明必须位于开始标记里
- 一个元素的属性可能不止一个，多个属性之间用空格隔开
- 多个属性之间不区分先后顺序
每个属性都有值
- 属性和属性的值之间用等号连接
- 属性的值包含在引号中，或单引号、不写引号都可以

<p align="center">段落一p>

标准属性
- 每个元素都有自己所特有的属性
- 有些属性是绝大多数元素都支持的属性，称为标准属性(或通用属性)
  - id
  - title
  - class
  - style

2.7、注释

为代码添加适当的注释是一种良好的编码习惯
注释只在编辑文档情况下可见，在浏览器展示页面时并不会显示
添加注释的语法：
- 之间的任何内容都不会显示在浏览器中
- 注释不可以嵌套在其他注释中
- 注释不可以位于嵌在<>中

2.8、文档结构


DOCTYPE html>
<html>
	<head>
	    
	    <title>title>
		
		<meta charset="utf-8">
		
		<meta name="" content="">
		
		<script>script>
		
		<style>style>
		
		<link/>
	head>
	
	<body>
	body>
html>

三、元素标签

3.1、头部标签/元素

元素用于为页面定义全局信息
- 所有其他头元素的容器
- 紧跟在起始标签之后
- 可包含 </code>、<code><meta></code>、<code><script></code>、<code><style></code>、<code><link></code></li> </ul> </li> <li> <p><code><title></code> 用于为文档定义标题</p> <ul> <li>标题元素的内容出现在浏览器顶部</li> <li>没有属性</li> <li>必须出现在<code><head></code>元素中</li> <li>一个文档只能有一个标题元素</li> </ul> </li> <li> <p><code><meta></code> 用于定义网页的基本信息</p> <ul> <li>元数据元素</li> <li>为空标题</li> <li>常用属性有：content http-equiv</li> </ul> </li> </ul> <h3>3.2、<code><body></code> 主体内容</h3> <ul> <li> <p><code><body></code>元素出现在<code><head></code>元素之后，包含网页要显示给读者的内容，称为主题内容</p> </li> <li> <p>可以包含除了html、head外的所有元素</p> </li> <li> <p>body的专有属性: bgcolor text</p> </li> <li> <p>案例</p> <pre><code class="prism language-html"> <span class="token comment"></span> <span class="token comment"></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>body</span> <span class="token attr-name">bgcolor</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>#000000<span class="token punctuation">"</span></span> <span class="token attr-name">text</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>yellow<span class="token punctuation">"</span></span><span class="token punctuation">></span></span> 我的第一个网页 <span class="token tag"><span class="token tag"><span class="token punctuation"></</span>body</span><span class="token punctuation">></span></span> </code></pre> </li> </ul> <h3>3.3、文本标记</h3> <ul> <li>文本是网页上的重要组成部分</li> <li>直接书写的文本会用浏览器默认的样本显示</li> <li>包含在标记中的文本则会被显示为标记所拥有的样式 <ul> <li>标题元素</li> <li>段落元素</li> <li>换行元素</li> <li>分区元素</li> <li>特殊字符</li> <li>注释</li> </ul> </li> </ul> <h4>3.3.1、标题元素 <code><hn></code></h4> <ul> <li>标题元素让文字以醒目的方式显示,往往用于文章的标题</li> <li>基本语法<code><h#>..</h#></code> <ul> <li>#=1,2,3,4,5,6</li> <li>从h1到h6,即标题1-标题6</li> </ul> </li> </ul> <h4>3.3.2、段落元素 <code><p></code></h4> <ul> <li>p元素提供了结构化文本的一种方式</li> <li>p元素的文本会用单独的段落显示 <ul> <li>与前后的文本都换行分开</li> <li>添加一段额外的垂直空白距离,作为段落间距</li> <li>常用属性:align</li> </ul> </li> </ul> <h4>3.3.3、换行元素 <code><br></code></h4> <ul> <li>使用br元素在任何地方创建手动换行 <ul> <li>空标记</li> </ul> </li> </ul> <h4>3.3.4、分割线元素 <code><hr></code></h4> <ul> <li> <p>hr元素用于在页面上创建一条水平线</p> <ul> <li>空标记</li> <li>常用于将页面的不同部分隔开</li> <li>hr后面的文本将出现在新段落中</li> </ul> </li> <li> <p>常用属性</p> <ul> <li>size</li> <li>width</li> <li>align</li> <li>color</li> </ul> </li> <li> <p>案例</p> <pre><code class="prism language-html"><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>hr</span> <span class="token attr-name">color</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>red<span class="token punctuation">"</span></span> <span class="token attr-name">width</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>50%<span class="token punctuation">"</span></span> <span class="token attr-name">size</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>10px<span class="token punctuation">"</span></span> <span class="token attr-name">align</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>right<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>hr</span><span class="token punctuation">></span></span> </code></pre> </li> </ul> <h4>3.3.5、预格式化元素 <code><pre></code></h4> <ul> <li>保留源文档中的格式,即保留原来的换行和文本中的空白</li> <li>把源码中的格式保留到页面当中</li> </ul> <h4>3.3.6、特殊字符</h4> <ul> <li>空格折叠 <ul> <li>多个空格或制表符压缩成单个空格,即只显示一个空格</li> </ul> </li> <li>特殊字符(如空格),需要进行转义(使用字符实体) <ul> <li><code> </code> 代表一个空格</li> <li><code>©</code> 版权©</li> <li><code>®</code> 注册商标 ®</li> <li><code>&It;</code> 小于＜</li> <li><code>></code> 大于 ></li> <li><code>¥</code> ￥</li> <li><code>×</code> ×</li> </ul> </li> </ul> <h4>3.3.7、文本样式标签</h4> <ul> <li>文本样式的作用是对文本进行修饰,如加粗,倾斜等 <ul> <li>加粗: <code><b>..</b></code>,<code><strong>..</strong></code></li> <li>倾斜: <code><i>..</i></code>,<code><em>..</em></code></li> <li>下划线: <code><u>..</u></code></li> <li>删除线: <code><s>..</s></code>,<code><del>..</del></code></li> <li>上标: <code><sup>..</sup></code></li> <li>下标: <code><sub>..</sub></code></li> </ul> </li> </ul> <h3>3.4、分区元素 <div> 和 </div></h3> <ul> <li> <p>分区元素用于为元素分组,常用于页面布局</p> </li> <li> <p>块分区元素: <code><div></div></code></p> </li> <li> <p>行内分区元素: <code><span></span></code></p> <ul> <li>设置同一行文字内的不同格式</li> </ul> </li> <li> <p>案例</p> <pre><code class="prism language-html"><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>span</span> <span class="token special-attr"><span class="token attr-name">style</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span><span class="token value css language-css"><span class="token property">color</span><span class="token punctuation">:</span>red</span><span class="token punctuation">"</span></span></span><span class="token punctuation">></span></span>hello!<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>span</span><span class="token punctuation">></span></span>world </code></pre> </li> </ul> <h3>3.5、行内元素与块级元素（重要）</h3> <ul> <li>块级元素 <ul> <li>默认情况下,块级元素会独占一行,即元素前后都会自动换行</li> <li>如 <code>p</code>,<code>div</code>,<code>hn</code></li> </ul> </li> <li>行内元素 <ul> <li>不会换行,可以和其他行内元素位于同一行</li> <li>如 <code>span</code>,<code>b</code>,<code>i</code>,<code>u</code></li> </ul> </li> </ul> <h3>3.6、web目录结构</h3> <ul> <li>目录就是web站点中文件夹的名称 <ul> <li>包含多个目录</li> <li>每个目录包含站点的不同部分</li> </ul> </li> <li>web站点的主目录,称为web站点的根目录 <ul> <li>位于根目录下的其他文件夹,称为子目录</li> <li>每个子目录下都会包含具体功能的下一级子目录</li> </ul> </li> </ul> <h3>3.7、URL 统一资源定位器</h3> <ul> <li>URL(Uniform Resource Locator): 统一资源定位器,用来标识网络中的任何资源 <ul> <li>文本,图片,音视频文件,段落,或其他超文本</li> </ul> </li> <li>即路径,指从当前位置到目标位置所经过的路线</li> <li>路径在Web页面主要有三种形式 <ul> <li>绝对路径 <ul> <li>指的是文件从最高级目录下开始的完整的路径,无论当前路径是什么,使用绝对路径总是能找到要链接的文件</li> <li>即完整的URL组成 <ul> <li>协议,主机名,目录路径,文件名</li> </ul> </li> </ul> </li> <li>相对路径 <ul> <li>指文件的位置是当对于当前文件的位置,它包括目录名,或指向一个可以从当前目录触发找到该文件的路径</li> </ul> </li> <li>根相对路径 <ul> <li><code>src="d:/0.9.png"</code> 项目中禁止用根目录方式获取图片资源,因为d盘是服务器的d盘,浏览器访问不到d盘</li> </ul> </li> </ul> </li> </ul> <h3>3.8、<code><img></code> 图片标签</h3> <ul> <li><code><img></code>或者<code><img/></code></li> <li>专有属性： <ul> <li>src=url 图片资源</li> <li>alt 当图片加载失败时，显示的文本</li> </ul> </li> </ul> <h3>3.9、<code><a></code> 超链接标签</h3> <ul> <li> <p>属性</p> <ul> <li> <p>href 没有href就是一个文本</p> </li> <li> <p>target指定打开连接的方式</p> <pre><code>取值：默认缺省_self 在本页面打开 _blank 在新页面打开 </code></pre> </li> </ul> </li> <li> <p>作用</p> <ul> <li> <p>跳转网页或网站 <code><a href="http://www.baidu.com">baidu</a></code></p> </li> <li> <p>跳转锚点</p> <ul> <li>锚点,就是页面上的一个记号，点击a标签之后会跳转到记号的位置</li> <li>在某位置下记号<pre><code>h4方式 <a name=“锚点名称”></a> h5 方式任意标签<any id=“锚点名称”></any> </code></pre> </li> <li>跳转到本页锚点 <code><a href="#锚点名称">火影忍者</a></code></li> <li>跳转到其他页面的锚点 <code><a href="**.htm#锚点名称">火影忍者</a></code></li> </ul> </li> <li> <p>下载 <code><a href="" download="01.png">下载</a></code></p> </li> <li> <p>返回顶部 <code><a href=”#”>返回顶部</a></code></p> </li> <li> <p>调用js脚本</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>javascript:alert('hello world')<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>script</span><span class="token punctuation">></span></span><span class="token script"><span class="token language-javascript"> <span class="token keyword">function</span> <span class="token function">fn</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">{</span> <span class="token function">alert</span><span class="token punctuation">(</span><span class="token string">'hello world'</span><span class="token punctuation">)</span> <span class="token punctuation">}</span> </span></span><span class="token tag"><span class="token tag"><span class="token punctuation"></</span>script</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>javascript:fn()<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>调用js脚本<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>a</span><span class="token punctuation">></span></span> </code></pre> </li> </ul> </li> </ul> <h3>3.10、<code><table></code>表格标签</h3> <h4>3.10.1、表格的语法</h4> <ul> <li>快捷键: <code>table>tr*4>td*4</code></li> <li>表格中列,如果变宽,影响的是所有行这一列的宽度;如果变高,影响的是,当前行所有列的高度</li> </ul> <h4>3.10.2、table的属性</h4> <ul> <li>width=“400px” 宽度</li> <li>height=“400px” 高度</li> <li>border=“2px” 边框</li> <li>bordercolor=“red” 边框颜色</li> <li>bgcolor=“orange” 背景颜色</li> <li>align=“center” 水平对齐方式</li> <li>cellpadding=“50px” 单元格内边距(边框到内容之间的距离)</li> <li>cellspacing=“50px” 单元格的外边距</li> </ul> <h4>3.10.3、tr属性</h4> <ul> <li>align=“right” 这一行内容的水平对齐方式 left/center/right</li> <li>valign=“middle” 这一行内容的垂直对齐方式 top/middle/bottom</li> <li>bgcolor=“yellow” 这一行的背景</li> </ul> <h4>3.10.4、td属性</h4> <ul> <li>width=“200px” 宽度</li> <li>height=“200px” 高度</li> <li>bgcolor=“purple” 背景色</li> <li>align=“left” 这一列内容的水平对齐方式</li> <li>valign=“bottom” 这一列内容的垂直对齐方式</li> <li>colspan 跨列合并</li> <li>rowspan 跨行合并</li> </ul> <h4>3.10.5、不规则的表格</h4> <ul> <li> <p>跨列</p> <p><code>colspan</code> 从指定的单元格位置位置处开始,横向向右合并n个单元格(n包含自己),然后把被合并的单元格删除掉.</p> </li> <li> <p>跨行</p> <p><code>rowspan</code> 从指定的单元格位置处开始,纵向向下合并n个单元格(n包含自己),然后把被合并的单元格删除掉</p> </li> </ul> <h4>3.10.6、可选标题 <code>caption</code></h4> <ul> <li> <p>表格的标题 <code><caption>我是标题</caption></code></p> </li> <li> <p>必须紧紧跟着table的开始标签</p> </li> <li> <p>案例</p> <pre><code class="prism language-html"><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>table</span> <span class="token attr-name">width</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>200px<span class="token punctuation">"</span></span> <span class="token attr-name">height</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>200px<span class="token punctuation">"</span></span> <span class="token attr-name">border</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>2px<span class="token punctuation">"</span></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>caption</span><span class="token punctuation">></span></span>我是标题<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>caption</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>tr</span><span class="token punctuation">></span></span> .... <span class="token tag"><span class="token tag"><span class="token punctuation"></</span>tr</span><span class="token punctuation">></span></span> .... <span class="token tag"><span class="token tag"><span class="token punctuation"></</span>table</span><span class="token punctuation">></span></span> </code></pre> </li> </ul> <h4>3.10.7、表格的复杂应用</h4> <ul> <li> <p>表头<code><th>..</th></code></p> <ul> <li>特点: 加粗,居中</li> <li>th替代td,所有的td的属性,th都可以使用</li> </ul> </li> <li> <p>行分组</p> <ul> <li>可以将连续的几行,划分到一个组上,进行统一的管理</li> <li>表头 <code><thead></thead></code></li> <li>表主体 <code><tbody></tbody></code></li> <li>表脚 <code><tfoot></tfoot></code></li> <li>行分组不见,如果源码没有行分组,浏览器渲染时,自动添加tbody</li> </ul> </li> <li> <p>表格的嵌套</p> <ul> <li>表格中所有的嵌套,都要放在td中</li> </ul> </li> </ul> <h3>3.11、<code><ul></code> <code><li></code> <code><dl></code> <code><ol></code> 列表标签</h3> <ul> <li> <p>列表的作用</p> <ul> <li>有条理的显示数据</li> <li>传统项目,无序列列表多由于布局</li> </ul> </li> <li> <p>列表类型</p> <ul> <li>有序列表 <code><ol>...</ol></code></li> <li>无序列表 <code><ul>...</ul></code></li> <li>列表项 <code><li>..</li></code></li> </ul> </li> <li> <p>列表的属性</p> <ul> <li> <p>有序列表的属性</p> <ul> <li> <p>start=“4” 指定编号的起始位置</p> </li> <li> <p>type=“I” 指定编号的类型</p> <pre><code>默认 1 数字 A/a 英文字母 i/I 罗马数字 </code></pre> </li> </ul> </li> <li> <p>无语列表的属性</p> <ul> <li> <p>type=“none”</p> <pre><code>默认值 disc circle 空心圆 square 实心方块 none 没有标识 </code></pre> </li> </ul> </li> </ul> </li> <li> <p>列表的嵌套</p> <ul> <li>所有的嵌套都必须放在li内部，语义要求。</li> <li>列表嵌套列表,被嵌套的列表,也必须放在li中</li> </ul> </li> <li> <p>h5–定义列表</p> <ul> <li>定义列表常用于给出一类事物或对明词的解释说明<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>JavaScript<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>dl</span><span class="token punctuation">></span></span> </code></pre> </li> </ul> </li> </ul> <h3>3.12、<code><input></code> 表单标签</h3> <h4>3.12.1、作用</h4> <ul> <li>提供可视化的输入控件</li> <li>用户输入的内容，被表单自动收集整理，并且提交给服务器</li> </ul> <p><strong>注意</strong> :表单没有接受响应的能力,所以可以使用js的dom操作收集页面的信息,再使用ajax发送请求和接受响应,但是ajax不能自动的收集整理数据。而且使用ajax就无法使用form表单自动收集提交数据的功能。</p> <h4>3.12.2、表单 <code><form></form></code></h4> <ul> <li><code><form></form></code> 在页面上不可见，可以自动收集整理数据提交到服务器</li> <li>属性 <ul> <li> <p>action=“” 定义表单提交时发送的动作（接口url）</p> </li> <li> <p>method=“” 定义表达提交的方式</p> </li> <li> <p>enctype=“”指定表单数据的编码方式，设置允许将什么样的数据提交给服务器</p> <pre><code>取值：1. application/x-www-form-urlencoded默认值,允许将任何字符提交给服务器(文件除外) 2. text/plain 允许提交普通字符（不包括特殊字符） 3. mulitipart/form-data传递文件 </code></pre> </li> </ul> </li> <li>在form标签中，能够与用户进行交互的可视化元素</li> <li><code><input type=""></code> 所有input元素都是行内块</li> <li>在页面中提供各种各样的输入控件</li> <li>input分类 <ul> <li>input元素基础9种，h5新出的10种</li> <li>textarea 多行文本域</li> <li>select+option下拉选择框</li> <li>其他相关元素</li> </ul> </li> <li>input公用属性 <ul> <li>type 指定input元素的类型默认值是text</li> <li>name 为控件定义名称，提供给服务端使用（使用form，name必须写）</li> <li>value 控件的值，真正传递给服务器的值/可发送的值例外，所有的按钮的value都是设置按钮上的文本，不是提交的值。</li> <li>disable 禁用只能看不能改，也不能提交,无值属性</li> </ul> </li> </ul> <h4>3.12.3、表单控件</h4> <ul> <li> <p>文本框 <code><input type="text"></code></p> <ul> <li> <p>属性</p> <pre><code>maxlength允许输入的最大字符数 readonly 无值属性只能读不能改但是可以提交 placeholder 占位提示符，显示在控件上的提示内容 </code></pre> </li> </ul> </li> <li> <p>密码框 <code><input type="password"></code></p> <ul> <li> <p>属性</p> <pre><code>maxlength允许输入的最大字符数 readonly 无值属性只能读不能改但是可以提交 placeholder 占位提示符，显示在控件上的提示内容 </code></pre> </li> </ul> </li> <li> <p>按钮,所有的按钮的value都是设置按钮上显示的文本，不是提交的值。</p> <ul> <li>提交 <code>type=“submit”</code>将表单中的数据，收集并整理，发送给服务器</li> <li>重置 <code>type=“reset”</code>将当前的表单的内容恢复到初始化状态</li> <li>普通按钮<code>type=‘button’</code>没有功能，配合oncilck事件，调用js脚本。</li> <li>为了提高可读性，h5新出的button标签</li> <li> 同submit，可以使用事件。</li> </ul> </li> <li> <p>单选按钮 <code><input type="radio"></code></p> <ul> <li> <p>属性</p> <ul> <li>必须有value属性</li> <li>必须有name属性，不然没有分组，即没有单选效果</li> <li>checked 无值属性一个元素被设置该属性，默认选中</li> </ul> </li> <li> <p>案列</p> <pre><code class="prism language-html"> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>input</span> <span class="token attr-name">type</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>radio<span class="token punctuation">"</span></span> <span class="token attr-name">name</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>gender<span class="token punctuation">"</span></span> <span class="token attr-name">value</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>man<span class="token punctuation">"</span></span> <span class="token attr-name">checked</span><span class="token punctuation">></span></span> 男 <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>input</span> <span class="token attr-name">type</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>radio<span class="token punctuation">"</span></span> <span class="token attr-name">name</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>gender<span class="token punctuation">"</span></span> <span class="token attr-name">value</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>man<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>input</span> <span class="token attr-name">type</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>radio<span class="token punctuation">"</span></span> <span class="token attr-name">name</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>gender<span class="token punctuation">"</span></span> <span class="token attr-name">value</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>man<span class="token punctuation">"</span></span><span class="token punctuation">></span></span> 无法确定 <span class="token comment"></span> <span class="token comment"></span> </code></pre> </li> </ul> </li> <li> <p>多选按钮 <code><input type="checkbox"></code></p> <ul> <li> <p>属性</p> <ul> <li>必须有value</li> <li>name 用于分组</li> <li>checked 无值属性，默认选中</li> </ul> </li> <li> <p>案例</p> <pre><code class="prism language-html"> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>form</span> <span class="token attr-name">action</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">method</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>get<span class="token punctuation">"</span></span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>button</span><span class="token punctuation">></span></span>提交<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>button</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>input</span> <span class="token attr-name">type</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>checkbox<span class="token punctuation">"</span></span> <span class="token attr-name">name</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>hobby<span class="token punctuation">"</span></span> <span class="token attr-name">value</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>eat<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>input</span> <span class="token attr-name">type</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>checkbox<span class="token punctuation">"</span></span> <span class="token attr-name">name</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>hobby<span class="token punctuation">"</span></span> <span class="token attr-name">value</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>drink<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>input</span> <span class="token attr-name">type</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>checkbox<span class="token punctuation">"</span></span> <span class="token attr-name">name</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>hobby<span class="token punctuation">"</span></span> <span class="token attr-name">value</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>play<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>input</span> <span class="token attr-name">type</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>checkbox<span class="token punctuation">"</span></span> <span class="token attr-name">name</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>hobby<span class="token punctuation">"</span></span> <span class="token attr-name">value</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>happy<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>form</span><span class="token punctuation">></span></span> <span class="token comment"></span> <span class="token comment"></span> <span class="token comment"></span> <span class="token comment"></span> </code></pre> </li> </ul> </li> <li> <p>隐藏文本域 <code><input type="hidden"></code></p> <ul> <li>想把数据提交给服务器，但是又不想展示给用户看</li> </ul> </li> <li> <p>文本选择块<code><input type="file"></code></p> <ul> <li>使用文件选择框的前提 <ul> <li>form的method必须是post，没有大小限制</li> <li>enctype=‘mulitipart/form-data’，才能上传文件</li> <li>如果想要上传多个文件，multiple无值属性，设置多选</li> </ul> </li> </ul> </li> <li> <p>多行文本域 `</p> <ul> <li>把文本域看作一个大的文本域,允许录入多行文本</li> <li>cols=“5” rows=“3” 设置文本域大小,但是计算机的内核和算法不同会导致值不准备</li> </ul> </li> <li> <p>下拉选择框 <code><select name=""><option>...</option>...</select></code></p> <ul> <li>select 的属性： <ul> <li>size：默认值为1，1的时候显示形式是下拉选，而>1是滚动选择框</li> <li>multiple:无值属性，设置多选</li> </ul> </li> <li>option属性： <ul> <li>selected 无值属性默认选中</li> </ul> </li> <li>option没有定义value，那么select提交的value是选中的option的内容</li> <li>option有value，那么select提交的value，是选中option的value</li> </ul> </li> <li> <p>表单控件其他元素</p> <ul> <li> <p><code><label></code>标签</p> <ul> <li>可以使用label替代form表单中span标签</li> <li>文本和表单控件的关联</li> <li>案例<pre><code><input id="auto" type="checkbox"> <label for="auto">请点我</label> </code></pre> </li> </ul> </li> <li> <p>为控件分组 <code><fieldset></code></p> <pre><code class="prism language-html"><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>fieldset</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>legend</span><span class="token punctuation">></span></span><span class="token tag"><span class="token tag"><span class="token punctuation"></</span>legend</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>fieldset</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>fieldset</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>legend</span><span class="token punctuation">></span></span>用户的基本信息<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>legend</span><span class="token punctuation">></span></span> 用户姓名: <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>input</span> <span class="token attr-name">type</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>text<span class="token punctuation">"</span></span> <span class="token attr-name">name</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>uname<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>br</span><span class="token punctuation">></span></span> 用户密码: <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>input</span> <span class="token attr-name">type</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>password<span class="token punctuation">"</span></span> <span class="token attr-name">name</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>upwd<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>br</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>input</span> <span class="token attr-name">id</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>man<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>checkbox<span class="token punctuation">"</span></span> <span class="token attr-name">naem</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>gender<span class="token punctuation">"</span></span> <span class="token attr-name">value</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>man<span class="token punctuation">"</span></span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>label</span> <span class="token attr-name">for</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>man<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>男<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>label</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>input</span> <span class="token attr-name">id</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>woman<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>checkbox<span class="token punctuation">"</span></span> <span class="token attr-name">naem</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>gender<span class="token punctuation">"</span></span> <span class="token attr-name">value</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>woman<span class="token punctuation">"</span></span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>label</span> <span class="token attr-name">for</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>woman<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>女<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>label</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"></</span>fieldset</span><span class="token punctuation">></span></span> </code></pre> </li> </ul> </li> </ul> <h3>3.13、<code><iframe></code> 框架标签</h3> <ul> <li><code><iframe></iframe></code></li> <li>在一个html中，引入其他的html</li> <li>属性： <ul> <li>src 资源路径</li> <li>frameborder框架得边框</li> <li>scrolling框架得滚动条 no 不要滚动条 yes auto</li> <li>height</li> <li>width</li> </ul> </li> </ul> </div> </div> </div> </div> </div>  <div id="SOHUCS" sid="1735477887848472576"></div> <script type="text/javascript" src="/views/front/js/chanyan.js"></script>  <div class="youdao-fixed-ad" id="detail_ad_bottom"></div> </div> <div class="col-md-3"> <div class="row" id="ad">  <div id="right-1" class="col-lg-12 col-md-12 col-sm-4 col-xs-4 ad"> <div class="youdao-fixed-ad" id="detail_ad_1"> </div> </div>  <div id="right-2" class="col-lg-12 col-md-12 col-sm-4 col-xs-4 ad"> <div class="youdao-fixed-ad" id="detail_ad_2"></div> </div>  <div id="right-3" class="col-lg-12 col-md-12 col-sm-4 col-xs-4 ad"> <div class="youdao-fixed-ad" id="detail_ad_3"></div> </div> </div> </div> </div> </div> </div> <div class="container"> <h4 class="pt20 mb15 mt0 border-top">你可能感兴趣的:(学习笔记,浏览器,html5,html,学习,笔记,javascript,开发语言,前端,vue.js)</h4> <div id="paradigm-article-related"> <div class="recommend-post mb30"> <ul class="widget-links"> <li><a href="/article/1886203586904387584.htm" title="对领域驱动设计(DDD)的学习成果" target="_blank">对领域驱动设计(DDD)的学习成果</a> <span class="text-muted">huaishu</span> <a class="tag" taget="_blank" href="/search/%E6%9E%B6%E6%9E%84/1.htm">架构</a> <div>领域驱动设计之领域模型2004年EricEvans发表Domain-DrivenDesign–TacklingComplexityintheHeartofSoftware（领域驱动设计），简称EvansDDD。领域驱动设计分为两个阶段：以一种领域专家、设计人员、开发人员都能理解的“通用语言”作为相互交流的工具，在不断交流的过程中不断发现一些主要的领域概念，然后将这些概念设计成一个领域模型；由领域模</div> </li> <li><a href="/article/1886198422084579328.htm" title="Webpack 模块加载、动态引入机制源码解读" target="_blank">Webpack 模块加载、动态引入机制源码解读</a> <span class="text-muted">AIGC小陈</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/javascript/1.htm">javascript</a><a class="tag" taget="_blank" href="/search/%E5%BC%80%E5%8F%91%E8%AF%AD%E8%A8%80/1.htm">开发语言</a><a class="tag" taget="_blank" href="/search/react.js/1.htm">react.js</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a> <div>今天的文章简单探讨一下Vue和React的不同。本人Vue2和React都用过，但不熟悉Vue3，没用它做过项目。其实我对这两大框架也没有认真钻研过它们的细节，也就是工作上用它们写一些简单业务，或偶尔看看相关的博客文章，但还是有一些浅显的认识的，写下来记录一下。Vue和React都是用于构建UI界面的流行框架。它们的哲学也有很多相似的地方，我们可以认为这些特性是流行前端框架的一个趋势。它们是：组件</div> </li> <li><a href="/article/1886196906091147264.htm" title="探索前端可观察性：如何使用Telemetry提高用户体验" target="_blank">探索前端可观察性：如何使用Telemetry提高用户体验</a> <span class="text-muted">桂月二二</span> <a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/ux/1.htm">ux</a> <div>随着前端应用变得日益复杂，可观察性（Observability）在前端开发中的重要性正逐步显现。通过实现Telemetry（遥测）功能，开发者能够收集、分析应用的运行数据，从而更好地了解用户行为、定位问题，并持续优化用户体验。什么是Telemetry？**Telemetry（遥测）**是指通过自动化手段远程采集系统或应用运行时的状态数据和行为信息。这些数据通常包括性能指标、错误日志、用户交互事件等</div> </li> <li><a href="/article/1886195768709148672.htm" title="npm启动前端项目时报错（vue) error:0308010C:digital envelope routines::unsupported" target="_blank">npm启动前端项目时报错（vue) error:0308010C:digital envelope routines::unsupported</a> <span class="text-muted">华如锦</span> <a class="tag" taget="_blank" href="/search/%E5%BC%80%E5%8F%91/1.htm">开发</a><a class="tag" taget="_blank" href="/search/%E6%9C%AC%E5%9C%B0%E7%8E%AF%E5%A2%83%E9%85%8D%E7%BD%AE/1.htm">本地环境配置</a><a class="tag" taget="_blank" href="/search/js/1.htm">js</a><a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/npm/1.htm">npm</a><a class="tag" taget="_blank" href="/search/vue.js/1.htm">vue.js</a><a class="tag" taget="_blank" href="/search/node.js/1.htm">node.js</a><a class="tag" taget="_blank" href="/search/java/1.htm">java</a> <div>vue启动项目时，npmrunserve报下面的错：error:0308010C:digitalenveloperoutines::unsupportedatnewHash(node:internal/crypto/hash:67:19)atObject.createHash(node:crypto:133:10)atFSReqCallback.readFileAfterClose[asoncom</div> </li> <li><a href="/article/1886193751324422144.htm" title="FastDFS实用笔记（Docker 搭建环境 + 整合 SpringBoot）" target="_blank">FastDFS实用笔记（Docker 搭建环境 + 整合 SpringBoot）</a> <span class="text-muted">字节全栈_kYu</span> <a class="tag" taget="_blank" href="/search/%E7%AC%94%E8%AE%B0/1.htm">笔记</a><a class="tag" taget="_blank" href="/search/docker/1.htm">docker</a><a class="tag" taget="_blank" href="/search/spring/1.htm">spring</a><a class="tag" taget="_blank" href="/search/boot/1.htm">boot</a> <div>解决了大容量存储和负载均衡的问题，特别适合中小文件（4KB>文件路径为空…”);return“文件路径不能为空”;}try{StorePathstorePath=StorePath.parseFromUrl(fileUrl);storageClient.deleteFile(storePath.getGroup(),storePath.getPath());}catch(Exceptione){l</div> </li> <li><a href="/article/1886193752188448768.htm" title="MySQL基础学习总结（二）_select round(3" target="_blank">MySQL基础学习总结（二）_select round(3</a> <span class="text-muted">字节全栈_kYu</span> <a class="tag" taget="_blank" href="/search/mysql/1.htm">mysql</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%95%B0%E6%8D%AE%E5%BA%93/1.htm">数据库</a> <div>|abc ||abc ||abc ||abc ||abc ||abc ||abc ||abc ||abc ||abc |+---------+selectabcfromemp;ERROR1054(42S22):Unknowncolumn'abc'in'fieldlist'这样肯定报错，因为会把abc当做一个字段的名字，去emp表中找abc字段去了。**结论：select后面可以</div> </li> <li><a href="/article/1886191608492257280.htm" title="编程语言“鄙视链”：为何Python会处于这样的位置？" target="_blank">编程语言“鄙视链”：为何Python会处于这样的位置？</a> <span class="text-muted">宝码香车</span> <a class="tag" taget="_blank" href="/search/%23/1.htm">#</a><a class="tag" taget="_blank" href="/search/%E8%AF%9D%E9%A2%98/1.htm">话题</a><a class="tag" taget="_blank" href="/search/python/1.htm">python</a><a class="tag" taget="_blank" href="/search/%E5%BC%80%E5%8F%91%E8%AF%AD%E8%A8%80/1.htm">开发语言</a> <div>前言：哈喽，大家好，今天给大家分享一篇文章！并提供具体代码帮助大家深入理解，彻底掌握！创作不易，如果能帮助到大家或者给大家一些灵感和启发，欢迎收藏+关注哦目录编程语言“鄙视链”：为何Python会处于这样的位置？引言一、Python被视为新手友好型语言的原因（二）丰富的学习资源（三）广泛的应用领域二、Python在某些方面被“轻视”的因素（一）性能方面的局限（二）代码的安全性与保密性（三）行业传统</div> </li> <li><a href="/article/1886191354040610816.htm" title="微信小程序视频点播在线视频学习系统毕业设计课程设计（1）首页_微信小程序视频功能设计流程图" target="_blank">微信小程序视频点播在线视频学习系统毕业设计课程设计（1）首页_微信小程序视频功能设计流程图</a> <span class="text-muted">字节全栈_kYu</span> <a class="tag" taget="_blank" href="/search/%E5%BE%AE%E4%BF%A1%E5%B0%8F%E7%A8%8B%E5%BA%8F/1.htm">微信小程序</a><a class="tag" taget="_blank" href="/search/%E5%AD%A6%E4%B9%A0/1.htm">学习</a><a class="tag" taget="_blank" href="/search/%E8%AF%BE%E7%A8%8B%E8%AE%BE%E8%AE%A1/1.htm">课程设计</a> <div>06-19关于违规会员处理的通知视频分类最新更新课程所有课程HTML入门到精通3651人报名免费HTML入门到精通3651人报名免费HTML入门到精通3651人报名免费HTML入门到精通3651人报名免费###wxss代码/*广告图片*/.ad01{width:100%;/*宽度100%*/}.qukuai{display:flex;align-items:center;background-co</div> </li> <li><a href="/article/1886189716236201984.htm" title="AIGC的底层框架和技术模块" target="_blank">AIGC的底层框架和技术模块</a> <span class="text-muted">五岔路口</span> <a class="tag" taget="_blank" href="/search/AIGC/1.htm">AIGC</a> <div>AIGC（ArtificialIntelligenceGeneratedContent，人工智能生成内容）的底层框架和技术模块是构建其强大自然语言处理能力的核心组成部分。以下是对AIGC底层框架和技术模块的详细解析：底层框架AIGC的底层框架主要基于深度学习的语言模型，特别是Transformer模型及其变种，如GPT（GenerativePre-trainedTransformer）等。这些模型</div> </li> <li><a href="/article/1886188326415822848.htm" title="如何在Windows、Linux和macOS上安装Rust并完成Hello World" target="_blank">如何在Windows、Linux和macOS上安装Rust并完成Hello World</a> <span class="text-muted">美味小鱼</span> <a class="tag" taget="_blank" href="/search/Rust%E8%AF%AD%E8%A8%80%E5%85%A5%E9%97%A8%E5%88%B0%E5%AE%9E%E8%B7%B5/1.htm">Rust语言入门到实践</a><a class="tag" taget="_blank" href="/search/rust/1.htm">rust</a><a class="tag" taget="_blank" href="/search/hello/1.htm">hello</a><a class="tag" taget="_blank" href="/search/world/1.htm">world</a> <div>如何在Windows、Linux和macOS上安装Rust并完成HelloWorld如果你刚刚开始学习Rust，第一步就是安装Rust并运行你的第一个程序！本文将详细介绍如何在Windows、Linux和macOS上安装Rust，并编写一个简单的“Hello,World!”程序。1.安装RustRust的安装非常简单，官方提供了一个名为rustup的工具，可以帮你轻松安装和管理Rust。以下是具体</div> </li> <li><a href="/article/1886185429342941184.htm" title="yfinance的使用" target="_blank">yfinance的使用</a> <span class="text-muted">ilikework</span> <a class="tag" taget="_blank" href="/search/python/1.htm">python</a><a class="tag" taget="_blank" href="/search/%E9%87%8F%E5%8C%96%E4%BA%A4%E6%98%93/1.htm">量化交易</a> <div>最近想学习一下量化交易，就找了些python的库，yfinance这个是比较靠谱的库。功能有哪些还不是太清楚，似乎不支持多年的PE指标获取。下面是外汇历史数据的取得data=yf.download(tickers='USDJPY=X',#通貨ペアperiod='1d',#データ取得期間interval='1m',#データ表示間隔)下面是股票数据的取得tickers=['600875.SS']for</div> </li> <li><a href="/article/1886181390714728448.htm" title="101算法javaScript描述【3】" target="_blank">101算法javaScript描述【3】</a> <span class="text-muted">2401_89317507</span> <a class="tag" taget="_blank" href="/search/%E7%AE%97%E6%B3%95/1.htm">算法</a><a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a><a class="tag" taget="_blank" href="/search/java/1.htm">java</a> <div>通常情况下，不能出现超过连续三个相同的罗马数字并且罗马数字中小的数字在大的数字的右边。但也存在特例，例如4不写做IIII，而是IV。数字1在数字5的左边，所表示的数等于大数5减小数1得到的数值4。同样地，数字9表示为IX。这个特殊的规则只适用于以下六种情况：I可以放在V(5)和X(10)的左边，来表示4和9。X可以放在L(50)和C(100)的左边，来表示40和90。C可以放在D(500)和M(1</div> </li> <li><a href="/article/1886176727982469120.htm" title="java xml dom 解析_解析 XML DOM" target="_blank">java xml dom 解析_解析 XML DOM</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/xml/1.htm">xml</a><a class="tag" taget="_blank" href="/search/dom/1.htm">dom</a><a class="tag" taget="_blank" href="/search/%E8%A7%A3%E6%9E%90/1.htm">解析</a> <div>解析XMLDOM大多数浏览器都内建了供读取和操作XML的XML解析器。解析器把XML转换为JavaScript可存取的对象。实例W3School提供的实例独立于浏览器和平台。这些实例可在所有现代浏览器中运行。解析XML所有现代浏览器都内建了用于读取和操作XML的XML解析器。解析器把XML读入内存，并把它转换为可被JavaScript访问的XMLDOM对象。微软的XML解析器与其他浏览器中的解析器</div> </li> <li><a href="/article/1886176349916295168.htm" title="C语言实现图像二值化变换项目源码" target="_blank">C语言实现图像二值化变换项目源码</a> <span class="text-muted">爽新全效瓷兔膏</span> <div>本文还有配套的精品资源，点击获取简介：本项目提供了一个C语言编程案例，专门用于解决图像处理中的“百马百担”问题，即图像二值化。项目展示如何使用C语言进行图像的读取、处理和保存，特别是二值化转换的实现，通过设定阈值将图像简化为黑白色调，以突出其特征。源码中包括了图像读取、阈值设置、像素遍历和图像写入等关键步骤，适合C语言学习者和图像处理领域开发者学习实践。1.C语言图像处理简介简介C语言作为一种高效</div> </li> <li><a href="/article/1886176097222062080.htm" title="http://www.115ps.com/all.html,plnt-20200804" target="_blank">http://www.115ps.com/all.html,plnt-20200804</a> <span class="text-muted">爽新全效瓷兔膏</span> <div>0001637207-20-000037.txt:202008040001637207-20-000037.hdr.sgml:2020080420200804161432ACCESSIONNUMBER:0001637207-20-000037CONFORMEDSUBMISSIONTYPE:8-KPUBLICDOCUMENTCOUNT:15CONFORMEDPERIODOFREPORT:202008</div> </li> <li><a href="/article/1886175088299012096.htm" title="Python机器学习实战：人脸识别技术的实现和挑战" target="_blank">Python机器学习实战：人脸识别技术的实现和挑战</a> <span class="text-muted">AI天才研究院</span> <a class="tag" taget="_blank" href="/search/AI%E5%A4%A7%E6%A8%A1%E5%9E%8B%E4%BC%81%E4%B8%9A%E7%BA%A7%E5%BA%94%E7%94%A8%E5%BC%80%E5%8F%91%E5%AE%9E%E6%88%98/1.htm">AI大模型企业级应用开发实战</a><a class="tag" taget="_blank" href="/search/%E5%A4%A7%E6%95%B0%E6%8D%AEAI%E4%BA%BA%E5%B7%A5%E6%99%BA%E8%83%BD/1.htm">大数据AI人工智能</a><a class="tag" taget="_blank" href="/search/%E8%AE%A1%E7%AE%97%E7%A7%91%E5%AD%A6/1.htm">计算科学</a><a class="tag" taget="_blank" href="/search/%E7%A5%9E%E7%BB%8F%E8%AE%A1%E7%AE%97/1.htm">神经计算</a><a class="tag" taget="_blank" href="/search/%E6%B7%B1%E5%BA%A6%E5%AD%A6%E4%B9%A0/1.htm">深度学习</a><a class="tag" taget="_blank" href="/search/%E7%A5%9E%E7%BB%8F%E7%BD%91%E7%BB%9C/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/%E4%BA%BA%E5%B7%A5%E6%99%BA%E8%83%BD/1.htm">人工智能</a><a class="tag" taget="_blank" href="/search/%E5%A4%A7%E5%9E%8B%E8%AF%AD%E8%A8%80%E6%A8%A1%E5%9E%8B/1.htm">大型语言模型</a><a class="tag" taget="_blank" href="/search/AI/1.htm">AI</a><a class="tag" taget="_blank" href="/search/AGI/1.htm">AGI</a><a class="tag" taget="_blank" href="/search/LLM/1.htm">LLM</a><a class="tag" taget="_blank" href="/search/Java/1.htm">Java</a><a class="tag" taget="_blank" href="/search/Python/1.htm">Python</a><a class="tag" taget="_blank" href="/search/%E6%9E%B6%E6%9E%84%E8%AE%BE%E8%AE%A1/1.htm">架构设计</a><a class="tag" taget="_blank" href="/search/Agent/1.htm">Agent</a><a class="tag" taget="_blank" href="/search/RPA/1.htm">RPA</a> <div>Python机器学习实战：人脸识别技术的实现和挑战作者：禅与计算机程序设计艺术/ZenandtheArtofComputerProgramming关键词：人脸识别技术,模型训练,多人识别,动态人脸检测,应用场景1.背景介绍1.1问题的由来随着科技的进步和互联网的普及，人脸识别技术因其在安全验证、生物特征识别、智能监控等多个领域的广泛应用而迅速崛起。从传统的门禁系统到现代的人脸支付、社交媒体的自动登</div> </li> <li><a href="/article/1886174709716938752.htm" title="深度学习：基础原理与实践" target="_blank">深度学习：基础原理与实践</a> <span class="text-muted">阿尔法星球</span> <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><a class="tag" taget="_blank" href="/search/%E4%BA%BA%E5%B7%A5%E6%99%BA%E8%83%BD/1.htm">人工智能</a> <div>1.深度学习概述1.1定义与发展历程深度学习是机器学习的一个分支，它基于人工神经网络的学习算法，特别是那些具有多层（深层）结构的网络。深度学习模型能够自动从原始数据中提取复杂的特征，而不需要人为设计特征提取算法。定义：深度学习可以定义为使用深层神经网络进行学习的过程，这些网络由多个非线性的变换组成，能够学习数据的多层次表示。发展历程：深度学习的起源可以追溯到1943年WarrenSturgisMc</div> </li> <li><a href="/article/1886174577411813376.htm" title="JavaScript网页设计实战：微信登录 + 获取用户头像和昵称" target="_blank">JavaScript网页设计实战：微信登录 + 获取用户头像和昵称</a> <span class="text-muted">James吖</span> <a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a><a class="tag" taget="_blank" href="/search/%E5%BE%AE%E4%BF%A1/1.htm">微信</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/%E5%BC%80%E5%8F%91%E8%AF%AD%E8%A8%80/1.htm">开发语言</a><a class="tag" taget="_blank" href="/search/%E7%9B%AE%E6%A0%87%E6%A3%80%E6%B5%8B/1.htm">目标检测</a><a class="tag" taget="_blank" href="/search/ecmascript/1.htm">ecmascript</a><a class="tag" taget="_blank" href="/search/%E7%A5%9E%E7%BB%8F%E7%BD%91%E7%BB%9C/1.htm">神经网络</a> <div>引言在现代Web开发中，社交媒体登录已经成为提升用户体验的一个重要组成部分。微信登录因其广泛的用户基础和便捷的登录方式，深受开发者和用户的喜爱。本文将通过一个实战案例，介绍如何在JavaScript网页应用中集成微信登录功能，并获取用户的头像和昵称。前提条件在开始之前，请确保你已经具备以下条件：已经在微信开放平台上注册并创建了应用，获取到了AppID和AppSecret。了解基本的HTML、CSS</div> </li> <li><a href="/article/1886173190795882496.htm" title="【Spring Boot】Spring AOP动态代理，以及静态代理" target="_blank">【Spring Boot】Spring AOP动态代理，以及静态代理</a> <span class="text-muted">m0_74823452</span> <a class="tag" taget="_blank" href="/search/%E9%9D%A2%E8%AF%95/1.htm">面试</a><a class="tag" taget="_blank" href="/search/%E5%AD%A6%E4%B9%A0%E8%B7%AF%E7%BA%BF/1.htm">学习路线</a><a class="tag" taget="_blank" href="/search/%E9%98%BF%E9%87%8C%E5%B7%B4%E5%B7%B4/1.htm">阿里巴巴</a><a class="tag" taget="_blank" href="/search/spring/1.htm">spring</a><a class="tag" taget="_blank" href="/search/spring/1.htm">spring</a><a class="tag" taget="_blank" href="/search/boot/1.htm">boot</a><a class="tag" taget="_blank" href="/search/%E5%90%8E%E7%AB%AF/1.htm">后端</a> <div>目录SpringAOP代理一.代理的概念二.静态代理三.JDK代理3.1重写invoke方法进?功能增强3.2通过Proxy类随机生成代理对象四.CGLIB代理4.1自定义类来重写intercept方法4.2通过Enhancer类的create方法来创建代理类五.AOP源码剖析总结(重中之重，精华)SpringAOP代理一.代理的概念根据前面的学习想必大家都已经对SpringAOP有所了解了，接下</div> </li> <li><a href="/article/1886172434000834560.htm" title="XML DOM 改变节点值" target="_blank">XML DOM 改变节点值</a> <span class="text-muted">shangaoo</span> <a class="tag" taget="_blank" href="/search/xml/1.htm">xml</a><a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a> <div>nodeValue属性用于改变节点值。setAttribute()方法用于改变属性值。尝试一下-实例下面的实例使用XML文件books.xml。函数loadXMLDoc()，位于外部JavaScript中，用于加载XML文件。改变元素的文本节点本例使用nodeValue属性来改变"books.xml"中第一个元素的文本节点。通过使用setAttribute来改变属性值本例使用setAttribut</div> </li> <li><a href="/article/1886171170072489984.htm" title="探索神经网络的奥秘：从基础理论到Python实践" target="_blank">探索神经网络的奥秘：从基础理论到Python实践</a> <span class="text-muted">仲毓俏Alanna</span> <div>探索神经网络的奥秘：从基础理论到Python实践【下载地址】第一章神经网络如何工作附Python神经网络编程.pdf分享本资源文件提供了关于神经网络基础知识的详细介绍，并附带了一个Python神经网络编程的PDF文件。通过学习本资源，您将能够理解神经网络的基本工作原理，并掌握如何使用Python进行神经网络编程项目地址:https://gitcode.com/Resource-Bundle-Col</div> </li> <li><a href="/article/1886170665132814336.htm" title="XMLDOM之浏览器差异" target="_blank">XMLDOM之浏览器差异</a> <span class="text-muted">dengguxinghe4335</span> <a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a><a class="tag" taget="_blank" href="/search/xhtml/1.htm">xhtml</a><a class="tag" taget="_blank" href="/search/ViewUI/1.htm">ViewUI</a> <div>DOM解析中的浏览器差异所有现代浏览器都支持w3cDOM规范，不过浏览器之间是有差异的，重要的区别有两点：加载XML的方式；处理空白和换行的方式；１、加载XML的方式：所有现代浏览器都内建了用于读取和操作XML的XML解析器。解析器把XML读入内存，并把它转换为可被JavaScript访问的XMLDOM对象；微软的XML解析器与其他浏览器中的解析器是有差异的。微软的解析器支持对XML文件和XML字</div> </li> <li><a href="/article/1886170538771017728.htm" title="python学习(11)--python 函数默认参数" target="_blank">python学习(11)--python 函数默认参数</a> <span class="text-muted">程序员陈师傅</span> <a class="tag" taget="_blank" href="/search/Python%E5%AD%A6%E4%B9%A0%E4%B8%93%E6%A0%8F/1.htm">Python学习专栏</a><a class="tag" taget="_blank" href="/search/python/1.htm">python</a><a class="tag" taget="_blank" href="/search/%E5%AD%A6%E4%B9%A0/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>在Python中，函数默认参数是指在函数定义中为参数指定默认值的参数。当调用函数时，如果没有为默认参数提供值，那么将使用默认值。函数默认参数的语法如下：deffunction_name(parameter1=default_value1,parameter2=default_value2,...):#函数体下面是一个使用默认参数的函数示例：defgreet(name,message="Hello"</div> </li> <li><a href="/article/1886170283497287680.htm" title="什么是MoE？" target="_blank">什么是MoE？</a> <span class="text-muted">CM莫问</span> <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/%E4%BA%BA%E5%B7%A5%E6%99%BA%E8%83%BD%E7%AE%97%E6%B3%95%E5%B8%B8%E8%A7%81%E6%A6%82%E5%BF%B5/1.htm">人工智能算法常见概念</a><a class="tag" taget="_blank" href="/search/%E4%BA%BA%E5%B7%A5%E6%99%BA%E8%83%BD/1.htm">人工智能</a><a class="tag" taget="_blank" href="/search/%E7%AE%97%E6%B3%95/1.htm">算法</a><a class="tag" taget="_blank" href="/search/python/1.htm">python</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/MoE/1.htm">MoE</a><a class="tag" taget="_blank" href="/search/%E6%B7%B7%E5%90%88%E4%B8%93%E5%AE%B6%E6%A8%A1%E5%9E%8B/1.htm">混合专家模型</a><a class="tag" taget="_blank" href="/search/%E6%9C%BA%E5%99%A8%E5%AD%A6%E4%B9%A0/1.htm">机器学习</a> <div>一、概念MoE（MixtureofExperts）是一种深度学习架构，它结合了多个专家模型（Experts）和一个门控机制（GatingMechanism）来处理不同的输入数据或任务。MoE的核心思想是将复杂的任务分解为多个子任务，由不同的专家网络来处理，以此来提升整体模型的性能和效率。MOE通过集成多个专家来显著提高模型的容量和表达能力，每个专家可以专注于学习输入数据的不同方面或特征，使得整个模</div> </li> <li><a href="/article/1886169525070655488.htm" title="CentOS 7.6用户管理指令" target="_blank">CentOS 7.6用户管理指令</a> <span class="text-muted">2301_80069458</span> <a class="tag" taget="_blank" href="/search/linux/1.htm">linux</a><a class="tag" taget="_blank" href="/search/%E6%9C%8D%E5%8A%A1%E5%99%A8/1.htm">服务器</a><a class="tag" taget="_blank" href="/search/%E5%AD%A6%E4%B9%A0/1.htm">学习</a> <div>#学习笔记#一、用户添加useradd用户名二、给用户指定密码passwd用户名三、删除用户1、仅删除用户不删除用户家目录（此处用户家目录可以理解为用户的数据，通常情况下建议保留）userdel用户名2、输出用户并且删除用户家目录userdel-r用户名四、切换用户1、从当前用户切换到另一个用户上（从权限高的用户切换到权限低的用户无需输入密码，反之需要输入密码）su-用户名2、从切换的账户上退回到</div> </li> <li><a href="/article/1886167508830973952.htm" title="MySQL与Python：连接与操作数据库的魔法之旅" target="_blank">MySQL与Python：连接与操作数据库的魔法之旅</a> <span class="text-muted">墨瑾轩</span> <a class="tag" taget="_blank" href="/search/%E4%B8%80%E8%B5%B7%E5%AD%A6%E5%AD%A6%E6%95%B0%E6%8D%AE%E5%BA%93%E3%80%90%E4%B8%80%E3%80%91/1.htm">一起学学数据库【一】</a><a class="tag" taget="_blank" href="/search/%E6%95%B0%E6%8D%AE%E5%BA%93/1.htm">数据库</a><a class="tag" taget="_blank" href="/search/mysql/1.htm">mysql</a> <div>关注墨瑾轩，带你探索编程的奥秘！超萌技术攻略，轻松晋级编程高手技术宝库已备好，就等你来挖掘订阅墨瑾轩，智趣学习不孤单即刻启航，编程之旅更有趣开篇：数据库世界的探险️嘿，亲爱的Python小巫师们！今天我们要一起踏上一段探险之旅——连接并操作MySQL数据库。在这个数据的海洋中，MySQL是我们的宝藏库，而Python则是我们的魔法棒。准备好你的魔法帽，我们即将开始这段连接与操作数据库的魔法之旅！M</div> </li> <li><a href="/article/1886165739912622080.htm" title="【书生·浦语大模型实战营】学习笔记（三）：“茴香豆” 搭建你的RAG 智能助理" target="_blank">【书生·浦语大模型实战营】学习笔记（三）：“茴香豆” 搭建你的RAG 智能助理</a> <span class="text-muted">GoAI</span> <a class="tag" taget="_blank" href="/search/%E8%87%AA%E7%84%B6%E8%AF%AD%E8%A8%80%E5%A4%84%E7%90%86NLP/1.htm">自然语言处理NLP</a><a class="tag" taget="_blank" href="/search/%E6%B7%B1%E5%85%A5%E6%B5%85%E5%87%BAAI/1.htm">深入浅出AI</a><a class="tag" taget="_blank" href="/search/%E6%B7%B1%E5%85%A5%E6%B5%85%E5%87%BALLM/1.htm">深入浅出LLM</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/LLM/1.htm">LLM</a><a class="tag" taget="_blank" href="/search/%E4%BA%BA%E5%B7%A5%E6%99%BA%E8%83%BD/1.htm">人工智能</a><a class="tag" taget="_blank" href="/search/%E5%A4%A7%E6%A8%A1%E5%9E%8B/1.htm">大模型</a> <div>AI学习星球推荐：GoAI的学习社区知识星球是一个致力于提供《机器学习|深度学习|CV|NLP|大模型|多模态|AIGC》各个最新AI方向综述、论文等成体系的学习资料，配有全面而有深度的专栏内容，包括不限于前沿论文解读、资料共享、行业最新动态以、实践教程、求职相关（简历撰写技巧、面经资料与心得）多方面综合学习平台，强烈推荐AI小白及AI爱好者学习，性价比非常高！加入星球➡️点击链接【书生·</div> </li> <li><a href="/article/1886165487331635200.htm" title="某验第四代滑块逆向快速破解" target="_blank">某验第四代滑块逆向快速破解</a> <span class="text-muted">码王吴彦祖</span> <a class="tag" taget="_blank" href="/search/JS%E9%80%86%E5%90%91%E5%AE%9E%E6%88%98/1.htm">JS逆向实战</a><a class="tag" taget="_blank" href="/search/js%E9%80%86%E5%90%91/1.htm">js逆向</a><a class="tag" taget="_blank" href="/search/node.js/1.htm">node.js</a><a class="tag" taget="_blank" href="/search/%E5%8A%A0%E5%AF%86/1.htm">加密</a> <div>本期地址如下，使用base64解码获得网址aHR0cHM6Ly9ndDQuZ2VldGVzdC5jb20v前些天发现了一个巨牛的人工智能学习网站，通俗易懂，风趣幽默，忍不住分享一下给大家。点击跳转到网站破解某验，某盾已经是司空见惯的事情了，网上也有很多资料查阅，但是大多数都是繁琐、冗长，本文以最直接快速理解的方法讲解，稍微认真一点看完文章，你至少能在半个小时内完成破解本文大致步骤如下：找到加密位置</div> </li> <li><a href="/article/1886163598632349696.htm" title="『大模型笔记』视觉语言模型解释" target="_blank">『大模型笔记』视觉语言模型解释</a> <span class="text-muted">AI大模型前沿研究</span> <a class="tag" taget="_blank" href="/search/%E5%A4%A7%E6%A8%A1%E5%9E%8B%E7%AC%94%E8%AE%B0/1.htm">大模型笔记</a><a class="tag" taget="_blank" href="/search/LLM/1.htm">LLM</a><a class="tag" taget="_blank" href="/search/VLM/1.htm">VLM</a><a class="tag" taget="_blank" href="/search/%E8%A7%86%E8%A7%89%E8%AF%AD%E8%A8%80%E6%A8%A1%E5%9E%8B/1.htm">视觉语言模型</a><a class="tag" taget="_blank" href="/search/%E8%AF%AD%E8%A8%80%E6%A8%A1%E5%9E%8B/1.htm">语言模型</a><a class="tag" taget="_blank" href="/search/%E5%A4%A7%E6%A8%A1%E5%9E%8B/1.htm">大模型</a><a class="tag" taget="_blank" href="/search/%E4%BA%BA%E5%B7%A5%E6%99%BA%E8%83%BD/1.htm">人工智能</a> <div>视觉语言模型解释文章目录一.视觉语言模型解析1.什么是视觉语言模型？2.开源视觉语言模型概览3.如何找到合适的视觉语言模型MMMUMMBench4.技术细节5.使用变压器(transformers)运用视觉语言模型6.使用TRL微调视觉语言模型二.参考文章一.视觉语言模型解析视觉语言模型是一类能够同时从图像和文本中学习，以处理从视觉问题回答到图像描述等多种任务的模型。本文将深入探讨视觉语言模型的核</div> </li> <li><a href="/article/1886161583193780224.htm" title="ARM嵌入式学习--第十二天（WDOG，RTC）" target="_blank">ARM嵌入式学习--第十二天（WDOG，RTC）</a> <span class="text-muted">戒燥.</span> <a class="tag" taget="_blank" href="/search/%E5%AD%A6%E4%B9%A0/1.htm">学习</a><a class="tag" taget="_blank" href="/search/arm/1.htm">arm</a><a class="tag" taget="_blank" href="/search/arm%E5%BC%80%E5%8F%91/1.htm">arm开发</a><a class="tag" taget="_blank" href="/search/%E5%8D%95%E7%89%87%E6%9C%BA/1.htm">单片机</a> <div>--WDOG-介绍WatchDog是为了能够防止程序跑飞而使用的一种硬件模块，如果你的程序没有跑飞，那么你的程序会定时的去喂看门狗；如果你的程序跑飞了，那么就不会再去喂狗了，如果超过了喂狗时间，那么狗就会自己生成一个信号来重新reset你的CPU让程序重新开始。这是一种在很重要的情况下防止系统跑飞的一种方式-编程思路1.设置复位信号产生后以冷启动方式复位2.关闭看门狗控制器3.设置看门狗定时器定时</div> </li> <li><a href="/article/79.htm" title="基本数据类型和引用类型的初始值" target="_blank">基本数据类型和引用类型的初始值</a> <span class="text-muted">3213213333332132</span> <a class="tag" taget="_blank" href="/search/java%E5%9F%BA%E7%A1%80/1.htm">java基础</a> <div>package com.array; /** * @Description 测试初始值 * @author FuJianyong * 2015-1-22上午10:31:53 */ public class ArrayTest { ArrayTest at; String str; byte bt; short s; int i; long</div> </li> <li><a href="/article/206.htm" title="摘抄笔记--《编写高质量代码：改善Java程序的151个建议》" target="_blank">摘抄笔记--《编写高质量代码：改善Java程序的151个建议》</a> <span class="text-muted">白糖_</span> <a class="tag" taget="_blank" href="/search/%E9%AB%98%E8%B4%A8%E9%87%8F%E4%BB%A3%E7%A0%81/1.htm">高质量代码</a> <div> 记得3年前刚到公司，同桌同事见我无事可做就借我看《编写高质量代码：改善Java程序的151个建议》这本书，当时看了几页没上心就没研究了。到上个月在公司偶然看到，于是乎又找来看看，我的天，真是非常多的干货，对于我这种静不下心的人真是帮助莫大呀。看完整本书，也记了不少笔记</div> </li> <li><a href="/article/333.htm" title="【备忘】Django 常用命令及最佳实践" target="_blank">【备忘】Django 常用命令及最佳实践</a> <span class="text-muted">dongwei_6688</span> <a class="tag" taget="_blank" href="/search/django/1.htm">django</a> <div>注意：本文基于 Django 1.8.2 版本生成数据库迁移脚本（python 脚本） python manage.py makemigrations polls 说明：polls 是你的应用名字，运行该命令时需要根据你的应用名字进行调整查看该次迁移需要执行的 SQL 语句（只查看语句，并不应用到数据库上）： python manage.p</div> </li> <li><a href="/article/460.htm" title="阶乘算法之一N! 末尾有多少个零" target="_blank">阶乘算法之一N! 末尾有多少个零</a> <span class="text-muted">周凡杨</span> <a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/%E7%AE%97%E6%B3%95/1.htm">算法</a><a class="tag" taget="_blank" href="/search/%E9%98%B6%E4%B9%98/1.htm">阶乘</a><a class="tag" taget="_blank" href="/search/%E9%9D%A2%E8%AF%95/1.htm">面试</a><a class="tag" taget="_blank" href="/search/%E6%95%88%E7%8E%87/1.htm">效率</a> <div> &n</div> </li> <li><a href="/article/587.htm" title="spring注入servlet" target="_blank">spring注入servlet</a> <span class="text-muted">g21121</span> <a class="tag" taget="_blank" href="/search/Spring%E6%B3%A8%E5%85%A5/1.htm">Spring注入</a> <div>传统的配置方法是无法将bean或属性直接注入到servlet中的，配置代理servlet亦比较麻烦，这里其实有比较简单的方法，其实就是在servlet的init()方法中加入要注入的内容： ServletContext application = getServletContext(); WebApplicationContext wac = WebApplicationContextUtil</div> </li> <li><a href="/article/714.htm" title="Jenkins 命令行操作说明文档" target="_blank">Jenkins 命令行操作说明文档</a> <span class="text-muted">510888780</span> <a class="tag" taget="_blank" href="/search/centos/1.htm">centos</a> <div> 假设Jenkins的URL为http://22.11.140.38:9080/jenkins/ 基本的格式为 java 基本的格式为 java -jar jenkins-cli.jar [-s JENKINS_URL] command [options][args] 下面具体介绍各个命令的作用及基本使用方法 1. &nb</div> </li> <li><a href="/article/841.htm" title="UnicodeBlock检测中文用法" target="_blank">UnicodeBlock检测中文用法</a> <span class="text-muted">布衣凌宇</span> <a class="tag" taget="_blank" href="/search/UnicodeBlock/1.htm">UnicodeBlock</a> <div>/** * 判断输入的是汉字 */ public static boolean isChinese(char c) { Character.UnicodeBlock ub = Character.UnicodeBlock.of(c); </div> </li> <li><a href="/article/968.htm" title="java下实现调用oracle的存储过程和函数" target="_blank">java下实现调用oracle的存储过程和函数</a> <span class="text-muted">aijuans</span> <a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/orale/1.htm">orale</a> <div> 1.创建表：STOCK_PRICES 2.插入测试数据： 3.建立一个返回游标： PKG_PUB_UTILS 4.创建和存储过程：P_GET_PRICE 5.创建函数： 6.JAVA调用存储过程返回结果集 JDBCoracle10G_INVO</div> </li> <li><a href="/article/1095.htm" title="Velocity Toolbox" target="_blank">Velocity Toolbox</a> <span class="text-muted">antlove</span> <a class="tag" taget="_blank" href="/search/%E6%A8%A1%E6%9D%BF/1.htm">模板</a><a class="tag" taget="_blank" href="/search/tool/1.htm">tool</a><a class="tag" taget="_blank" href="/search/box/1.htm">box</a><a class="tag" taget="_blank" href="/search/velocity/1.htm">velocity</a> <div>velocity.VelocityUtil package velocity; import org.apache.velocity.Template; import org.apache.velocity.app.Velocity; import org.apache.velocity.app.VelocityEngine; import org.apache.velocity.c</div> </li> <li><a href="/article/1222.htm" title="JAVA正则表达式匹配基础" target="_blank">JAVA正则表达式匹配基础</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/%E6%AD%A3%E5%88%99%E8%A1%A8%E8%BE%BE%E5%BC%8F%E7%9A%84%E5%8C%B9%E9%85%8D/1.htm">正则表达式的匹配</a> <div> 正则表达式;提高程序的性能,简化代码,提高代码的可读性,简化对字符串的操作正则表达式的用途; 字符串的匹配字符串的分割字符串的查找字符串的替换正则表达式的验证语法 [a] //[]表示这个字符只出现一次 ,[a] 表示a只出现一</div> </li> <li><a href="/article/1349.htm" title="是否使用EL表达式的配置" target="_blank">是否使用EL表达式的配置</a> <span class="text-muted">bijian1013</span> <a class="tag" taget="_blank" href="/search/jsp/1.htm">jsp</a><a class="tag" taget="_blank" href="/search/web.xml/1.htm">web.xml</a><a class="tag" taget="_blank" href="/search/EL/1.htm">EL</a><a class="tag" taget="_blank" href="/search/EasyTemplate/1.htm">EasyTemplate</a> <div> 今天在开发过程中发现一个细节问题，由于前端采用EasyTemplate模板方法实现数据展示，但老是不能正常显示出来。后来发现竟是EL将我的EasyTemplate的${...}解释执行了，导致我的模板不能正常展示后台数据。网</div> </li> <li><a href="/article/1476.htm" title="精通Oracle10编程SQL(1-3)PLSQL基础" target="_blank">精通Oracle10编程SQL(1-3)PLSQL基础</a> <span class="text-muted">bijian1013</span> <a class="tag" taget="_blank" href="/search/oracle/1.htm">oracle</a><a class="tag" taget="_blank" href="/search/%E6%95%B0%E6%8D%AE%E5%BA%93/1.htm">数据库</a><a class="tag" taget="_blank" href="/search/plsql/1.htm">plsql</a> <div>--只包含执行部分的PL/SQL块 --set serveroutput off begin dbms_output.put_line('Hello,everyone!'); end; select * from emp; --包含定义部分和执行部分的PL/SQL块 declare v_ename varchar2(5); begin select </div> </li> <li><a href="/article/1603.htm" title="【Nginx三】Nginx作为反向代理服务器" target="_blank">【Nginx三】Nginx作为反向代理服务器</a> <span class="text-muted">bit1129</span> <a class="tag" taget="_blank" href="/search/nginx/1.htm">nginx</a> <div>Nginx一个常用的功能是作为代理服务器。代理服务器通常完成如下的功能：接受客户端请求将请求转发给被代理的服务器从被代理的服务器获得响应结果把响应结果返回给客户端实例本文把Nginx配置成一个简单的代理服务器对于静态的html和图片，直接从Nginx获取对于动态的页面，例如JSP或者Servlet，Nginx则将请求转发给Res</div> </li> <li><a href="/article/1730.htm" title="Plugin execution not covered by lifecycle configuration: org.apache.maven.plugin" target="_blank">Plugin execution not covered by lifecycle configuration: org.apache.maven.plugin</a> <span class="text-muted">blackproof</span> <a class="tag" taget="_blank" href="/search/maven/1.htm">maven</a><a class="tag" taget="_blank" href="/search/%E6%8A%A5%E9%94%99/1.htm">报错</a> <div>转：http://stackoverflow.com/questions/6352208/how-to-solve-plugin-execution-not-covered-by-lifecycle-configuration-for-sprin maven报错： Plugin execution not covered by lifecycle configuration: </div> </li> <li><a href="/article/1857.htm" title="发布docker程序到marathon" target="_blank">发布docker程序到marathon</a> <span class="text-muted">ronin47</span> <a class="tag" taget="_blank" href="/search/docker+%E5%8F%91%E5%B8%83%E5%BA%94%E7%94%A8/1.htm">docker 发布应用</a> <div>1 发布docker程序到marathon 1.1 搭建私有docker registry 1.1.1 安装docker regisry docker pull docker-registry docker run -t -p 5000:5000 docker-registry 下载docker镜像并发布到私有registry docker pull consol/tomcat-8.0 </div> </li> <li><a href="/article/1984.htm" title="java-57-用两个栈实现队列&&用两个队列实现一个栈" target="_blank">java-57-用两个栈实现队列&&用两个队列实现一个栈</a> <span class="text-muted">bylijinnan</span> <a class="tag" taget="_blank" href="/search/java/1.htm">java</a> <div> import java.util.ArrayList; import java.util.List; import java.util.Stack; /* * Q 57 用两个栈实现队列 */ public class QueueImplementByTwoStacks { private Stack<Integer> stack1; pr</div> </li> <li><a href="/article/2111.htm" title="Nginx配置性能优化" target="_blank">Nginx配置性能优化</a> <span class="text-muted">cfyme</span> <a class="tag" taget="_blank" href="/search/nginx/1.htm">nginx</a> <div>转载地址：http://blog.csdn.net/xifeijian/article/details/20956605 大多数的Nginx安装指南告诉你如下基础知识——通过apt-get安装，修改这里或那里的几行配置，好了，你已经有了一个Web服务器了。而且，在大多数情况下，一个常规安装的nginx对你的网站来说已经能很好地工作了。然而，如果你真的想挤压出Nginx的性能，你必</div> </li> <li><a href="/article/2238.htm" title="[JAVA图形图像]JAVA体系需要稳扎稳打,逐步推进图像图形处理技术" target="_blank">[JAVA图形图像]JAVA体系需要稳扎稳打,逐步推进图像图形处理技术</a> <span class="text-muted">comsci</span> <a class="tag" taget="_blank" href="/search/java/1.htm">java</a> <div> 对图形图像进行精确处理，需要大量的数学工具，即使是从底层硬件模拟层开始设计，也离不开大量的数学工具包，因为我认为，JAVA语言体系在图形图像处理模块上面的研发工作，需要从开发一些基础的，类似实时数学函数构造器和解析器的软件包入手，而不是急于利用第三方代码工具来实现一个不严格的图形图像处理软件...... &nb</div> </li> <li><a href="/article/2365.htm" title="MonkeyRunner的使用" target="_blank">MonkeyRunner的使用</a> <span class="text-muted">dai_lm</span> <a class="tag" taget="_blank" href="/search/android/1.htm">android</a><a class="tag" taget="_blank" href="/search/MonkeyRunner/1.htm">MonkeyRunner</a> <div>要使用MonkeyRunner，就要学习使用Python，哎先抄一段官方doc里的代码作用是启动一个程序（应该是启动程序默认的Activity），然后按MENU键，并截屏 # Imports the monkeyrunner modules used by this program from com.android.monkeyrunner import MonkeyRun</div> </li> <li><a href="/article/2492.htm" title="Hadoop-- 海量文件的分布式计算处理方案" target="_blank">Hadoop-- 海量文件的分布式计算处理方案</a> <span class="text-muted">datamachine</span> <a class="tag" taget="_blank" href="/search/mapreduce/1.htm">mapreduce</a><a class="tag" taget="_blank" href="/search/hadoop/1.htm">hadoop</a><a class="tag" taget="_blank" href="/search/%E5%88%86%E5%B8%83%E5%BC%8F%E8%AE%A1%E7%AE%97/1.htm">分布式计算</a> <div>csdn的一个关于hadoop的分布式处理方案，存档。原帖：http://blog.csdn.net/calvinxiu/article/details/1506112。 Hadoop 是Google MapReduce的一个Java实现。MapReduce是一种简化的分布式编程模式，让程序自动分布到一个由普通机器组成的超大集群上并发执行。就如同ja</div> </li> <li><a href="/article/2619.htm" title="以資料庫驗證登入" target="_blank">以資料庫驗證登入</a> <span class="text-muted">dcj3sjt126com</span> <a class="tag" taget="_blank" href="/search/yii/1.htm">yii</a> <div>以資料庫驗證登入由於 Yii 內定的原始框架程式, 採用綁定在UserIdentity.php 的 demo 與 admin 帳號密碼: public function authenticate() { $users=array( &nbs</div> </li> <li><a href="/article/2746.htm" title="github做webhooks：[2]php版本自动触发更新" target="_blank">github做webhooks：[2]php版本自动触发更新</a> <span class="text-muted">dcj3sjt126com</span> <a class="tag" taget="_blank" href="/search/github/1.htm">github</a><a class="tag" taget="_blank" href="/search/git/1.htm">git</a><a class="tag" taget="_blank" href="/search/webhooks/1.htm">webhooks</a> <div>上次已经说过了如何在github控制面板做查看url的返回信息了。这次就到了直接贴钩子代码的时候了。工具/原料 git github 方法/步骤在github的setting里面的webhooks里把我们的url地址填进去。钩子更新的代码如下： error_reportin</div> </li> <li><a href="/article/2873.htm" title="Eos开发常用表达式" target="_blank">Eos开发常用表达式</a> <span class="text-muted">蕃薯耀</span> <a class="tag" taget="_blank" href="/search/Eos%E5%BC%80%E5%8F%91/1.htm">Eos开发</a><a class="tag" taget="_blank" href="/search/Eos%E5%85%A5%E9%97%A8/1.htm">Eos入门</a><a class="tag" taget="_blank" href="/search/Eos%E5%BC%80%E5%8F%91%E5%B8%B8%E7%94%A8%E8%A1%A8%E8%BE%BE%E5%BC%8F/1.htm">Eos开发常用表达式</a> <div>Eos开发常用表达式 >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> 蕃薯耀 2014年8月18日 15:03:35 星期一 &</div> </li> <li><a href="/article/3000.htm" title="SpringSecurity3.X--SpEL 表达式" target="_blank">SpringSecurity3.X--SpEL 表达式</a> <span class="text-muted">hanqunfeng</span> <a class="tag" taget="_blank" href="/search/SpringSecurity/1.htm">SpringSecurity</a> <div>使用 Spring 表达式语言配置访问控制，要实现这一功能的直接方式是在<http>配置元素上添加 use-expressions 属性： <http auto-config="true" use-expressions="true"> 这样就会在投票器中自动增加一个投票器：org.springframework</div> </li> <li><a href="/article/3127.htm" title="Redis vs Memcache" target="_blank">Redis vs Memcache</a> <span class="text-muted">IXHONG</span> <a class="tag" taget="_blank" href="/search/redis/1.htm">redis</a> <div>1. Redis中，并不是所有的数据都一直存储在内存中的，这是和Memcached相比一个最大的区别。 2. Redis不仅仅支持简单的k/v类型的数据，同时还提供list，set，hash等数据结构的存储。 3. Redis支持数据的备份，即master-slave模式的数据备份。 4. Redis支持数据的持久化，可以将内存中的数据保持在磁盘中，重启的时候可以再次加载进行使用。 Red</div> </li> <li><a href="/article/3254.htm" title="Python - 装饰器使用过程中的误区解读" target="_blank">Python - 装饰器使用过程中的误区解读</a> <span class="text-muted">kvhur</span> <a class="tag" taget="_blank" href="/search/JavaScript/1.htm">JavaScript</a><a class="tag" taget="_blank" href="/search/jquery/1.htm">jquery</a><a class="tag" taget="_blank" href="/search/html5/1.htm">html5</a><a class="tag" taget="_blank" href="/search/css/1.htm">css</a> <div>大家都知道装饰器是一个很著名的设计模式，经常被用于AOP(面向切面编程)的场景，较为经典的有插入日志，性能测试，事务处理，Web权限校验， Cache等。原文链接：http://www.gbtags.com/gb/share/5563.htm Python语言本身提供了装饰器语法（@），典型的装饰器实现如下： @function_wrapper de</div> </li> <li><a href="/article/3381.htm" title="架构师之mybatis-----update 带case when 针对多种情况更新" target="_blank">架构师之mybatis-----update 带case when 针对多种情况更新</a> <span class="text-muted">nannan408</span> <a class="tag" taget="_blank" href="/search/case+when/1.htm">case when</a> <div>1.前言. 如题. 2. 代码. <update id="batchUpdate" parameterType="java.util.List"> <foreach collection="list" item="list" index=&</div> </li> <li><a href="/article/3508.htm" title="Algorithm算法视频教程" target="_blank">Algorithm算法视频教程</a> <span class="text-muted">栏目记者</span> <a class="tag" taget="_blank" href="/search/Algorithm/1.htm">Algorithm</a><a class="tag" taget="_blank" href="/search/%E7%AE%97%E6%B3%95/1.htm">算法</a> <div>课程：Algorithm算法视频教程百度网盘下载地址： http://pan.baidu.com/s/1qWFjjQW 密码: 2mji 程序写的好不好,还得看算法屌不屌！Algorithm算法博大精深。一、课程内容：课时1、算法的基本概念 + Sequential search 课时2、Binary search 课时3、Hash table 课时4、Algor</div> </li> <li><a href="/article/3635.htm" title="C语言算法之冒泡排序" target="_blank">C语言算法之冒泡排序</a> <span class="text-muted">qiufeihu</span> <a class="tag" taget="_blank" href="/search/c/1.htm">c</a><a class="tag" taget="_blank" href="/search/%E7%AE%97%E6%B3%95/1.htm">算法</a> <div>任意输入10个数字由小到大进行排序。代码： #include <stdio.h> int main() { int i,j,t,a[11]; /*定义变量及数组为基本类型*/ for(i = 1;i < 11;i++){ scanf("%d",&a[i]); /*从键盘中输入10个数*/ } for</div> </li> <li><a href="/article/3762.htm" title="JSP异常处理" target="_blank">JSP异常处理</a> <span class="text-muted">wyzuomumu</span> <a class="tag" taget="_blank" href="/search/Web/1.htm">Web</a><a class="tag" taget="_blank" href="/search/jsp/1.htm">jsp</a> <div>1.在可能发生异常的网页中通过指令将HTTP请求转发给另一个专门处理异常的网页中: <%@ page errorPage="errors.jsp"%> 2.在处理异常的网页中做如下声明： errors.jsp: <%@ page isErrorPage="true"%>，这样设置完后就可以在网页中直接访问exc</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.  </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>

html 基础学习笔记

html标签 基础学习笔记

一、web和internet

1.1、Internet简介

1.2、Web简介

1.3、web的工作原理

1.4、Web服务器

1.5、服务端技术

1.6、客户端技术

二、HTML

2.1、超文本

2.2、什么是HTML

2.3、标记语法

2.4、元素

2.5、元素嵌套

2.6、属性和值

2.7、注释

2.8、文档结构

三、元素标签

3.1、头部标签/元素

html标签基础学习笔记