@德玛玩前端

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/1950233199242178560.htm" title="x86-64汇编语言训练程序与实战" target="_blank">x86-64汇编语言训练程序与实战</a> <span class="text-muted">十除以十等于一</span> <div>本文还有配套的精品资源，点击获取简介：汇编语言是一种低级语言，与机器代码紧密相关，特别适用于编写系统级代码及性能要求高的应用。nasm编译器是针对x86和x86-64架构的汇编语言编译器，支持多种语法风格和指令集。项目Euler提供数学和计算机科学问题，鼓励编程技巧应用，前100个问题的答案可共享。x86-64架构扩展了寄存器数量并引入新指令，提升了数据处理效率。学习汇编语言能够深入理解计算机底层</div> </li> <li><a href="/article/1950233072825856000.htm" title="三菱PLC全套学习资料及应用手册" target="_blank">三菱PLC全套学习资料及应用手册</a> <span class="text-muted">good2know</span> <div>本文还有配套的精品资源，点击获取简介：三菱PLC作为工业自动化领域的核心设备，其系列产品的学习和应用需要全面深入的知识。本次资料包为学习者提供从基础到进阶的全方位学习资源，包括各种型号PLC的操作手册、编程指南、软件操作教程以及实际案例分析，旨在帮助用户系统掌握PLC的编程语言、指令系统及在各类工业应用中的实施。1.三菱PLC基础知识入门1.1PLC的基本概念可编程逻辑控制器（PLC）是工业自动化</div> </li> <li><a href="/article/1950232820773351424.htm" title="移动端城市区县二级联动选择功能实现包" target="_blank">移动端城市区县二级联动选择功能实现包</a> <span class="text-muted">good2know</span> <div>本文还有配套的精品资源，点击获取简介：本项目是一套为移动端设计的jQuery实现方案，用于简化用户在选择城市和区县时的流程。它包括所有必需文件：HTML、JavaScript、CSS及图片资源。通过动态更新下拉菜单选项，实现城市到区县的联动效果，支持数据异步加载。开发者可以轻松集成此功能到移动网站或应用，并可基于需求进行扩展和优化。1.jQuery移动端解决方案概述jQuery技术简介jQuery</div> </li> <li><a href="/article/1950232782412247040.htm" title="日更006 终极训练营day3" target="_blank">日更006 终极训练营day3</a> <span class="text-muted">懒cici</span> <div>人生创业课（2）今天的主题：学习方法一：遇到有用的书，反复读，然后结合自身实际，列践行清单，不要再写读书笔记思考这本书与我有什么关系，我在哪些地方能用到，之后我该怎么用方法二：读完书没映像怎么办?训练你的大脑，方法：每读完一遍书，立马合上书，做一场分享，几分钟都行对自己的学习要求太低，要逼自己方法三：学习深度不够怎么办？找到细分领域的榜样，把他们的文章、书籍、产品都体验一遍，成为他们的超级用户，向</div> </li> <li><a href="/article/1950232190038110208.htm" title="day15｜前端框架学习和算法" target="_blank">day15｜前端框架学习和算法</a> <span class="text-muted">universe_01</span> <a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/%E7%AE%97%E6%B3%95/1.htm">算法</a><a class="tag" taget="_blank" href="/search/%E7%AC%94%E8%AE%B0/1.htm">笔记</a> <div>T22括号生成先把所有情况都画出来，然后（在满足什么情况下）把不符合条件的删除。T78子集要画树状图，把思路清晰。可以用暴力法、回溯法和DFS做这个题DFS深度搜索：每个边都走完，再回溯应用：二叉树搜索，图搜索回溯算法=DFS+剪枝T200岛屿数量（非常经典BFS宽度把树状转化成队列形式，lambda匿名函数“一次性的小函数，没有名字”setup语法糖：让代码更简洁好写的语法ref创建：基本类型的</div> </li> <li><a href="/article/1950231381485350912.htm" title="《极简思维》第三部分" target="_blank">《极简思维》第三部分</a> <span class="text-muted">小洋苏兮</span> <div>整理你的人际关系如何改善人际关系？摘录：因为人际关系问题是人们生活中不快乐的主要原因。感想：感觉这个说的挺对，之前我总是埋头学习，不管舍友不管自己的合作伙伴的一些事情，但实际上，这学期关注了之后好多了摘录：“亲密关系与社交会让你健康而快乐。这是基础。太过于关注成就或不太关心人际关系的人都不怎么快乐。基本上来说，人类就是建立在人脉关系上的。”感想：但是如果有时想的太多就不太好，要以一个开放的心态跟别</div> </li> <li><a href="/article/1950230873060208640.htm" title="你要记住，最重要的是:随时做好准备，为了你可能成为更好的自己，放弃现在的自己。" target="_blank">你要记住，最重要的是:随时做好准备，为了你可能成为更好的自己，放弃现在的自己。</a> <span class="text-muted">霖霖z</span> <div>打卡人:周云日期:2018年11月09日【日精进打卡第180天】【知～学习】《六项精进》0遍共214遍《通篇》1遍共106遍《大学》2遍共347遍《坚强工作，温柔生活》ok《不抱怨的世界》104-108页《经典名句》你要记住，最重要的是:随时做好准备，为了你可能成为更好的自己，放弃现在的自己。【行～实践】一、修身：（对自己个人）1、坚持打卡二、齐家：（对家庭和家人）打扫卫生，接送孩子，洗衣做饭，陪</div> </li> <li><a href="/article/1950229986984128512.htm" title="贫穷家庭的孩子考上985以后会怎样？" target="_blank">贫穷家庭的孩子考上985以后会怎样？</a> <span class="text-muted">Mellisa蜜思言</span> <div>我出生在一个贫穷的农村家庭，据我妈说，我出生的时候才4斤多，而她生完我以后月子里就瘦到70斤。家里一直很穷，父母都是在菜市场卖菜的，家里还有几亩地种庄稼的。我很小开始就要去帮忙，暑假的生活就是帮忙去卖菜和割稻谷，那时候自己对于割稻谷这种事情有着莫名的恐惧，生怕自己长大以后还是每年都要过着割稻谷这种日子。父母因为忙于生计无暇顾及我的学习，幸好我因为看到他们这样子的生活，内心里有深深的恐惧感，驱使着我</div> </li> <li><a href="/article/1950227573938122752.htm" title="2019-06-05" target="_blank">2019-06-05</a> <span class="text-muted">第十七把巴鲁克</span> <div>今天去实验田里实习，见到了福寿螺真的可怕且牛皮，六级也快来了，说实话还是害怕。我昨天考了环工原理，真的太难了，太烦了，理工科真的难，烦。实验报告还是没写，要抓紧速度抓紧时间，还是应该学会努力学习，远离一些不上进的事物。</div> </li> <li><a href="/article/1950225381961297920.htm" title="SpringMVC的执行流程" target="_blank">SpringMVC的执行流程</a> <span class="text-muted"></span> <div>1、什么是MVCMVC是一种设计模式。MVC的原理图如下所示M-Model模型（完成业务逻辑：有javaBean构成，service+dao+entity）V-View视图（做界面的展示jsp，html……）C-Controller控制器（接收请求—>调用模型—>根据结果派发页面2、SpringMVC是什么SpringMVC是一个MVC的开源框架，SpringMVC=Struts2+Spring，</div> </li> <li><a href="/article/1950223878005518336.htm" title="为什么焦虑、抑郁、自残的青少年越来越多？" target="_blank">为什么焦虑、抑郁、自残的青少年越来越多？</a> <span class="text-muted">精神健康</span> <div>很多家长觉得没缺孩子吃的穿的，他们有安稳的生活，他们有什么可焦虑、抑郁的，但现在的孩子，学习压力越来越大，每天休息的时间越来越少，出现焦虑抑郁是很正常的。从发展的角度看，青少年时期，人的身体、情绪，智力、人格都急剧发展，正从未成熟走向成熟，情绪起伏不定，易冲动，再者，由于缺乏生活经验，以及来自于家长、学校、社会的各种要求和压力，从而不知所措，心中的焦虑、恐惧、彷徨得不到及时的排解，从而导致心理上的</div> </li> <li><a href="/article/1950222857124507648.htm" title="读书打卡《别想太多啦》" target="_blank">读书打卡《别想太多啦》</a> <span class="text-muted">chenchen_68ed</span> <div>第一，世间之事，不去尝试永远不知道其中的奥秘，在尝试中有失败是必然的。如果担心失败，那什么都学不会。第二，经历的失败越多，越会对失败者抱有宽容的态度，“原来如此，我也经历过类似的失败啦，那只是暂时的”。经历越多失败的长者，越能包容别人，这也就是所谓的“越年长越宽容”。成熟的人，就是在众多失败经历中不断学习，并接纳别人的失败。对于他人的小小过失不吹毛求疵，自己的心态会更加平和。在不断失败中学习，让自</div> </li> <li><a href="/article/1950222602781913088.htm" title="2023-01-26" target="_blank">2023-01-26</a> <span class="text-muted">胡喜平</span> <div>我觉得《可见的学习》一书确实从底层逻辑说清楚了，教学的本质。可是太多术语和概念，一时间难以消化啊。而且知道和懂得有距离，运用就更不行了，需要高手和专家的指导。我需要多听听新课标的讲座了，来反复印证。读论文也有了一点点灵感，明天修改我的论文。</div> </li> <li><a href="/article/1950221204333850624.htm" title="平静得接受自己的笨拙 20190118 晨间日记" target="_blank">平静得接受自己的笨拙 20190118 晨间日记</a> <span class="text-muted">吴伯符</span> <div>图片发自App最近做了一个关于微习惯的分享，这里有八个字：微量开始，超额完成。这里的言下之意其实是要你在一开始的时候，平静地接受自己的笨拙。接受自己的笨拙，理解自己的笨拙，放慢速度尝试，观察哪里可以改进，再反复练习，观察自己哪里可以再进一步改进，再反复…这是学习一切技能的必须的过程。这里的两个关键点是：1.尽快的开始这个过程，这就能够用到微习惯的微量开始。2.尽快的度过这个过程，这就需要用到超额完</div> </li> <li><a href="/article/1950220179610857472.htm" title="【花了N长时间读《过犹不及》，不断练习，可以越通透】" target="_blank">【花了N长时间读《过犹不及》，不断练习，可以越通透】</a> <span class="text-muted">君君Love</span> <div>我已经记不清花了多长时间去读《过犹不及》，读书笔记都写了42页，这算是读得特别精细的了。是一本难得的好书，虽然书中很多内容和圣经吻合，我不是基督徒，却觉得这样的文字值得细细品味，和我们的生活息息相关。我是个界线建立不牢固的人，常常愧疚，常常害怕他人的愤怒，常常不懂拒绝，还有很多时候表达不了自己真实的感受，心里在说不嘴里却在说好……这本书给我很多的启示，让我学会了怎样去建立属于自己的清晰的界限。建立</div> </li> <li><a href="/article/1950219924043526144.htm" title="二十四节气组诗谷雨" target="_blank">二十四节气组诗谷雨</a> <span class="text-muted">离陌_6639</span> <div>图片来源网络，若侵犯了你的权益，请联系我删除6.谷雨文/离陌背上行囊背上如行囊的我从此任行程马不停蹄今天家乡的田野春雨快马加鞭播下希望的种子观音不语目送着我和夏天一道在观音山出关图片来源网络，若侵犯了你的权益，请联系我删除你好啊，我是离陌，已然在懵懂中走过了16年的岁月，为了珍惜当下的每一秒，所以立志做一名终身学习者。文学对于我来说是一种信仰，诗歌是我的生命。人生之道，四通八达，即入文学，自当持之</div> </li> <li><a href="/article/1950219036667211776.htm" title="你好，2020年" target="_blank">你好，2020年</a> <span class="text-muted">瑄瑄妍妍的妈咪</span> <div>早上好，今天是2020年的第一天，也就是元旦，新年新的一天开始了。新的开始，重新规划未来的一年。从今天开始，用了一个新的记账软件，之前的随手记软件，也没有删除，只是重新下载了一个别的软件，开始一个新的记账旅程，对于理财开支，有个新的规划。通过小红书视频软件，学习了不少育儿知识，和各种不同的美食，以后动手制作，给宝宝做健康美味的营养餐。学习方面，继续学英语吧！虽然是抽出时间学的，进度也比较慢，但是积</div> </li> <li><a href="/article/1950218819616174080.htm" title="基于redis的Zset实现作者的轻量级排名" target="_blank">基于redis的Zset实现作者的轻量级排名</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/redis/1.htm">redis</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/%E7%BC%93%E5%AD%98/1.htm">缓存</a> <div>基于redis的Zset实现轻量级作者排名系统在今天的技术架构中，Redis是一种广泛使用的内存数据存储系统，尤其在需要高效检索和排序的场景中表现优异。在本篇博客中，我们将深入探讨如何使用Redis的有序集合（ZSet）构建一个高效的笔记排行榜系统，并提供相关代码示例和详细的解析。1.功能背景与需求假设我们有一个笔记分享平台，用户可以发布各种笔记，系统需要根据用户发布的笔记数量来生成一个实时更新的</div> </li> <li><a href="/article/1950216170401492992.htm" title="常规笔记本和加固笔记本的区别" target="_blank">常规笔记本和加固笔记本的区别</a> <span class="text-muted">luchengtech</span> <a class="tag" taget="_blank" href="/search/%E7%94%B5%E8%84%91/1.htm">电脑</a><a class="tag" taget="_blank" href="/search/%E4%B8%89%E9%98%B2%E7%AC%94%E8%AE%B0%E6%9C%AC/1.htm">三防笔记本</a><a class="tag" taget="_blank" href="/search/%E5%8A%A0%E5%9B%BA%E8%AE%A1%E7%AE%97%E6%9C%BA/1.htm">加固计算机</a><a class="tag" taget="_blank" href="/search/%E5%8A%A0%E5%9B%BA%E7%AC%94%E8%AE%B0%E6%9C%AC/1.htm">加固笔记本</a> <div>在现代科技产品中，笔记本电脑因其便携性和功能性被广泛应用。根据使用场景和需求的不同，笔记本可分为常规笔记本和加固笔记本，二者在多个方面存在显著区别。适用场景是区分二者的重要标志。常规笔记本主要面向普通消费者和办公人群，适用于家庭娱乐、日常办公、学生学习等相对稳定的室内环境。比如，人们在家用它追剧、处理文档，学生在教室用它完成作业。而加固笔记本则专为特殊行业设计，像军事、野外勘探、工业制造、交通运输</div> </li> <li><a href="/article/1950215728720310272.htm" title="《云襄传》：云襄做的局是浑水摸鱼吗？" target="_blank">《云襄传》：云襄做的局是浑水摸鱼吗？</a> <span class="text-muted">书生号贺</span> <div>云襄入南都是要浑水摸鱼吗？他是云台的高材生吗？他为啥笃定师父一定会让他留在南都？他为啥觉得他能够做局成功？他是在经商吗？还是在经营人心与欲望？云襄是云台弟子，云台属千门的一支，另一支叫凌渊，云台教人经商之道，重智慧，凌渊以武力取胜，但倍受打压。云襄学习十五年，下高山奔越州，途经南洋，因恩人闻聪被害，囚于白驹镇，念于情分，被卷入这样一个局面里，结识了舒亚南与金十两，于是，复仇小组成立，目标是南都漕帮</div> </li> <li><a href="/article/1950214458265628672.htm" title="心力践行营十二期一阶学习打卡" target="_blank">心力践行营十二期一阶学习打卡</a> <span class="text-muted">LX_王彤彤</span> <div>姓名：王彤彤时间：2021年4月24日一：朗读师父的十大人生哲学二：师父的早安分享感悟很喜欢这句话：所有的行动都是基于目标的尝试，没有所谓的失败，只是不同尝试后得到的不同结果，让我们更好地调整下一次的行动。三：感恩日记1.我太幸福了，我很感恩姑姑，因为姑姑放假又投喂了我，还给我带了饺子回家，这让我感觉很幸福。谢谢，谢谢，谢谢。2.我太幸福了，我很感恩师父晚上的直播，因为听他的分享我知道怎么更好的去</div> </li> <li><a href="/article/1950214205252628480.htm" title="为了在未来的人工智能世界中取得成功，学生们必须学习人类写作的优点" target="_blank">为了在未来的人工智能世界中取得成功，学生们必须学习人类写作的优点</a> <span class="text-muted">睿邸管家</span> <div>澳大利亚各地的学生在新学年开始使用铅笔、钢笔和键盘学习写字。在工作场所，机器也在学习写作，如此有效，几年之内，它们可能会写得比人类更好。有时它们已经做到了，就像Grammarly这样的应用程序所展示的那样。当然，人类现在的日常写作可能很快就会由具有人工智能(AI)的机器来完成。手机和电子邮件软件常用的预测文本是无数人每天都在使用的一种人工智能写作形式。据AI行业研究机构称，到2022年，人工智能及</div> </li> <li><a href="/article/1950213901765373952.htm" title="7月29日星期二今日早报简报微语报早读" target="_blank">7月29日星期二今日早报简报微语报早读</a> <span class="text-muted">微语早读</span> <a class="tag" taget="_blank" href="/search/%E7%94%9F%E6%B4%BB/1.htm">生活</a> <div>7月29日星期二，农历闰六月初五，早报#微语早读。1、国家育儿补贴方案公布！3周岁前每娃每年3600元；2、火狐浏览器官宣关闭北京公司，将终止中国账户服务；3、税务总局：2021年以来查处网络主播偷逃税案件360余起，查补税款30多亿元；4、江苏省体育局：职业俱乐部获男足中超冠军奖补3000万元；5、深圳出现首宗基孔肯雅热病例；6、税务总局：从今年个税汇算看，超1亿纳税人依法申请退税1300多亿，</div> </li> <li><a href="/article/1950213434863841280.htm" title="闭组进行时..." target="_blank">闭组进行时...</a> <span class="text-muted">李亚青_强化班</span> <div>今天是2019年12月1号距离开始三月学习的日子:2019年10月07,已经过去将近两个月，回顾这一阶段的学习，收获了什么?又学会了什么呢?图片发自App我想，收获最大的就是身边这一群人吧,有和蔼可亲的学姐，贴心的学长，嬉戏打闹，玩的不亦乐乎，但也同样认真踏实学习小伙伴图片发自App本以为在这样的时刻，有太多太多话，太多太多想法想要表达，可言到此处，又觉得似乎没有什么想要说的了还是那句话，幸运遇到</div> </li> <li><a href="/article/1950213052171350016.htm" title="2021-10-23" target="_blank">2021-10-23</a> <span class="text-muted">赵甄文的幸福</span> <div>秀荣感恩日记Day42[烟花]感恩语录感恩自己有能力有好身体，可以到处走动，做自己想做的事情10.23感恩日记今天做的事情瑜伽一小时户外散步一小时泡脚20分钟学习打卡和孩子沟通[爱心]感动的瞬间今天瑜伽回来，发现老公在厨房里做鱼。每次老公有时间休息的时候都会给我做硬菜。刘姐约我一起去公园散步晒太阳。虽然完美错过，但心里还是暖暖的。每天睁开眼打开手机，先去自己的群里逛一逛，每每发现有人点赞或者互动都</div> </li> <li><a href="/article/1950212797946195968.htm" title="孤独的守候" target="_blank">孤独的守候</a> <span class="text-muted">怒吼的生命</span> <div>孤独了时光岁月了寂寞带来了惆怅那些孤独的日子里我们珍惜奋斗起来品味人生的真谛做到更好奋斗当中的你是那么努力格外自律学习起来五彩斑斓那些日子时光匆匆人生的机会很多需要把握痛苦的回忆记得住那些忧愁孤苦五一的日子寂寞当中的你时光荏苒独自带给我荒草学习起来努力奋斗可是我们做的还不够把握发展生活带给我们更多希望静静的述说你的故事你的精彩人生当中我们总是努力把握生活带给我们更多的学习生活当中我们奋斗可是做的还</div> </li> <li><a href="/article/1950210374787723264.htm" title="第八课: 写作出版你最关心的出书流程和市场分析（无戒学堂复盘）" target="_blank">第八课: 写作出版你最关心的出书流程和市场分析（无戒学堂复盘）</a> <span class="text-muted">人在陌上</span> <div>今天是周六，恰是圣诞节。推掉了两个需要凑腿的牌局，在一个手机，一个笔记本，一台电脑，一杯热茶的陪伴下，一个人静静地回听无戒学堂的最后一堂课。感谢这一个月，让自己的习惯开始改变，至少，可以静坐一个下午而不觉得乏味枯燥难受了，要为自己点个赞。我深知，这最后一堂课的内容，以我的资质和毅力，可能永远都用不上。但很明显，无戒学堂是用了心的，毕竟，有很多优秀学员，已经具备了写作能力，马上就要用到这堂课的内容。</div> </li> <li><a href="/article/1950209368356089856.htm" title="AI模型训练中过拟合和欠拟合的区别是什么？" target="_blank">AI模型训练中过拟合和欠拟合的区别是什么？</a> <span class="text-muted">workflower</span> <a class="tag" taget="_blank" href="/search/%E4%BA%BA%E5%B7%A5%E6%99%BA%E8%83%BD/1.htm">人工智能</a><a class="tag" taget="_blank" href="/search/%E7%AE%97%E6%B3%95/1.htm">算法</a><a class="tag" taget="_blank" href="/search/%E4%BA%BA%E5%B7%A5%E6%99%BA%E8%83%BD/1.htm">人工智能</a><a class="tag" taget="_blank" href="/search/%E6%95%B0%E6%8D%AE%E5%88%86%E6%9E%90/1.htm">数据分析</a> <div>在AI模型训练中，过拟合和欠拟合是两种常见的模型性能问题，核心区别在于模型对数据的学习程度和泛化能力：欠拟合（Underfitting）-定义：模型未能充分学习到数据中的规律，对训练数据的拟合程度较差，在训练集和测试集上的表现都不好（如准确率低、损失值高）。-原因：-模型结构过于简单（如用线性模型解决非线性问题）；-训练数据量不足或特征信息不充分；-训练时间太短，模型尚未学到有效模式。-表现：训练</div> </li> <li><a href="/article/1950208989954371584.htm" title="Selenium 特殊控件操作与 ActionChains 实践详解" target="_blank">Selenium 特殊控件操作与 ActionChains 实践详解</a> <span class="text-muted">小馋喵知识杂货铺</span> <a class="tag" taget="_blank" href="/search/selenium/1.htm">selenium</a><a class="tag" taget="_blank" href="/search/%E6%B5%8B%E8%AF%95%E5%B7%A5%E5%85%B7/1.htm">测试工具</a> <div>1.下拉框单选操作(a)使用SeleniumSelect类（标准HTML标签）Selenium提供了内置的Select类用于操作标准下拉框，这种方式简单且直观。fromselenium.webdriver.support.uiimportSelect#定位下拉框dropdown=Select(driver.find_element("id","dropdown_id"))#通过以下三种方式选择单个</div> </li> <li><a href="/article/1950208983868436480.htm" title="2018-08-29精进打卡" target="_blank">2018-08-29精进打卡</a> <span class="text-muted">米兰王</span> <div>姓名:王兰英【日精进打卡第25天】【知～学习】《六项精进》1遍共39遍《大学》1遍共50遍【经典名句分享】一切都是最好的安排。【行～实践】一、修身：（对自己个人）1，散步1小时。2，每天坚持读书。二、齐家：（对家庭和家人）1，指导孩子开车。2，和家人一起逛超市。三、建功：（对工作）用心做好每件事。｛积善｝：发愿从2018年8月5日起1年内365个善事。今日1善，累计27善。【省～觉悟】正人先正己。</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标签基础学习笔记