Annuo、

WEB开发零基础到入门之HTML+CSS(学习记录)

序言

之前一直想把自己的一个学习记录,以文章形式记录下来,方便于自己后期查找和温故.自己想了想准备建个人博客站来做记录,但是又想到了csdn的大家庭；所以就放弃了用个人站记录的想法，关于这里简单说明下web应用开发学习具体记录方向；

HTML/CSS→Javascript→Jquery→PHP→框架设计→mysql→Linux

关于框架设计这块我个人先推荐一款比较适合新手学习的YDTDPHP框架；推荐目的不是为了让你必须去看懂,必须就会立刻自己设计出来,而是对于一起初步的前期了解,相对于后面的学习更有助；(该框架也是于2018年低-19年个人所完成的)!

本教程不少案例来源于菜鸟及w3c,或者互联网其它地方如！

本文章目录

为什么从事web开发

什么样的人适合做web开发

学习过程中需要注意什么

有耐心

知行合一

本教程的优点

web应用开发结构：

web应用

web应用概念

网站

网页

web请求

web应用开发结构

开发工具/环境

PhpStorm

Sublime Text

picpick

git

PhpStudy

navicat

Xshell

8uFtp

SourceTree

展现层面（HTML/CSS）

HTML简介

一、网页的构成

展现形式上的构成

代码结构上的构成

二、什么是 HTML

三、如何创建一个HTML文档

四、自己的第一个页面

HTML基础

一、HTML页面主体结构

二、HTML语法结构

1、 HTML标签

2、HTML属性

3、元素

三、HTML注释

四、常用头部标签的含义

五、常见字体标签

标题字(最大)

HTML编码

一、字符编码

常用字符编码

二、乱码产生的原因

HTML链接

一、a标签

普通链接

锚链接

HTML图像

一、img标签

二、图片知识

三、路径知识

绝对路径

相对路径

HTML列表

无序列表

有序列表

定义列表

HTML表单

常用表单元素

input标签共有的一些属性

radio单选和checkbox多选

select元素（下拉列表）

label标签

HTML表格

跨行或跨列的表格单元格

跨列

跨行

表格中的空单元格

HTML 实体

HTML 中有用的字符实体

HTML框架

实现思路

应用场景

缺点

一、 frameset

二、 iframe

在开始整个教程记录前聊聊关于WEB行业的行情：

为什么从事web开发

随着互联网的发展，越来越多的传统企业把产品服务都搬到互联网。而这些企业都需要做web应用，导致这方面的人才需求也随着增加，工资待遇屡创新高。从短期来讲，互联网都是属于上升阶段，所以需求量还是在不断的增加，通过招聘平台得来的数据，单纯北上广这三个地方，日招聘需求量就是高达3万+。

什么样的人适合做web开发

到底是什么样的人适合做开发，并没有绝对的事。任何人都是从不会到会的过程。所以不能说你就不能做开发，其它人就可以做开发。只是说如果有以下条件的朋友，学开发会相对比其它同学容易些。

有其它开发语言基础的。语言都是有共性的，如果有其它语言基础，学起来会容易很多。

英语比较好的，web开发使用的是英语，很多函数通过函数名就可以大概的了解函数的作用，另外特别多的技术文档是英语，所以英语好的人比较有优势。

有计算机基础的，当然如果了解计算机原理的人更好。还有打键盘速度要快，不要一指禅(所谓一指弹就是一个手指头看半天键盘点一下的)。

理科生，对数据比较敏感。在做数据处理时比较有优势。

逻辑能力比较好。业务开发中，离不开对流程的控制。逻辑能力比较好的朋友，思路清晰，效率高。

万事没有绝对的事，并不是说没有以上条件的朋友就不能学，只是可能需要花比大家更多多的时间和精力。

学习过程中需要注意什么

有耐心

很多朋友包括我自己身边的朋友(我推荐去学习)刚开始学习，三分钟热度，(当然我也在高中和大学期间也是自学和在某在线教育机构平台学习也是三分钟热度,可是我现在面临的是毕业,面临出校园后关于自己的未来选择,没办法我开始给自己下更多的功夫每天大概就睡了3-4小时,目的就是为了多学习我还不知道的东西还不能熟练运用的东西)学习一段时间就放松或者放弃，从事开发需要做事认真,有耐性,能耐的住寂寞(这是我之前在教育机构上学习时候老师说的话)。

知行合一

学的过程中，很多人以为自己懂了，但是让自己做又做不出来，知道是一回事，能做出来又是一会事，经验是通过实践积累出来的，纸上谈兵的人大把，想脱颖而出，那么你就得比别人做得更好。看一万遍不如练一遍。古言："读书万卷书，行万里路"；平时多看看大牛分享的干货或站点内的基础视频等之类,但是不能只是看看必须练，因为这东西你不练只是看看,那永远不会有进步的空间！要让自己亲身体验,让你的手指和大脑灵活运用起来！

本教程的优点

1.常用的，不照本宣科讲大量的理论

2.供快捷易懂的学习内容

3.不需要特意去背

4.提升学习能力，解决问题能力

web应用开发结构：

web应用

Web应用程序是一种可以通过Web访问的应用程序。Web应用程序的一个最大好处是用户很容易访问应用程序。用户只需要有浏览器即可，不需要再安装其他软件。通俗的讲，web应用就是大家通常接触到的网站。
应用程序有两种模式C/S、B/S。C/S是客户端/服务器端程序，也就是说这类程序一般独立运行。而B/S就是浏览器端/服务器端应用程序，这类应用程序一般借助IE等浏览器来运行。WEB应用程序一般是B/S模式。Web应用程序首先是“应用程序”，和用标准的程序语言，如C、C++等编写出来的程序没有什么本质上的不同。然而Web应用程序又有自己独特的地方，就是它是基于Web的，而不是采用传统方法运行的。换句话说，它是典型的浏览器/服务器架构的产物。更多关于WEB应用的了解

web应用概念

网站

网站是构成web的基础，所谓网站(Website)，就是指在网际网络（万维网）上，根据一定的规则，使用HTML等工具制作的用于展示特定内容的相关网页的集合, 同时也是构成web的基础。

网页

网页，是网站中的页面，是构成网站的基础。网页是构成网站的基本元素，是承载各种网站应用的平台。简单来说，网站就是由网页组成的。网页通常是HTML格式（文件扩展名为.html 或.htm或.php或.aspx或.asp或.jsp等）。网页要通过网页浏览器来阅读。在浏览器访问相对应的url（地址）就可以往服务器发给送请求

web请求

当客户端向服务器的程序提出请求时，web服务器根据请求响应对应的页面，当页面中含有php脚本时，服务器会交给PHP解释器进行解释执行，将生成的html代码再回传给客户端，客户端的浏览器解释html代码，最终形成网页格式的页面。

web应用开发结构

如何构建一个一个完整的web应用，需要了解到web应用的主要结构。

展现层面

展现层面指用户可以看到的网页，开发一个网页需要学习（html+css+javascript+jq）,也就是通常讲的前端开发

逻辑/业务层面

接受用户的请求或者数据，进行相关业务流程的处理，这部分需要学习（php或者其它语言java,python,ASP等）;也就是通常讲的后端开发

存储层面

一个完整的应用需要把数据进行存储，读取，需要学习（mysql或者其它数据库SQL Server，mongodb等）。

开发工具/环境

优秀的工具，可以使你的开发工作事半功倍，帮助你创建出高品质的Web应用。以下工具在整个web开发过程中慢慢会用到。

PhpStorm

PhpStorm 是 JetBrains 公司开发的一款商业的 PHP 集成开发工具，旨在提高用户效率，可深刻理解用户的编码，提供智能代码补全，快速导航以及即时错误检查。智能PHP编辑器、JavaScript 编辑器、HTML/CSS编辑器、轻量级IDE、智能的环境、可在Windows, Mac OS X, Linux上运行。
下载地址：https://www.jetbrains.com/phpstorm/

Sublime Text

Sublime Text 是一个轻量、简洁、高效、跨平台的编辑器，方便的配色以及兼容vim快捷键等各种优点博得了很多前端开发人员的喜爱!Sublime Text 2这款程序员必备代码编辑器，几乎每位程序员提到Sublime Text 2都是赞不绝口！它体积小巧，无需安装，绿色便携；它可跨平台支持Windows/Mac/Linux；支持32与64位操作系统，它在支持语法高亮、代码补全、代码片段（Snippet）、代码折叠、行号显示、自定义皮肤、配色方案等所有其它代码编辑器所拥有的功能的同时，又保证了其飞快的速度！(个人推荐Sublime Text)
下载地址：
http://www.sublimetext.com/3

picpick

PicPick是一款免费截图软件，它可以抓取全屏幕或是局部的画面，而且操作也很简单，还具备了一般最常用到的基本图像编辑、屏幕尺、角度、测距、及屏幕演示白板等功能。在前端学习开发中非常有。

git

Git是一款免费、开源的分布式版本控制系统，用于敏捷高效地处理任何或小或大的项目。管理代码时候用到。

PhpStudy

PhpStudy就是Windows Apache Mysql PHP集成安装环境，即在window下的apache、php和mysql的服务器软件。

支持CentOS、Ubuntu、Debian、Fedora、deepin，Web端管理，QQ群及论坛技术支持
一键创建网站、FTP、数据库、SSL；安全管理，计划任务，文件管理，PHP多版本共存及切换；自带LNMP与LAMP

下载地址：https://www.xp.cn/

navicat

强大的数据库管理和设计工具,支持 Win、Mac 和 linux。直观的 GUI 让用户简单地管理 MySQL、MariaDB、SQL Server、SQLite、Oracle 和 PostgreSQL 的数据库。

Xshell

Xshell 是一个强大的安全终端模拟软件，它支持SSH1, SSH2, 以及Microsoft Windows 平台的TELNET 协议。

8uFtp

8UFTP客户端工具,涵盖其它FTP工具所有的功能。8uftp不占内存,体积小,多线程,支持在线解压缩。

SourceTree

SourceTree 是 Windows 和Mac OS X 下免费的 Git 和 Hg 客户端管理工具，同时也是Mercurial和Subversion版本控制系统工具。

展现层面（HTML/CSS）

HTML简介

一、网页的构成

展现形式上的构成

文字，图片和链接是构成一个网页最基本的元素。除此之外，网页的元素还包括表单（控件），表格，动画、音乐、视频等等。

代码结构上的构成

从代码结构上讲，网页的构成就是由html标签组成，我们需要掌握不同的标签分别代表着什么意义，掌握在网页中展现不同的东西分别需要用什么标签。

二、什么是 HTML

HTML 是用来描述网页的一种语言。

HTML 指的是超文本标记语言 (Hyper Text Markup Language)
HTML 不是一种编程语言，而是一种标记语言 (markup language)
标记语言是一套标记标签 (markup tag)
HTML 使用标记标签来描述网页
更多关于HTML的介绍

HTML 文档 = 网页

三、如何创建一个HTML文档

包含HTML标签的文件叫HTML文档，文件扩展名为.html 或.htm等。HTML文档要通过网页浏览器来阅读。浏览器的作用是读取 HTML 文档，并以网页的形式显示出它们。

通过谷歌或者火狐浏览器，我们可以很方便的看HTML文档的源代码或者HTML文档的结构。

通过使用任意文本编辑器直接新建一个文件，文件扩展名为.html 或.htm保存就创建了一个HTML文档。通过浏览器访问这个HTML文件。

HTML是一种描述性的语言，没有逻辑性，所以学习起来非常容易

四、自己的第一个页面




	
	YDTD丶Annuo


	这是我的第一个html页面

**PS：**看到这朋友你有心动了嘛？不妨赶快打开你的编辑器跟着我建立自己的第一个网页，并通过浏览器访问吧！

HTML基础

一、HTML页面主体结构

二、HTML语法结构

1、 HTML标签

所有标签：

http://www.w3school.com.cn/tags/index.asp

https://www.runoob.com/tags/html-reference.html

HTML 标记标签通常被称为 HTML 标签 (HTML tag)。

HTML 标签是由尖括号包围的关键词，比如
HTML 标签通常是成对出现的，比如和
标签对中的第一个标签是开始标签，第二个标签是结束标签
开始和结束标签也被称为开放标签和闭合标签
关于HTML基础标签除了上面给出的菜鸟及W3sc之前我也整理过一篇文章 HTML基础标签用于参考

标记符结束中的标记元素用尖括号括起来，带斜杠的元素表示该标记结束，大多数标记符必须成对使用，以表示作用的起始和结束。

结束标记一定要以"/"结束，引号必须使用英文引号，标签之间不能交叉嵌套，例如YDTD丶Annuo

标签特性

用两个尖括号括起来。
不区分大小写，但推荐采用小写
每个标签都是闭合的
同一标签可以同时拥有N个不同属性】

标签类型

对标签

包含起始标签和结束标签
内容写在对标签中间
属性写在起始标签尖括号内
例如YDTD丶Annuo

单标签

只有一个由尖括号括的标签
属性直接写在标签尖括号内
例如

2、HTML属性

必须放在开始标签里面，属性可以为标签提供更多样化的特性。

3、元素

开始和结束标签连同包含在他们之间内容，我们通常叫做元素

三、HTML注释

注释其实就是对代码的解释说明，在代码书写过程中合理运用注释是十分有必要的。浏览器不会解析注释。说白了，注释是给人看的，不是给浏览器看的。在sulime Text 中，用Ctrl+?可快速的注释。

四、常用头部标签的含义


    
    标题标签

例子解释
编码设置
</code>标题标签，显示在浏览器标签中。<br><code><keywords></code> 关键词，多个关键词用英文逗号隔开。<br><code><description></code> 本篇网页的概述，一段话，对网站的进一步描述。</p> <h2 id="%E4%BA%94%E3%80%81%E5%B8%B8%E8%A7%81%E5%AD%97%E4%BD%93%E6%A0%87%E7%AD%BE">五、常见字体标签</h2> <pre><code class="language-html"><h1>标题字(最大)</h1> <h6>标题字(最小)</h6> <strong>粗体字</strong> <em>斜体字</em> <span>无意义的文字标签 </span> <u>添加下划线</u> <i>斜体</i> <b>加粗</b> </code></pre> <blockquote> <h1 id="%E6%A0%87%E9%A2%98%E5%AD%97(%E6%9C%80%E5%A4%A7)">标题字(最大)</h1> <p>标题字(最小)</p> <strong>粗体字</strong> <br> <em>斜体字</em> <br> 无意义的文字标签 <br> <u>添加下划线</u> <br> <em>斜体</em> <br> <strong>加粗</strong> </blockquote> <hr> <blockquote> <p><strong><strong>**PS：**跟着我建一个完整的html文档，并且把常用的字体标签练习几遍吧。</strong></strong></p> </blockquote> <p style="text-align:center;"></p> <p> </p> <hr> <h1 id="HTML%E7%BC%96%E7%A0%81">HTML编码</h1> <h2 id="%E4%B8%80%E3%80%81%E5%AD%97%E7%AC%A6%E7%BC%96%E7%A0%81">一、字符编码</h2> <p>计算机要准确的处理各种文字，需要进行字符编码，以便计算机能够识别和存储各种文字。<br><strong>案例：</strong></p> <blockquote> <p>在显示器上看见的文字、图片等信息在电脑里面其实并不是我们看见的样子，即使你知道所有信息都存储在硬盘里，把它拆开也看不见里面有任何东西，只有些盘片。假设，你用显微镜把盘片放大，会看见盘片表面凹凸不平，凸起的地方被磁化，凹的地方是没有被磁化；凸起的地方代表数字1，凹的地方代表数字0。硬盘只能用0和1来表示所有文字、图片等信息。那么字母”A”在硬盘上是如何存储的呢？可能小张计算机存储字母”A”是1100001，而小王存储字母”A”是11000010，这样双方交换信息时就会误解。比如小张把1100001发送给小王，小王并不认为1100001是字母”A”，可能认为这是字母”X”，于是小王在用记事本访问存储在硬盘上的1100001时，在屏幕上显示的就是字母”X”。也就是说，小张和小王使用了不同的编码表。（谍战密码本）；</p> </blockquote> <h3 id="%E5%B8%B8%E7%94%A8%E5%AD%97%E7%AC%A6%E7%BC%96%E7%A0%81">常用字符编码</h3> <blockquote> <ul> <li>GBK - 汉字内码扩展规范，兼容GB2312。<br> [danger]* UTF-8 - 万国码（推荐）。</li> <li>关于更多字符编码介绍</li> </ul> </blockquote> <h2 id="%E4%BA%8C%E3%80%81%E4%B9%B1%E7%A0%81%E4%BA%A7%E7%94%9F%E7%9A%84%E5%8E%9F%E5%9B%A0">二、乱码产生的原因</h2> <blockquote> <p>文件存储的字符编码与浏览器在解析的字符编码不一致。</p> </blockquote> <p><strong>网页编码可以理解为两部分：</strong></p> <ol> <li>head头部设置的编码(浏览器在解析的字符编码)</li> <li>网页文件本身的编码</li> </ol> <blockquote> <p>解决乱码也很简单，只需要将两部分编码保持一致即可。</p> </blockquote> <blockquote> <p>使用editplus等编辑器可以查看文件的存储编码。</p> </blockquote> <pre><code class="language-html"><meta charset="编码"></code></pre> <hr> <blockquote> <p>**PS：**建一个HTML文件，以utf-8保存，charset设置为gbk,浏览看是否乱码吧！</p> </blockquote> <p style="text-align:center;"></p> <p> </p> <hr> <h1 id="HTML%E9%93%BE%E6%8E%A5">HTML链接</h1> <blockquote> <p>HTML 使用超级链接与网络上的另一个文档相连。几乎可以在所有的网页中找到链接。点击链接可以从一张页面跳转到另一张页面。超链接可以是一个字，一个词，或者一组词，也可以是一幅图像，您可以点击这些内容来跳转到新的文档或者当前文档中的某个部分。当您把鼠标指针移动到网页中的某个链接上时，箭头会变为一只小手。</p> </blockquote> <h2 id="%E4%B8%80%E3%80%81a%E6%A0%87%E7%AD%BE">一、a标签</h2> <p>Html语法中最重要的标签之一。通过使用 href 属性，创建指向另外一个页面的链。通过使用id 属性，创建一个文档内部的文档片段的书签(可直接跳到文档指定位置--锚链接)。</p> <h3 id="%E6%99%AE%E9%80%9A%E9%93%BE%E6%8E%A5">普通链接</h3> <pre><code class="language-html"><a href="https://www.csdn.net/" target="_blank" title="显示">YDTD丶Annuo</a> </code></pre> <p><strong>例子解释</strong></p> <ul> <li><code>href</code> 属性规定链接的目标</li> <li>YDTD丶Annuo 始标签和结束标签之间的文字被作为超级链接来显示。</li> <li><code>target</code>定义被链接的文档在何处显示,<code>target="_blank"</code>新窗口打开</li> <li><code>title</code>鼠标移过时显示的文字</li> </ul> <h3 id="%E9%94%9A%E9%93%BE%E6%8E%A5">锚链接</h3> <p>给页面当中的某个特定位置添加标记，可以通过a链接直接指向这个位置，经常用在页面内容比较多的情况。我们可以创建直接跳至该命名锚（比如页面中某个小节）的链接，这样使用者就无需不停地滚动页面来寻找他们需要的信息了。</p> <pre><code class="language-html"><div class="d1"> <a href="#mao1">点我跳转mao1</a> <div class="d2"> <a name="mao1">我是mao1</a> </div> </div> </code></pre> <p><strong>例子解释</strong></p> <ul> <li><code><a name="mao1"></code>定义锚点</li> <li><code><a href="#mao1"></code>跳转到mao1这个位置</li> </ul> <blockquote> <p>**PS：**页面中增加a链接，指向CSDN，点击新窗口打开。在页面的底部设置一个锚点，点击跳转到顶部。</p> </blockquote> <p style="text-align:center;"></p> <hr> <h1 id="HTML%E5%9B%BE%E5%83%8F">HTML图像</h1> <blockquote> <p>通过使用 HTML，可以在文档中显示图像。</p> </blockquote> <h2 id="%E4%B8%80%E3%80%81img%E6%A0%87%E7%AD%BE">一、img标签</h2> <pre><code class="language-html"><img src="/images/logo.png" alt="网站LOGO" title="LOGO" width="280" height="140"> </code></pre> <p><strong>例子解释</strong></p> <ul> <li><code>src</code>源属性（src）。src 指 "source"。源属性的值是图像的 URL 地址。</li> <li><code>alt</code>属性用来为图像定义一串预备的可替换的文本，一般用于图片加载失败时的文本提示。</li> <li><code>title</code>鼠标移过时显示的文字。</li> <li><code>width</code>图片宽度。</li> <li><code>height</code>图片高度。</li> </ul> <blockquote> <p>img标签为单标签，没有结束标签</p> <p>关于更多img标签的介绍https://www.runoob.com/html/html-images.html</p> </blockquote> <h2 id="%E4%BA%8C%E3%80%81%E5%9B%BE%E7%89%87%E7%9F%A5%E8%AF%86">二、图片知识</h2> <table> <thead> <tr> <th>格式</th> <th>透明度</th> <th>动画</th> <th>特点</th> <th>适用场景</th> </tr> </thead> <tbody> <tr> <td>JPG/JPEG</td> <td>×</td> <td>×</td> <td>色彩丰富，压缩比高，画质损失小，体积小</td> <td>色彩丰富、要求体积要小</td> </tr> <tr> <td>PNG</td> <td>√</td> <td>×</td> <td>色彩丰富，w，设置任意透明度，体积较小，但比jpg体积大一些。 IE6不支持png图片透明</td> <td>对色彩有特殊要求、需要透明效果</td> </tr> <tr> <td>GIF</td> <td>√</td> <td>√</td> <td>仅支持256种颜色，体积小，只有透明和不透明两种效果</td> <td>图片颜色少、需要透明效果</td> </tr> <tr> <td>BMP</td> <td>×</td> <td>×</td> <td>色彩丰富，画质清晰，但体积偏大</td> <td>不推荐在网页中使用</td> </tr> </tbody> </table> <h2 id="%E4%B8%89%E3%80%81%E8%B7%AF%E5%BE%84%E7%9F%A5%E8%AF%86">三、路径知识</h2> <h3 id="%E7%BB%9D%E5%AF%B9%E8%B7%AF%E5%BE%84">绝对路径</h3> <p>绝对路径就是指带有域名的完整路径。或者从盘符开始，具体的目标位置。<br> 比如"中国北京市朝阳区建国里二巷27号"这就是一个生活动中的经典" 绝对"方式的描述</p> <h3 id="%E7%9B%B8%E5%AF%B9%E8%B7%AF%E5%BE%84">相对路径</h3> <p>相对路径则是从当前目录说起，参照起点为本文件。<br> 相对于本目录<code><a href="./1.html">本目录下页面</a></code>。<br> 相对于上级目录<code><img src="../meinv.jpg" title="YDTD" /></code>。</p> <blockquote> <p>**PS：**试一试在网页中分别会绝对路径和相对路径插入不同的图片。</p> </blockquote> <hr> <h1 id="HTML%E5%88%97%E8%A1%A8">HTML列表</h1> <blockquote> <p>在页面设计中，一系列类似的结构或者数据，可以通过列表的形式来处理。</p> </blockquote> <h2 id="%E6%97%A0%E5%BA%8F%E5%88%97%E8%A1%A8">无序列表</h2> <p>无序列表是一个项目的列表，此列项目使用粗体圆点（典型的小黑圆圈）进行标记。<br> 无序列表始于<code><ul></code> 标签。每个列表项始于<code><li></code> 。</p> <pre><code class="language-html"><ul> <li>钰嵩君</li> <li>情感语录平台</li> </ul> </code></pre> <p><strong>效果如下</strong></p> <ul> <li>钰嵩君</li> <li>情感语录平台</li> </ul> <h2 id="%E6%9C%89%E5%BA%8F%E5%88%97%E8%A1%A8">有序列表</h2> <p>同样，有序列表也是一列项目，列表项目使用数字进行标记。<br> 有序列表始于 <code><ol></code> 标签。每个列表项始于 <code><li></code> 标签。</p> <pre><code class="language-html"><ol> <li>钰嵩君</li> <li>情感语录平台</li> </ol> </code></pre> <p><strong>效果如下</strong></p> <ol> <li>钰嵩君</li> <li>情感语录平台</li> </ol> <h2 id="%E5%AE%9A%E4%B9%89%E5%88%97%E8%A1%A8">定义列表</h2> <p>自定义列表不仅仅是一列项目，而是项目及其注释的组合。<br> 自定义列表以 <code><dl></code> 标签开始。每个自定义列表项以 <code><dt></code> 开始。每个自定义列表项的定义以 <code><dd></code> 开始。</p> <pre><code class="language-html"><dl> <dt>钰嵩君</dt> <dd>简单而深情</dd> <dt>总有一句话</dt> <dd>为你而写</dd> </dl> </code></pre> <p><strong>效果如下</strong></p> <p>钰嵩君</p> <p>简短而深情</p> <p>总有一句话</p> <p>为你而写</p> <blockquote> <p>以上效果都是没有做修饰，为默认效果。实际开发中会以css进行修饰。</p> </blockquote> <hr> <blockquote> <p>**PS：**试着把三种列表都练习几遍，理清结构和写法。</p> </blockquote> <hr> <h1 id="HTML%E8%A1%A8%E5%8D%95">HTML表单</h1> <blockquote> <p>HTML 表单用于搜集不同类型的用户输入,是Web浏览器和Web服务器进行通信的最常用的手段，即通过表单，浏览器不仅能从Web服务器中获得信息，而且还能向Web 服务器反馈信息。HTML为此提供了表单(Form)元素来设计和实现这种交互界面。</p> </blockquote> <h2 id="%E5%B8%B8%E7%94%A8%E8%A1%A8%E5%8D%95%E5%85%83%E7%B4%A0">常用表单元素</h2> <blockquote> <p>表单形成的交互界面上有许多元素，负责收集用户输入的各种信息，这些元素一般称为控件。</p> </blockquote> <ul> <li>单行/多行文本框</li> <li>复选框</li> <li>单选按钮</li> <li>文件域</li> <li>隐藏域</li> <li>下拉菜单</li> <li>提交按钮</li> <li>重置按钮</li> </ul> <pre><code class="language-html"><form method="post" action="">  <input type="text" />  <input type="password" />  <input type="radio" />  <input type="checkbox" />  <input type="hidden" />  <input type="submit" />  <input type="file" />  <input type="reset" />  <input type="button"/>  <textarea></textarea>  <select> <option>下拉1</option> <option>下拉2</option> </select> </form> </code></pre> <p><strong>效果如下：</strong></p> <hr> <h3 id="input%E6%A0%87%E7%AD%BE%E5%85%B1%E6%9C%89%E7%9A%84%E4%B8%80%E4%BA%9B%E5%B1%9E%E6%80%A7"><code>input</code>标签共有的一些属性</h3> <ul> <li>type 控件的类型</li> <li>value 指定默认值</li> <li>name 用于服务器获取数据</li> </ul> <h3 id="radio%E5%8D%95%E9%80%89%E5%92%8Ccheckbox%E5%A4%9A%E9%80%89"><code>radio</code>单选和<code>checkbox</code>多选</h3> <ul> <li>checked 默认的选中项</li> <li>value 该选项被选中后提交到服务器的值</li> <li>name 用于服务器获取数据</li> </ul> <h3 id="select%E5%85%83%E7%B4%A0%EF%BC%88%E4%B8%8B%E6%8B%89%E5%88%97%E8%A1%A8%EF%BC%89"><code>select</code>元素（下拉列表）</h3> <blockquote> <p>HTML是通过<code><select></code>和<code><option></code>标记来定义输入列表框的。列表框标记<code><select></code>是成对出现标记，首标记<code><select></code>和尾标记<code></select></code> 之间的内容就是一个列表框的内容。和<code><option></code>标记用于定义列表框中的各个选项</p> </blockquote> <pre><code class="language-html"><select name="" id="" size="" multiple=""> <option value="">下拉1</option> <option value="">下拉2</option> <option value="" selected="">...</option> <option value="">下拉n</option> </select> </code></pre> <p><strong>例子解析</strong></p> <ul> <li><code>name</code>用于服务器获取数据</li> <li><code>sizesize</code>属性是可选的，用于定义列表框的长度。size属性的参数值是数字，表示显示在列表框中的选项数目。当size属性的参数值小于列表框中的列表项数目时，浏览器会为该列表框添加滚动条，用户可以使用滚动条来查看所有的选项。size属性的缺省值为1。<br> *<code>multiple</code>表示可以多选，如果不设置本属性，那么只能单选；按 Ctrl可以多选. 用法：multiple="multiple"</li> <li><code>value</code>当该项被选中并提交后，web浏览器传送给服务器的数据。缺省时，浏览器将传送选项的内容</li> <li><code>selected</code>用来指定选项的初始状态，表示该选项在初始时是被选中的。</li> </ul> <h2 id="label%E6%A0%87%E7%AD%BE">label标签</h2> <blockquote> <p>用户选择该标签时，浏览器就会自动将焦点转到和标签相关的表单控件上</p> </blockquote> <pre><code class="language-html"><p>请点击文本标记之一，就可以触发相关控件：</p> <form> <label for="male">Male</label> <input type="radio" name="sex" id="male" /> <br /> <label for="female">Female</label> <input type="radio" name="sex" id="female" /> </form> </code></pre> <p>效果如下：</p> <p>请点击文本标记之一，就可以触发相关控件：</p> <p><strong>例子解析</strong></p> <ul> <li><code>for</code>规定<code>label</code> 绑定到哪个表单元素。</li> <li><code>id</code>需要绑定的元素加个标识。</li> </ul> <blockquote> <p>**PS：**试着把所有常用的表单都练习几遍，理清不同类型表单的作用。</p> </blockquote> <p style="text-align:center;"><a href="http://img.e-com-net.com/image/info8/a9fe1856325c4276b93c03d6a46e5b27.jpg" target="_blank"><img alt="WEB开发零基础到入门之HTML+CSS(学习记录)_第5张图片" src="http://img.e-com-net.com/image/info8/a9fe1856325c4276b93c03d6a46e5b27.jpg" width="650" height="429" style="border:1px solid black;"></a></p> <hr> <h1 id="HTML%E8%A1%A8%E6%A0%BC">HTML表格</h1> <blockquote> <p>表格由 <code><table></code> 标签来定义。每个表格均有若干行（由<code><tr></code> 标签定义），每行被分割为若干单元格（由 <code><td></code> 标签定义）。字母<code><td></code> 指表格数据（table data），即数据单元格的内容。数据单元格可以包含文本、图片、列表、段落、表单、水平线、表格等等。</p> </blockquote> <pre><code class="language-html"><table border="1"> <tr> <td>row 1, cell 1</td> <td>row 1, cell 2</td> </tr> <tr> <td>row 2, cell 1</td> <td>row 2, cell 2</td> </tr> </table> </code></pre> <p><strong>效果如下：</strong></p> <table border="1"> <tbody> <tr> <td>row 1, cell 1</td> <td>row 1, cell 2</td> </tr> <tr> <td>row 2, cell 1</td> <td>row 2, cell 2</td> </tr> </tbody> </table> <h2 id="%E8%B7%A8%E8%A1%8C%E6%88%96%E8%B7%A8%E5%88%97%E7%9A%84%E8%A1%A8%E6%A0%BC%E5%8D%95%E5%85%83%E6%A0%BC">跨行或跨列的表格单元格</h2> <h3 id="%E8%B7%A8%E5%88%97">跨列</h3> <pre><code class="language-html"><table border="1"> <tr> <th>姓名</th> <th colspan="2">电话</th> </tr> <tr> <td>Annuo</td> <td>183 2070 282</td> <td>183 2070 232</td> </tr> </table> </code></pre> <p><strong>效果如下：</strong></p> <table border="1"> <tbody> <tr> <th>姓名</th> <th colspan="2">电话</th> </tr> <tr> <td>Annuo</td> <td>183 2070 282</td> <td>183 2070 232</td> </tr> </tbody> </table> <p><strong>例子解释</strong></p> <p>属性<code>colspan</code>横跨的列数（合并列）。</p> <h3 id="%E8%B7%A8%E8%A1%8C">跨行</h3> <pre><code class="language-html"><table border="1"> <tr> <td>姓名</td> <td>Annuo</td> </tr> <tr> <td rowspan="2">电话</td> <td>183 2070 282</td> </tr> <tr> <td>183 2070 232</td> </tr> </table> </code></pre> <p><strong>效果如下：</strong></p> <table border="1"> <tbody> <tr> <td>姓名</td> <td>Annuo</td> </tr> <tr> <td rowspan="2">电话</td> <td>183 2070 282</td> </tr> <tr> <td>183 2070 232</td> </tr> </tbody> </table> <p><strong>例子解释</strong></p> <p>属性<code>rowspan</code>横跨的行数</p> <h2 id="%E8%A1%A8%E6%A0%BC%E4%B8%AD%E7%9A%84%E7%A9%BA%E5%8D%95%E5%85%83%E6%A0%BC">表格中的空单元格</h2> <blockquote> <p>在一些浏览器中，没有内容的表格单元显示得不太好。如果某个单元格是空的（没有内容），浏览器可能无法显示出这个单元格的边框。为了避免这种情况，在空单元格中添加一个空格占位符，就可以将边框显示出来。</p> </blockquote> <hr> <blockquote> <p><strong>综合运用</strong>：把所有以上的知识点的全部结合一下，通过以上学习内容，运用表格标签和表单标签，布出下面简历。</p> <p style="text-align:center;"><a href="http://img.e-com-net.com/image/info8/1969687a96004e6aad102a93c69c97f7.jpg" target="_blank"><img alt="WEB开发零基础到入门之HTML+CSS(学习记录)_第6张图片" src="http://img.e-com-net.com/image/info8/1969687a96004e6aad102a93c69c97f7.jpg" width="650" height="424" style="border:1px solid black;"></a></p> </blockquote> <p style="text-align:center;"></p> <p> </p> <hr> <h1 id="HTML%20%E5%AE%9E%E4%BD%93">HTML 实体</h1> <blockquote> <p>在 HTML 中，某些字符是预留的。在 HTML 中不能使用小于号（< ）和大于号（>），这是因为浏览器会误认为它们是标签。如果希望正确地显示预留字符，我们必须在 HTML 源代码中使用字符实体。</p> </blockquote> <h2 id="HTML%20%E4%B8%AD%E6%9C%89%E7%94%A8%E7%9A%84%E5%AD%97%E7%AC%A6%E5%AE%9E%E4%BD%93">HTML 中有用的字符实体</h2> <blockquote> <p>在 HTML 中，某些字符是预留的。在 HTML 中不能使用小于号（< ）和大于号（>），这是因为浏览器会误认为它们是标签。如果希望正确地显示预留字符，我们必须在 HTML 源代码中使用字符实体。</p> </blockquote> <h2>HTML 中有用的字符实体</h2> <table> <tbody> <tr> <th>显示结果</th> <th>描述</th> <th>实体名称</th> <th>实体编号</th> </tr> <tr> <td> </td> <td>空格</td> <td> </td> <td> </td> </tr> <tr> <td><</td> <td>小于号</td> <td><</td> <td><</td> </tr> <tr> <td>></td> <td>大于号</td> <td>></td> <td>></td> </tr> <tr> <td>&</td> <td>和号</td> <td>&</td> <td>&</td> </tr> <tr> <td>"</td> <td>引号</td> <td>"</td> <td>"</td> </tr> <tr> <td>'</td> <td>撇号 </td> <td>' (IE不支持)</td> <td>'</td> </tr> <tr> <td>￠</td> <td>分</td> <td>¢</td> <td>¢</td> </tr> <tr> <td>£</td> <td>镑</td> <td>£</td> <td>£</td> </tr> <tr> <td>¥</td> <td>日圆</td> <td>¥</td> <td>¥</td> </tr> <tr> <td>€</td> <td>欧元</td> <td>€</td> <td>€</td> </tr> <tr> <td>§</td> <td>小节</td> <td>§</td> <td>§</td> </tr> <tr> <td>©</td> <td>版权</td> <td>©</td> <td>©</td> </tr> <tr> <td>®</td> <td>注册商标</td> <td>®</td> <td>®</td> </tr> <tr> <td>™</td> <td>商标</td> <td>™</td> <td>™</td> </tr> <tr> <td>×</td> <td>乘号</td> <td>×</td> <td>×</td> </tr> <tr> <td>÷</td> <td>除号</td> <td>÷</td> <td>÷</td> </tr> </tbody> </table> <hr> <h1 id="HTML%E6%A1%86%E6%9E%B6">HTML框架</h1> <blockquote> <p>帧窗口是一种页面技术，应用帧技术可以使得用户在同一个浏览器中，浏览不同的页面，并且各个页面之间相互联系，并且能够相互访问和进行操作。</p> </blockquote> <h3 id="%E5%AE%9E%E7%8E%B0%E6%80%9D%E8%B7%AF">实现思路</h3> <p>将浏览器的窗口按照不同的功能分割成多个小窗口，每个窗口对应自己的HTML页面，按照一定的方式组合起来，实现特殊的效果。</p> <h3 id="%E5%BA%94%E7%94%A8%E5%9C%BA%E6%99%AF">应用场景</h3> <p>网站后台操作界面,内容层级明确的页面</p> <h3 id="%E7%BC%BA%E7%82%B9">缺点</h3> <p>页面布局比较复杂，效率没有单页面高，对搜索引擎的友好程度不高</p> <h2 id="%E4%B8%80%E3%80%81%20frameset">一、 frameset</h2> <ul> <li>不能和body共存。</li> <li>表示框架开始，指定框架的个数以及边框等属性</li> <li>属性：rows="" 、cols=""、值可以是百分比也是可以是具体的数字，也可以是* 进行等分</li> <li>frameborder="" ,0表示没有边框，1表示有边框</li> </ul> <p><strong>例1</strong></p> <pre><code class="language-html"><frameset cols="25%,50%,25%"> <frame src="frame_a.htm" /> <frame src="frame_b.htm" /> <frame src="frame_c.htm" /> </frameset> </code></pre> <p><strong>例2</strong></p> <pre><code class="language-html"><frameset rows="50%,50%"> <frame src="frame_a.html"> <frameset cols="25%,75%"> <frame src="frame_b.html"> <frame src="frame_c.html"> </frameset> </frameset> </code></pre> <h2 id="%E4%BA%8C%E3%80%81%20iframe">二、 iframe</h2> <blockquote> 用于在网页内显示网页,可以和body体共存，用法和类似，用于早期实现异步传输等视觉效果。 </blockquote> <p><strong>实例</strong></p> <pre><code class="language-html"><iframe class="HtmlEdit" width="100%" frameborder=0 height="100" scrolling="no" src="https://www.csdn.net/" MARGINHEIGHT="1" MARGINWIDTH="1" name="testframename"> </iframe> <a href="http://www.ydtdml.com" target="testframename">点击指向其它框架</a> </code></pre> <table> <tbody> <tr> <th>属性</th> <th>值</th> <th>描述</th> </tr> <tr> <td>align</td> <td> <ul> <li>left</li> <li>right</li> <li>top</li> <li>middle</li> <li>bottom</li> </ul></td> <td> <p>不赞成使用。请使用样式代替。</p> <p>规定如何根据周围的元素来对齐此框架。</p> </td> </tr> <tr> <td>frameborder</td> <td> <ul> <li>1</li> <li>0</li> </ul></td> <td>规定是否显示框架周围的边框。</td> </tr> <tr> <td>height</td> <td> <ul> <li><em>pixels</em></li> <li><em>%</em></li> </ul></td> <td>规定 iframe 的高度。</td> </tr> <tr> <td>longdesc</td> <td><em>URL</em></td> <td>规定一个页面，该页面包含了有关 iframe 的较长描述。</td> </tr> <tr> <td>marginheight</td> <td><em>pixels</em></td> <td>定义 iframe 的顶部和底部的边距。</td> </tr> <tr> <td>marginwidth</td> <td><em>pixels</em></td> <td>定义 iframe 的左侧和右侧的边距。</td> </tr> <tr> <td>name</td> <td><em>frame_name</em></td> <td>规定 iframe 的名称。</td> </tr> <tr> <td>sandbox</td> <td> <ul> <li>""</li> <li>allow-forms</li> <li>allow-same-origin</li> <li>allow-scripts</li> <li>allow-top-navigation</li> </ul></td> <td>启用一系列对 <iframe> 中内容的额外限制。</td> </tr> <tr> <td>scrolling</td> <td> <ul> <li>yes</li> <li>no</li> <li>auto</li> </ul></td> <td>规定是否在 iframe 中显示滚动条。</td> </tr> <tr> <td>seamless</td> <td>seamless</td> <td>规定 <iframe> 看上去像是包含文档的一部分。</td> </tr> <tr> <td>src</td> <td><em>URL</em></td> <td>规定在 iframe 中显示的文档的 URL。</td> </tr> <tr> <td>srcdoc</td> <td><em>HTML_code</em></td> <td>规定在 <iframe> 中显示的页面的 HTML 内容。</td> </tr> <tr> <td>width</td> <td> <ul> <li><em>pixels</em></li> <li><em>%</em></li> </ul></td> <td>定义 iframe 的宽度。</td> </tr> </tbody> </table> <blockquote> <p>**PS：**那么咱们对于HTML的介绍及实例介绍到这就结束了；如果有了解不透的点击下方链接详细了解</p> <p>https://www.runoob.com/html/html-tutorial.html</p> <p>https://www.w3school.com.cn/html5/index.asp</p> </blockquote> <hr> <p>文章持续更新中...下篇是CSS的展现层面介绍！</p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> </div> </div> </div> </div> </div>  <div id="SOHUCS" sid="1288311347511107584"></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">你可能感兴趣的:(PHP,mysql,WEB)</h4> <div id="paradigm-article-related"> <div class="recommend-post mb30"> <ul class="widget-links"> <li><a href="/article/1891860855272828928.htm" title="图扑智慧展馆合集 | 打造城市基础设施数字化应用" target="_blank">图扑智慧展馆合集 | 打造城市基础设施数字化应用</a> <span class="text-muted"></span> <div>智慧展览馆是指利用先进的科技手段和现代化管理方式，将传统的展览馆、科技馆等场所进行数字化、智能化改造的新型展览空间。其中包括智慧展厅、智慧展馆和智慧博物馆等不同形式，它们带来了全新的观展体验和更为高效的管理模式。效果展示图扑运用HT强大的渲染功能，数字孪生各类智慧展览馆，1:1地复现其内部独特的结构造型和建筑特色。通过应用可视化、WebGIS、倾斜摄影、VR、沉浸式交互等多重技术手段，构建数据共享</div> </li> <li><a href="/article/1891860728034422784.htm" title="江行智能×图扑软件：输煤皮带数字孪生管控系统" target="_blank">江行智能×图扑软件：输煤皮带数字孪生管控系统</a> <span class="text-muted"></span> <div>在现代矿业和电力行业中，输煤皮带系统是运输环节的核心。然后，随着智能化生产的高要求，智慧矿山输煤皮带系统的传统管理模式已显得力不从心。产业引入的三维可视化和数字孪生技术，一改传统输煤皮带系统由于设备老化、管理不善等原因，导致的可能出现停机和故障等问题，大幅提高输煤皮带系统运转效率。效果展示采用图扑软件自主研发HTforWeb产品构建轻量化的3D可视化场景，建立动态的数字化输煤皮带模型。在本次展示的</div> </li> <li><a href="/article/1891860624472862720.htm" title="youtube new tools website" target="_blank">youtube new tools website</a> <span class="text-muted">blogcs</span> <a class="tag" taget="_blank" href="/search/youtube/1.htm">youtube</a><a class="tag" taget="_blank" href="/search/towav/1.htm">towav</a><a class="tag" taget="_blank" href="/search/ios/1.htm">ios</a><a class="tag" taget="_blank" href="/search/webview/1.htm">webview</a> <div>1.MainFunctionTheprimarypurposeofthissiteistoprovideuserswithaconvenientwaytoextracttheaudiofromYouTubevideosintheWAVformat.Thisisusefulforavarietyofreasons.Forexample,WAVisahigh-qualityaudioformattha</div> </li> <li><a href="/article/1891859994362572800.htm" title="Flutter学习" target="_blank">Flutter学习</a> <span class="text-muted">T_yoo_csdn</span> <a class="tag" taget="_blank" href="/search/Flutter/1.htm">Flutter</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/Flutter/1.htm">Flutter</a> <div>flutter环境搭建mac版Flutter中文网Flutter原理及美团的实践背景Flutter的目标是使同一套代码同时运行在Android和iOS系统上，并且拥有媲美原生应用的性能，Flutter甚至提供了两套控件来适配Android和iOS（滚动效果、字体和控件图标等等），为了让App在细节处看起来更像原生应用。在Flutter诞生之前，已经有许多跨平台UI框架的方案，比如基于WebView</div> </li> <li><a href="/article/1891859845842268160.htm" title="用 Python 撸一个 Web 服务器-第9章：项目总结" target="_blank">用 Python 撸一个 Web 服务器-第9章：项目总结</a> <span class="text-muted"></span> <a class="tag" taget="_blank" href="/search/pythonweb/1.htm">pythonweb</a> <div>项目总结本教程带大家一起实现了一个TodoList程序，包含基础的增删改查功能，和用户登录认证。这也是Web开发中最常见的需求。我画了一张思维导图，帮助你从宏观的角度来概览TodoList程序，加深你对Web开发的理解。TodoList项目整体思路参考MVC设计模式。有意设计utils/目录专门用来存储一些工具方法，这些工具方法通常比较独立，尽量不从外部模块导入依赖，其他模块需要某个工具方法时从u</div> </li> <li><a href="/article/1891859592703438848.htm" title="用 Python 撸一个 Web 服务器-第7章：重构——更好的组织代码" target="_blank">用 Python 撸一个 Web 服务器-第7章：重构——更好的组织代码</a> <span class="text-muted"></span> <a class="tag" taget="_blank" href="/search/pythonweb/1.htm">pythonweb</a> <div>通过前几章的学习，我们完成了TodoList程序的todo管理部分，实现了对todo的增、删、改、查基本操作，这也是几乎所有Web程序都具备的功能。我们当然可以按照目前的思路继续来实现用户管理部分，在models.py中编写用户相关的模型，在templates/目录下新建用户相关HTML，在controllers.py中编写用户相关的视图函数。但是，随着新功能的加入，把不同功能的代码都写在相同的文</div> </li> <li><a href="/article/1891858833576357888.htm" title="MySQL的binlog日志" target="_blank">MySQL的binlog日志</a> <span class="text-muted"></span> <a class="tag" taget="_blank" href="/search/mysql/1.htm">mysql</a> <div>binlog基本认识MySQL的二进制日志可以说是MySQL最重要的日志了，它记录了所有的DDL和DML(除了数据查询语句)语句，以事件形式记录，还包含语句所执行的消耗的时间，MySQL的二进制日志是事务安全型的。一般来说开启二进制日志大概会有1%的性能损耗(参见MySQL官方中文手册5.1.24版)。二进制有两个最重要的使用场景:其一：MySQLReplication在Master端开启binl</div> </li> <li><a href="/article/1891853680341217280.htm" title="深入了解 AppScan 工具的使用：筑牢 Web 应用安全防线" target="_blank">深入了解 AppScan 工具的使用：筑牢 Web 应用安全防线</a> <span class="text-muted">垚垚 Securify 前沿站</span> <a class="tag" taget="_blank" href="/search/%E5%8D%81%E5%A4%A7%E6%BC%8F%E6%B4%9E/1.htm">十大漏洞</a><a class="tag" taget="_blank" href="/search/%E7%BD%91%E7%BB%9C/1.htm">网络</a><a class="tag" taget="_blank" href="/search/%E5%AE%89%E5%85%A8/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/web%E5%AE%89%E5%85%A8/1.htm">web安全</a><a class="tag" taget="_blank" href="/search/%E7%B3%BB%E7%BB%9F%E5%AE%89%E5%85%A8/1.htm">系统安全</a><a class="tag" taget="_blank" href="/search/%E8%BF%90%E7%BB%B4/1.htm">运维</a> <div>前言IBMAppScan作为一款业界领先的Web应用程序安全测试工具，就像一位专业的“安全卫士”，能够精准高效地识别并协助修复各类安全漏洞，为应用安全保驾护航。接下来，让我们一同深入探索AppScan的使用奥秘。一、探秘AppScan：功能与原理剖析AppScan的核心功能是模拟黑客的多样化攻击手段，对Web应用程序展开全方位、无死角的深度扫描，从而揪出隐藏其中的SQL注入、跨站脚本（XSS）、文</div> </li> <li><a href="/article/1891849521944653824.htm" title="服务器数据传输协议,详解前端websocket服务器之数据传输协议前言服务器发送数据服务端接受数据总结..." target="_blank">服务器数据传输协议,详解前端websocket服务器之数据传输协议前言服务器发送数据服务端接受数据总结...</a> <span class="text-muted">weixin_39980575</span> <a class="tag" taget="_blank" href="/search/%E6%9C%8D%E5%8A%A1%E5%99%A8%E6%95%B0%E6%8D%AE%E4%BC%A0%E8%BE%93%E5%8D%8F%E8%AE%AE/1.htm">服务器数据传输协议</a> <div>前言上一篇文章我们初步搭建了一个websocket，但是还不能发送和接收数据，这篇文章我们聊一聊它是如何收发数据的。websocket支持文本和二进制的传输，内部是如何接收和发送数据的对使用者来说是不可见的，虽然这不影响使用，但是为了更加深入了解websocket的原理，我们还是有必要一探究竟！我们首先来看一张数据结构的二进制图，如下：如图1，乍一看可能看不懂，我先来解释一下：图1最上面表示的是二</div> </li> <li><a href="/article/1891847627281068032.htm" title="基于eBPF的智能诊断平台：实现云原生系统的自愈型运维体系" target="_blank">基于eBPF的智能诊断平台：实现云原生系统的自愈型运维体系</a> <span class="text-muted">桂月二二</span> <a class="tag" taget="_blank" href="/search/%E4%BA%91%E5%8E%9F%E7%94%9F/1.htm">云原生</a><a class="tag" taget="_blank" href="/search/%E8%BF%90%E7%BB%B4/1.htm">运维</a> <div>引言：从被动运维到预测性自愈的进化当某电商平台通过eBPF实时诊断系统提前48小时预测到MySQL集群的锁竞争风暴时，其核心是千万级指标粒度的内核状态分析与AI驱动的根因定位算法的结合。运维数据显示，该平台将平均故障恢复时间（MTTR）从23分钟压缩到71秒，并自动修复了87%的异常事件。通过动态注入修复策略，集群CPU毛刺现象减少了94%，开创了智能运维的新纪元。一、传统可观测性工具的桎梏1.1</div> </li> <li><a href="/article/1891846616575438848.htm" title="springboot学生宿舍信息的系统（11574）" target="_blank">springboot学生宿舍信息的系统（11574）</a> <span class="text-muted">codercode2022</span> <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><a class="tag" taget="_blank" href="/search/java/1.htm">java</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/spring/1.htm">spring</a><a class="tag" taget="_blank" href="/search/gulp/1.htm">gulp</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF%E6%A1%86%E6%9E%B6/1.htm">前端框架</a> <div>有需要的同学，源代码和配套文档领取，加文章最下方的名片哦一、项目演示项目演示视频二、资料介绍完整源代码（前后端源代码+SQL脚本）配套文档（LW+PPT+开题报告）远程调试控屏包运行三、技术介绍Java语言SSM框架SpringBoot框架Vue框架JSP页面Mysql数据库IDEA/Eclipse开发四、项目截图有需要的同学，源代码和配套文档领取，加文章最下方的名片哦!</div> </li> <li><a href="/article/1891844469406363648.htm" title="WebSocket协议里客户端发送给服务器的数据会用4字节的掩码循环异或的分析" target="_blank">WebSocket协议里客户端发送给服务器的数据会用4字节的掩码循环异或的分析</a> <span class="text-muted">cdcdhj</span> <a class="tag" taget="_blank" href="/search/nodejs/1.htm">nodejs</a><a class="tag" taget="_blank" href="/search/websocket/1.htm">websocket</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/%E7%BD%91%E7%BB%9C/1.htm">网络</a> <div>首先，我需要回顾WebSocket协议中对掩码处理的具体要求。根据RFC6455，客户端发送到服务器的帧必须使用掩码，而服务器发送的帧不需要掩码。掩码是4字节的，应用于有效载荷数据，每个字节依次与掩码的对应字节异或，循环使用掩码。例如，第一个字节与掩码的第0个字节异或，第二个与第1个，第三个与第2个，第四个与第3个，第五个又回到第0个，依此类推。用户提供的unmask函数看起来是正确的，因为它确实</div> </li> <li><a href="/article/1891843456632942592.htm" title="WebSocket协议解析 : 双向实时通信的利器" target="_blank">WebSocket协议解析 : 双向实时通信的利器</a> <span class="text-muted">氦客</span> <a class="tag" taget="_blank" href="/search/%E7%BD%91%E7%BB%9C/1.htm">网络</a><a class="tag" taget="_blank" href="/search/websocket/1.htm">websocket</a><a class="tag" taget="_blank" href="/search/%E7%BD%91%E7%BB%9C%E5%8D%8F%E8%AE%AE/1.htm">网络协议</a><a class="tag" taget="_blank" href="/search/HTTP/1.htm">HTTP</a><a class="tag" taget="_blank" href="/search/%E5%85%A8%E5%8F%8C%E5%B7%A5/1.htm">全双工</a><a class="tag" taget="_blank" href="/search/%E5%AE%9E%E6%97%B6%E9%80%9A%E4%BF%A1/1.htm">实时通信</a><a class="tag" taget="_blank" href="/search/%E5%B1%80%E5%9F%9F%E7%BD%91/1.htm">局域网</a><a class="tag" taget="_blank" href="/search/%E5%B7%A5%E4%BD%9C%E5%8E%9F%E7%90%86/1.htm">工作原理</a> <div>1.WebSocket是什么WebSocket是一种在单个TCP连接上进行全双工通信的协议。WebSocket允许客户端和服务器之间进行实时的双向通信。这意味着服务器可以主动推送数据到客户端，而不需要客户端每次都发送请求来获取数据。这种通信方式通过长连接实现，即连接建立后，可以持续进行数据传输，直到一方主动关闭连接。1.1什么是实时通信?传统的通信方式，比如电子邮件或者普通的网页浏览，通常都会存在</div> </li> <li><a href="/article/1891837528248479744.htm" title="Centos使用Mysql" target="_blank">Centos使用Mysql</a> <span class="text-muted">SYS_MHPY</span> <a class="tag" taget="_blank" href="/search/Linux/1.htm">Linux</a><a class="tag" taget="_blank" href="/search/centos/1.htm">centos</a><a class="tag" taget="_blank" href="/search/mysql/1.htm">mysql</a><a class="tag" taget="_blank" href="/search/linux/1.htm">linux</a> <div>文章目录1连接数据库2执行SQL脚本1连接数据库mysql-uusername-p[root@localhost~]#mysql-uusername-p2执行SQL脚本source/path/to/example.sql;</div> </li> <li><a href="/article/1891831220216590336.htm" title="ssm毕业设计基于SSM框架的中医养生系统设计与实现[文档+开题+PPT" target="_blank">ssm毕业设计基于SSM框架的中医养生系统设计与实现[文档+开题+PPT</a> <span class="text-muted">IT实战课堂</span> <a class="tag" taget="_blank" href="/search/%E8%AF%BE%E7%A8%8B%E8%AE%BE%E8%AE%A1/1.htm">课程设计</a> <div>选题推荐——以防找不到我们，点击上方订阅专栏✌✌\Java毕设实战项目Python毕设项目源代码asp.net毕业设计项目Uniapp安卓毕业设计项目node.js毕业设计项目python毕业设计微信小程序毕业设计项目php毕业设计文末获取源码联系一、项目介绍1.1研究背景现在大家正处于互联网加的时代，这个时代它就是一个信息内容无比丰富，信息处理与管理变得越加高效的网络化的时代，这个时代让大家的生</div> </li> <li><a href="/article/1891819353297448960.htm" title="编译安装php7.2" target="_blank">编译安装php7.2</a> <span class="text-muted">raoxiaoya</span> <a class="tag" taget="_blank" href="/search/PHP/1.htm">PHP</a><a class="tag" taget="_blank" href="/search/php/1.htm">php</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%BC%80%E5%8F%91%E8%AF%AD%E8%A8%80/1.htm">开发语言</a> <div>编译安装php7.2centos-7.064groupaddwwwuseradd-gwwwwww1、先安装如下依赖包yuminstall-ygccgcc-c++makezlibzlib-develpcrepcre-devellibjpeglibjpeg-devellibpnglibpng-develfreetypefreetype-devellibxml2libxml2-develglibcgli</div> </li> <li><a href="/article/1891816825101021184.htm" title="centos 编译安装php 7.0" target="_blank">centos 编译安装php 7.0</a> <span class="text-muted">$Elvin</span> <a class="tag" taget="_blank" href="/search/php/1.htm">php</a><a class="tag" taget="_blank" href="/search/centos/1.htm">centos</a> <div>第一步：安装依赖yuminstall-ygccgcc-c++makecmakebisonautoconfwgetlrzszyuminstall-ylibtoollibtool-ltdl-develyuminstall-yfreetype-devellibjpeg.x86_64libjpeg-devellibpng-develgd-develyuminstall-ypython-develpatch</div> </li> <li><a href="/article/1891814682365325312.htm" title="字节跳动后端或大数据基础知识面试题及参考答案（2万字长文）" target="_blank">字节跳动后端或大数据基础知识面试题及参考答案（2万字长文）</a> <span class="text-muted">大模型大数据攻城狮</span> <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/%E5%A4%A7%E5%8E%82%E9%9D%A2%E8%AF%95/1.htm">大厂面试</a><a class="tag" taget="_blank" href="/search/%E6%95%B0%E6%8D%AE%E7%BB%93%E6%9E%84/1.htm">数据结构</a><a class="tag" taget="_blank" href="/search/%E7%AE%97%E6%B3%95/1.htm">算法</a><a class="tag" taget="_blank" href="/search/leetcode/1.htm">leetcode</a> <div>目录Redis的数据类型Redis数据类型的底层数据结构三次握手、四次挥手Redis持久化机制购物车为什么用Redis存，是永久存储吗MySQL的InnoDB索引数据结构哪些SQL的关键字会让索引失效队列、栈、数组、链表有什么不同讲讲爬虫的构成爬虫抓到的数据不清洗吗？不去重吗？对爬虫的更多了解Linux进程间通信机制进程和线程的区别线程私有的数据讲一下堆排序，每次调整的时间复杂度？堆排序是稳定的吗</div> </li> <li><a href="/article/1891810643145715712.htm" title="一台服务器最多可以允许多少人同时访问？IIS连接数如何计算？" target="_blank">一台服务器最多可以允许多少人同时访问？IIS连接数如何计算？</a> <span class="text-muted">网硕互联的小客服</span> <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/%E8%BF%90%E7%BB%B4/1.htm">运维</a><a class="tag" taget="_blank" href="/search/windows/1.htm">windows</a><a class="tag" taget="_blank" href="/search/linux/1.htm">linux</a> <div>一台服务器能够同时允许多少人访问，取决于多个硬件和软件配置因素，包括服务器的CPU、内存、网络带宽、磁盘I/O性能，以及使用的Web服务器软件（如IIS、Apache等）和应用架构。特别是对于使用IIS（InternetInformationServices）的服务器，最大连接数通常受Windows操作系统的版本、IIS配置和硬件资源等因素的限制。1.服务器允许的最大连接数的影响因素1.1服务器硬</div> </li> <li><a href="/article/1891802277111459840.htm" title="抛弃手册，开启TongWeb+TongLINK/Q的开发方式" target="_blank">抛弃手册，开启TongWeb+TongLINK/Q的开发方式</a> <span class="text-muted">萝卜白菜。</span> <a class="tag" taget="_blank" href="/search/web/1.htm">web</a><a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/jms/1.htm">jms</a> <div>问题：当使用TongWeb+TongLINK/Q产品，想用JMS开发消息服务时，不知如何使用？1.当你看TongLINK/Q手册《JMS编程参考》时，在给你讲TongWeb5.0+TongLINK/Q8.1的消息驱动bean（Message-DrivenBean，MDB）配置。2.当你去看TongWeb7的《用户手册》时，在给你讲TongWeb7.0+TongLINK/Q8.1的消息驱动bean（</div> </li> <li><a href="/article/1891802148593790976.htm" title="CPP集群聊天服务器开发实践（七）：Github上传项目" target="_blank">CPP集群聊天服务器开发实践（七）：Github上传项目</a> <span class="text-muted">杨枝甘露小码</span> <a class="tag" taget="_blank" href="/search/CPP%E9%9B%86%E7%BE%A4%E8%81%8A%E5%A4%A9%E6%9C%8D%E5%8A%A1%E5%99%A8%E5%BC%80%E5%8F%91/1.htm">CPP集群聊天服务器开发</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/github/1.htm">github</a> <div>github链接：GitHub-arduino-ctrl/ClusterServer:基于json+muduo+mysql+nginx+redis的集群服务器与客户端通信源码步骤如下：1.github新建代码仓库，复制url2.gitclonehttps://github.com/arduino-ctrl/ClusterServer.git3.将项目文件移动到ClusterServer文件夹里面m</div> </li> <li><a href="/article/1891800509359124480.htm" title="基于Java毕业设计学术会议论文稿件管理系统源码+系统+mysql+lw文档+部署软件" target="_blank">基于Java毕业设计学术会议论文稿件管理系统源码+系统+mysql+lw文档+部署软件</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/%E8%AF%BE%E7%A8%8B%E8%AE%BE%E8%AE%A1/1.htm">课程设计</a><a class="tag" taget="_blank" href="/search/mysql/1.htm">mysql</a> <div>基于Java毕业设计学术会议论文稿件管理系统源码+系统+mysql+lw文档+部署软件基于Java毕业设计学术会议论文稿件管理系统源码+系统+mysql+lw文档+部署软件本源码技术栈：项目架构：B/S架构开发语言：Java语言开发软件：ideaeclipse前端技术：Layui、HTML、CSS、JS、JQuery等技术后端技术：JAVA运行环境：Win10、JDK1.8数据库：MySQL5.7</div> </li> <li><a href="/article/1891800255192690688.htm" title="C++集群聊天服务器项目博客目录" target="_blank">C++集群聊天服务器项目博客目录</a> <span class="text-muted">为了前进而后退，为了走直路而走弯路</span> <a class="tag" taget="_blank" href="/search/C%2B%2B/1.htm">C++</a><a class="tag" taget="_blank" href="/search/%E9%A1%B9%E7%9B%AE/1.htm">项目</a><a class="tag" taget="_blank" href="/search/c%2B%2B/1.htm">c++</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%BC%80%E5%8F%91%E8%AF%AD%E8%A8%80/1.htm">开发语言</a> <div>C++集群聊天服务器项目博客目录C++集群聊天服务器项目总概述-CSDN博客github源码地址：DarlingGYQ/chatserver:基于C++11的可以工作在nginxtcp负载均衡环境中的集群聊天服务器和客户端源码环境配置windows下使用vscode远程连接Linux服务器进行开发-CSDN博客ubuntu安装MySQL-CSDN博客ubuntu安装Redis-CSDN博客Ubun</div> </li> <li><a href="/article/1891800126494666752.htm" title="java计算机毕业设计web实验室课表管理系统源码+mysql数据库+系统+lw文档+部署" target="_blank">java计算机毕业设计web实验室课表管理系统源码+mysql数据库+系统+lw文档+部署</a> <span class="text-muted">花样1999</span> <a class="tag" taget="_blank" href="/search/mysql/1.htm">mysql</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/java/1.htm">java</a> <div>java计算机毕业设计web实验室课表管理系统源码+mysql数据库+系统+lw文档+部署java计算机毕业设计web实验室课表管理系统源码+mysql数据库+系统+lw文档+部署本源码技术栈：项目架构：B/S架构开发语言：Java语言开发软件：ideaeclipse前端技术：Layui、HTML、CSS、JS、JQuery等技术后端技术：JAVA运行环境：Win10、JDK1.8数据库：MySQ</div> </li> <li><a href="/article/1891800127509688320.htm" title="java计算机毕业设计运动会管理系统源码+mysql数据库+系统+lw文档+部署" target="_blank">java计算机毕业设计运动会管理系统源码+mysql数据库+系统+lw文档+部署</a> <span class="text-muted">沪港</span> <a class="tag" taget="_blank" href="/search/mysql/1.htm">mysql</a><a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/%E6%95%B0%E6%8D%AE%E5%BA%93/1.htm">数据库</a> <div>java计算机毕业设计运动会管理系统源码+mysql数据库+系统+lw文档+部署java计算机毕业设计运动会管理系统源码+mysql数据库+系统+lw文档+部署本源码技术栈：项目架构：B/S架构开发语言：Java语言开发软件：ideaeclipse前端技术：Layui、HTML、CSS、JS、JQuery等技术后端技术：JAVA运行环境：Win10、JDK1.8数据库：MySQL5.7/8.0源码</div> </li> <li><a href="/article/1891795960661602304.htm" title="Selenium自动化测试入门：浏览器多窗口切换" target="_blank">Selenium自动化测试入门：浏览器多窗口切换</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><a class="tag" taget="_blank" href="/search/%E8%BD%AF%E4%BB%B6%E6%B5%8B%E8%AF%95/1.htm">软件测试</a><a class="tag" taget="_blank" href="/search/%E8%87%AA%E5%8A%A8%E5%8C%96%E6%B5%8B%E8%AF%95/1.htm">自动化测试</a><a class="tag" taget="_blank" href="/search/python/1.htm">python</a><a class="tag" taget="_blank" href="/search/%E8%81%8C%E5%9C%BA%E5%92%8C%E5%8F%91%E5%B1%95/1.htm">职场和发展</a><a class="tag" taget="_blank" href="/search/%E6%B5%8B%E8%AF%95%E7%94%A8%E4%BE%8B/1.htm">测试用例</a> <div>点击文末小卡片，免费获取软件测试全套资料，资料在手，涨薪更快有时web应用会打开多个浏览器窗口，当我们要定位新窗口中的元素时，我们需要将webDriver的handle（句柄）指定到新窗口。什么意思？假设我们打开web应用，在系统运行过程中重新打开一个新窗口（可以是页签，当前浏览器存在两个窗口），这时我们webDriver对浏览器的操作指针（句柄）还再原窗口，如果需要操作新窗口元素就要将handl</div> </li> <li><a href="/article/1891795204717998080.htm" title="消息队列简述" target="_blank">消息队列简述</a> <span class="text-muted">八二年的栗子</span> <a class="tag" taget="_blank" href="/search/java/1.htm">java</a> <div>消息队列（MessageQueue），是分布式系统中重要的组件，其通用的使用场景可以简单地描述为：当不需要立即获得结果，但是并发量又需要进行控制的时候，差不多就是需要使用消息队列的时候。消息队列主要解决了应用耦合、异步处理、流量削锋等问题。当前使用较多的消息队列有RabbitMQ、RocketMQ、ActiveMQ、Kafka、ZeroMQ、MetaMq等，而部分数据库如Redis、Mysql以及</div> </li> <li><a href="/article/1891793693644484608.htm" title="NoSQL调研与学习（一）" target="_blank">NoSQL调研与学习（一）</a> <span class="text-muted">JUNPR</span> <a class="tag" taget="_blank" href="/search/NoSQL/1.htm">NoSQL</a><a class="tag" taget="_blank" href="/search/redis/1.htm">redis</a><a class="tag" taget="_blank" href="/search/nosql/1.htm">nosql</a><a class="tag" taget="_blank" href="/search/%E6%95%B0%E6%8D%AE%E5%BA%93/1.htm">数据库</a> <div>NoSQL数据库调研与学习简言1.1NoSQL概述NoSQL，泛指非关系型的数据库。随着互联网web2.0网站的兴起，传统的关系数据库在处理web2.0网站，特别是超大规模和高并发的SNS类型的web2.0纯动态网站已经显得力不从心，出现了很多难以克服的问题，而非关系型的数据库则由于其本身的特点得到了非常迅速的发展。NoSQL数据库的产生就是为了解决大规模数据集合多重数据种类带来的挑战，特别是大数</div> </li> <li><a href="/article/1891784613878099968.htm" title="springboot029网上购物商城系统" target="_blank">springboot029网上购物商城系统</a> <span class="text-muted">Q_97095639</span> <a class="tag" taget="_blank" href="/search/springboot%E6%AF%95%E4%B8%9A%E8%AE%BE%E8%AE%A1/1.htm">springboot毕业设计</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/%E6%AF%95%E4%B8%9A%E8%AE%BE%E8%AE%A1/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>版权声明所有作品均为本人原创，提供参考学习使用，如需要源码+数据库+配套文档请移步www.taobysj.com搜索获取技术实现开发语言：Java+vue。框架：后端spingboot+前端vue。模式：B/S。数据库：mysql。开发工具：idea。论文字数：1万左右。数据库表个数：10个左右。运行环境：jdk+idea+mysql。版本不限制，包安装运行！项目优点：前后端分离，注释详细，代码简</div> </li> <li><a href="/article/1891781328005820416.htm" title="Spring Boot集成Spring MVC：快速搭建Web应用" target="_blank">Spring Boot集成Spring MVC：快速搭建Web应用</a> <span class="text-muted">软件职业规划</span> <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/spring/1.htm">spring</a><a class="tag" taget="_blank" href="/search/boot/1.htm">boot</a><a class="tag" taget="_blank" href="/search/mvc/1.htm">mvc</a> <div>在SpringBoot项目中集成SpringMVC是一个非常常见的需求。SpringBoot已经内置了对SpringMVC的支持，因此集成过程相对简单。1.创建SpringBoot项目你可以通过以下方式创建一个SpringBoot项目：使用SpringInitializr（start.spring.io）在线生成项目。使用IDE（如IntelliJIDEA或Eclipse）的SpringBoot插</div> </li> <li><a href="/article/58.htm" title="多线程编程之理财" target="_blank">多线程编程之理财</a> <span class="text-muted">周凡杨</span> <a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/%E5%A4%9A%E7%BA%BF%E7%A8%8B/1.htm">多线程</a><a class="tag" taget="_blank" href="/search/%E7%94%9F%E4%BA%A7%E8%80%85/1.htm">生产者</a><a class="tag" taget="_blank" href="/search/%E6%B6%88%E8%B4%B9%E8%80%85/1.htm">消费者</a><a class="tag" taget="_blank" href="/search/%E7%90%86%E8%B4%A2/1.htm">理财</a> <div> 现实生活中，我们一边工作，一边消费，正常情况下会把多余的钱存起来，比如存到余额宝，还可以多挣点钱，现在就有这个情况：我每月可以发工资20000万元（暂定每月的1号），每月消费5000（租房+生活费）元（暂定每月的1号），其中租金是大头占90%，交房租的方式可以选择（一月一交，两月一交、三月一交），理财：1万元存余额宝一天可以赚1元钱，</div> </li> <li><a href="/article/185.htm" title="[Zookeeper学习笔记之三]Zookeeper会话超时机制" target="_blank">[Zookeeper学习笔记之三]Zookeeper会话超时机制</a> <span class="text-muted">bit1129</span> <a class="tag" taget="_blank" href="/search/zookeeper/1.htm">zookeeper</a> <div>首先，会话超时是由Zookeeper服务端通知客户端会话已经超时，客户端不能自行决定会话已经超时，不过客户端可以通过调用Zookeeper.close()主动的发起会话结束请求，如下的代码输出内容 Created /zoo-739160015 CONNECTEDCONNECTED .............CONNECTEDCONNECTED CONNECTEDCLOSEDCLOSED </div> </li> <li><a href="/article/312.htm" title="SecureCRT快捷键" target="_blank">SecureCRT快捷键</a> <span class="text-muted">daizj</span> <a class="tag" taget="_blank" href="/search/secureCRT/1.htm">secureCRT</a><a class="tag" taget="_blank" href="/search/%E5%BF%AB%E6%8D%B7%E9%94%AE/1.htm">快捷键</a> <div>ctrl + a : 移动光标到行首ctrl + e ：移动光标到行尾crtl + b: 光标前移1个字符crtl + f: 光标后移1个字符crtl + h : 删除光标之前的一个字符ctrl + d ：删除光标之后的一个字符crtl + k ：删除光标到行尾所有字符crtl + u : 删除光标至行首所有字符crtl + w: 删除光标至行首</div> </li> <li><a href="/article/439.htm" title="Java 子类与父类这间的转换" target="_blank">Java 子类与父类这间的转换</a> <span class="text-muted">周凡杨</span> <a class="tag" taget="_blank" href="/search/java+%E7%88%B6%E7%B1%BB%E4%B8%8E%E5%AD%90%E7%B1%BB%E7%9A%84%E8%BD%AC%E6%8D%A2/1.htm">java 父类与子类的转换</a> <div> 最近同事调的一个服务报错，查看后是日期之间转换出的问题。代码里是把 java.sql.Date 类型的对象强制转换为 java.sql.Timestamp 类型的对象。报java.lang.ClassCastException。代码： </div> </li> <li><a href="/article/566.htm" title="可视化swing界面编辑" target="_blank">可视化swing界面编辑</a> <span class="text-muted">朱辉辉33</span> <a class="tag" taget="_blank" href="/search/eclipse/1.htm">eclipse</a><a class="tag" taget="_blank" href="/search/swing/1.htm">swing</a> <div> 今天发现了一个WindowBuilder插件，功能好强大，啊哈哈，从此告别手动编辑swing界面代码，直接像VB那样编辑界面，代码会自动生成。首先在Eclipse中点击help，选择Install New Software,然后在Work with中输入WindowBui</div> </li> <li><a href="/article/693.htm" title="web报表工具FineReport常用函数的用法总结（文本函数）" target="_blank">web报表工具FineReport常用函数的用法总结（文本函数）</a> <span class="text-muted">老A不折腾</span> <a class="tag" taget="_blank" href="/search/finereport/1.htm">finereport</a><a class="tag" taget="_blank" href="/search/web%E6%8A%A5%E8%A1%A8%E5%B7%A5%E5%85%B7/1.htm">web报表工具</a><a class="tag" taget="_blank" href="/search/%E6%8A%A5%E8%A1%A8%E8%BD%AF%E4%BB%B6/1.htm">报表软件</a><a class="tag" taget="_blank" href="/search/java%E6%8A%A5%E8%A1%A8/1.htm">java报表</a> <div>文本函数 CHAR CHAR(number):根据指定数字返回对应的字符。CHAR函数可将计算机其他类型的数字代码转换为字符。 Number:用于指定字符的数字，介于1Number:用于指定字符的数字，介于165535之间（包括1和65535）。示例: CHAR(88)等于“X”。 CHAR(45)等于“-”。 CODE CODE(text):计算文本串中第一个字</div> </li> <li><a href="/article/820.htm" title="mysql安装出错" target="_blank">mysql安装出错</a> <span class="text-muted">林鹤霄</span> <a class="tag" taget="_blank" href="/search/mysql%E5%AE%89%E8%A3%85/1.htm">mysql安装</a> <div>[root@localhost ~]# rpm -ivh MySQL-server-5.5.24-1.linux2.6.x86_64.rpm Preparing... #####################</div> </li> <li><a href="/article/947.htm" title="linux下编译libuv" target="_blank">linux下编译libuv</a> <span class="text-muted">aigo</span> <a class="tag" taget="_blank" href="/search/libuv/1.htm">libuv</a> <div>下载最新版本的libuv源码，解压后执行： ./autogen.sh 这时会提醒找不到automake命令，通过一下命令执行安装（redhat系用yum，Debian系用apt-get）： # yum -y install automake # yum -y install libtool 如果提示错误：make: *** No targe</div> </li> <li><a href="/article/1074.htm" title="中国行政区数据及三级联动菜单" target="_blank">中国行政区数据及三级联动菜单</a> <span class="text-muted">alxw4616</span> <div>近期做项目需要三级联动菜单,上网查了半天竟然没有发现一个能直接用的! 呵呵,都要自己填数据....我了个去这东西麻烦就麻烦的数据上. 哎,自己没办法动手写吧. 现将这些数据共享出了,以方便大家.嗯,代码也可以直接使用文件说明 lib\area.sql -- 县及县以上行政区划分代码（截止2013年8月31日)来源：国家统计局发布时间：2014-01-17 15:0</div> </li> <li><a href="/article/1201.htm" title="哈夫曼加密文件" target="_blank">哈夫曼加密文件</a> <span class="text-muted">百合不是茶</span> <a class="tag" taget="_blank" href="/search/%E5%93%88%E5%A4%AB%E6%9B%BC%E5%8E%8B%E7%BC%A9/1.htm">哈夫曼压缩</a><a class="tag" taget="_blank" href="/search/%E5%93%88%E5%A4%AB%E6%9B%BC%E5%8A%A0%E5%AF%86/1.htm">哈夫曼加密</a><a class="tag" taget="_blank" href="/search/%E4%BA%8C%E5%8F%89%E6%A0%91/1.htm">二叉树</a> <div> 在上一篇介绍过哈夫曼编码的基础知识,下面就直接介绍使用哈夫曼编码怎么来做文件加密或者压缩与解压的软件,对于新手来是有点难度的,主要还是要理清楚步骤; 加密步骤: 1,统计文件中字节出现的次数,作为权值 2,创建节点和哈夫曼树 3,得到每个子节点01串 4,使用哈夫曼编码表示每个字节 </div> </li> <li><a href="/article/1328.htm" title="JDK1.5 Cyclicbarrier实例" target="_blank">JDK1.5 Cyclicbarrier实例</a> <span class="text-muted">bijian1013</span> <a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/thread/1.htm">thread</a><a class="tag" taget="_blank" href="/search/java%E5%A4%9A%E7%BA%BF%E7%A8%8B/1.htm">java多线程</a><a class="tag" taget="_blank" href="/search/Cyclicbarrier/1.htm">Cyclicbarrier</a> <div>CyclicBarrier类一个同步辅助类，它允许一组线程互相等待，直到到达某个公共屏障点 (common barrier point)。在涉及一组固定大小的线程的程序中，这些线程必须不时地互相等待，此时 CyclicBarrier 很有用。因为该 barrier 在释放等待线程后可以重用，所以称它为循环的 barrier。 CyclicBarrier支持一个可选的 Runnable 命令，</div> </li> <li><a href="/article/1455.htm" title="九项重要的职业规划" target="_blank">九项重要的职业规划</a> <span class="text-muted">bijian1013</span> <a class="tag" taget="_blank" href="/search/%E5%B7%A5%E4%BD%9C/1.htm">工作</a><a class="tag" taget="_blank" href="/search/%E5%AD%A6%E4%B9%A0/1.htm">学习</a> <div>一. 学习的步伐不停止古人说，活到老，学到老。终身学习应该是您的座右铭。世界在不断变化，每个人都在寻找各自的事业途径。您只有保证了足够的技能储</div> </li> <li><a href="/article/1582.htm" title="【Java范型四】范型方法" target="_blank">【Java范型四】范型方法</a> <span class="text-muted">bit1129</span> <a class="tag" taget="_blank" href="/search/java/1.htm">java</a> <div>范型参数不仅仅可以用于类型的声明上，例如 package com.tom.lang.generics; import java.util.List; public class Generics<T> { private T value; public Generics(T value) { this.value = </div> </li> <li><a href="/article/1709.htm" title="【Hadoop十三】HDFS Java API基本操作" target="_blank">【Hadoop十三】HDFS Java API基本操作</a> <span class="text-muted">bit1129</span> <a class="tag" taget="_blank" href="/search/hadoop/1.htm">hadoop</a> <div> package com.examples.hadoop; import org.apache.hadoop.conf.Configuration; import org.apache.hadoop.fs.FSDataInputStream; import org.apache.hadoop.fs.FileStatus; import org.apache.hadoo</div> </li> <li><a href="/article/1836.htm" title="ua实现split字符串分隔" target="_blank">ua实现split字符串分隔</a> <span class="text-muted">ronin47</span> <a class="tag" taget="_blank" href="/search/lua+split/1.htm">lua split</a> <div>LUA并不象其它许多"大而全"的语言那样，包括很多功能，比如网络通讯、图形界面等。但是LUA可以很容易地被扩展：由宿主语言(通常是C或 C++)提供这些功能，LUA可以使用它们，就像是本来就内置的功能一样。LUA只包括一个精简的核心和最基本的库。这使得LUA体积小、启动速度快，从而适合嵌入在别的程序里。因此在lua中并没有其他语言那样多的系统函数。习惯了其他语言的字符串分割函</div> </li> <li><a href="/article/1963.htm" title="java-从先序遍历和中序遍历重建二叉树" target="_blank">java-从先序遍历和中序遍历重建二叉树</a> <span class="text-muted">bylijinnan</span> <a class="tag" taget="_blank" href="/search/java/1.htm">java</a> <div> public class BuildTreePreOrderInOrder { /** * Build Binary Tree from PreOrder and InOrder * _______7______ / \ __10__ ___2 / \ / 4</div> </li> <li><a href="/article/2090.htm" title="openfire开发指南《连接和登陆》" target="_blank">openfire开发指南《连接和登陆》</a> <span class="text-muted">开窍的石头</span> <a class="tag" taget="_blank" href="/search/openfire/1.htm">openfire</a><a class="tag" taget="_blank" href="/search/%E5%BC%80%E5%8F%91%E6%8C%87%E5%8D%97/1.htm">开发指南</a><a class="tag" taget="_blank" href="/search/smack/1.htm">smack</a> <div>第一步官网下载smack.jar包下载地址：http://www.igniterealtime.org/downloads/index.jsp#smack 第二步把smack里边的jar导入你新建的java项目中开始编写smack连接openfire代码 p</div> </li> <li><a href="/article/2217.htm" title="[移动通讯]手机后盖应该按需要能够随时开启" target="_blank">[移动通讯]手机后盖应该按需要能够随时开启</a> <span class="text-muted">comsci</span> <a class="tag" taget="_blank" href="/search/%E7%A7%BB%E5%8A%A8/1.htm">移动</a> <div> 看到新的手机，很多由金属材质做的外壳，内存和闪存容量越来越大，CPU速度越来越快，对于这些改进，我们非常高兴，也非常欢迎但是，对于手机的新设计，有几点我们也要注意第一：手机的后盖应该能够被用户自行取下来，手机的电池的可更换性应该是必须保留的设计,</div> </li> <li><a href="/article/2344.htm" title="20款国外知名的php开源cms系统" target="_blank">20款国外知名的php开源cms系统</a> <span class="text-muted">cuiyadll</span> <a class="tag" taget="_blank" href="/search/cms/1.htm">cms</a> <div>内容管理系统，简称CMS，是一种简易的发布和管理新闻的程序。用户可以在后端管理系统中发布，编辑和删除文章，即使您不需要懂得HTML和其他脚本语言，这就是CMS的优点。在这里我决定介绍20款目前国外市面上最流行的开源的PHP内容管理系统，以便没有PHP知识的读者也可以通过国外内容管理系统建立自己的网站。 1. Wordpress WordPress的是一个功能强大且易于使用的内容管</div> </li> <li><a href="/article/2471.htm" title="Java生成全局唯一标识符" target="_blank">Java生成全局唯一标识符</a> <span class="text-muted">darrenzhu</span> <a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/uuid/1.htm">uuid</a><a class="tag" taget="_blank" href="/search/unique/1.htm">unique</a><a class="tag" taget="_blank" href="/search/identifier/1.htm">identifier</a><a class="tag" taget="_blank" href="/search/id/1.htm">id</a> <div>How to generate a globally unique identifier in Java http://stackoverflow.com/questions/21536572/generate-unique-id-in-java-to-label-groups-of-related-entries-in-a-log http://stackoverflow</div> </li> <li><a href="/article/2598.htm" title="php安装模块检测是否已安装过, 使用的SQL语句" target="_blank">php安装模块检测是否已安装过, 使用的SQL语句</a> <span class="text-muted">dcj3sjt126com</span> <a class="tag" taget="_blank" href="/search/sql/1.htm">sql</a> <div> SHOW [FULL] TABLES [FROM db_name] [LIKE 'pattern'] SHOW TABLES列举了给定数据库中的非TEMPORARY表。您也可以使用mysqlshow db_name命令得到此清单。本命令也列举数据库中的其它视图。支持FULL修改符，这样SHOW FULL TABLES就可以显示第二个输出列。对于一个表，第二列的值为BASE T</div> </li> <li><a href="/article/2725.htm" title="5天学会一种 web 开发框架" target="_blank">5天学会一种 web 开发框架</a> <span class="text-muted">dcj3sjt126com</span> <a class="tag" taget="_blank" href="/search/Web/1.htm">Web</a><a class="tag" taget="_blank" href="/search/%E6%A1%86%E6%9E%B6/1.htm">框架</a><a class="tag" taget="_blank" href="/search/framework/1.htm">framework</a> <div>web framework层出不穷，特别是ruby/python,各有10+个,php/java也是一大堆根据我自己的经验写了一个to do list,按照这个清单，一条一条的学习，事半功倍，很快就能掌握一共25条，即便很磨蹭，2小时也能搞定一条，25*2=50。只需要50小时就能掌握任意一种web框架各类web框架大同小异:现代web开发框架的6大元素，把握主线，就不会迷路建议把本文</div> </li> <li><a href="/article/2852.htm" title="Gson使用三(Map集合的处理,一对多处理)" target="_blank">Gson使用三(Map集合的处理,一对多处理)</a> <span class="text-muted">eksliang</span> <a class="tag" taget="_blank" href="/search/json/1.htm">json</a><a class="tag" taget="_blank" href="/search/gson/1.htm">gson</a><a class="tag" taget="_blank" href="/search/Gson+map/1.htm">Gson map</a><a class="tag" taget="_blank" href="/search/Gson+%E9%9B%86%E5%90%88%E5%A4%84%E7%90%86/1.htm">Gson 集合处理</a> <div>转载请出自出处：http://eksliang.iteye.com/blog/2175532 一、概述 Map保存的是键值对的形式，Json的格式也是键值对的，所以正常情况下，map跟json之间的转换应当是理所当然的事情。二、Map参考实例 package com.ickes.json; import java.lang.refl</div> </li> <li><a href="/article/2979.htm" title="cordova实现“再点击一次退出”效果" target="_blank">cordova实现“再点击一次退出”效果</a> <span class="text-muted">gundumw100</span> <a class="tag" taget="_blank" href="/search/android/1.htm">android</a> <div>基本的写法如下： document.addEventListener("deviceready", onDeviceReady, false); function onDeviceReady() { //navigator.splashscreen.hide(); document.addEventListener("b</div> </li> <li><a href="/article/3106.htm" title="openldap configuration leaning note" target="_blank">openldap configuration leaning note</a> <span class="text-muted">iwindyforest</span> <a class="tag" taget="_blank" href="/search/configuration/1.htm">configuration</a> <div>hostname // to display the computer name hostname <changed name> // to change go to: /etc/sysconfig/network, add/modify HOSTNAME=NEWNAME to change permenately dont forget to change /etc/hosts</div> </li> <li><a href="/article/3233.htm" title="Nullability and Objective-C" target="_blank">Nullability and Objective-C</a> <span class="text-muted">啸笑天</span> <a class="tag" taget="_blank" href="/search/Objective-C/1.htm">Objective-C</a> <div>https://developer.apple.com/swift/blog/?id=25 http://www.cocoachina.com/ios/20150601/11989.html http://blog.csdn.net/zhangao0086/article/details/44409913 http://blog.sunnyxx</div> </li> <li><a href="/article/3360.htm" title="jsp中实现参数隐藏的两种方法" target="_blank">jsp中实现参数隐藏的两种方法</a> <span class="text-muted">macroli</span> <a class="tag" taget="_blank" href="/search/JavaScript/1.htm">JavaScript</a><a class="tag" taget="_blank" href="/search/jsp/1.htm">jsp</a> <div>在一个JSP页面有一个链接，//确定是一个链接?点击弹出一个页面，需要传给这个页面一些参数。//正常的方法是设置弹出页面的src="***.do?p1=aaa&p2=bbb&p3=ccc"//确定目标URL是Action来处理?但是这样会在页面上看到传过来的参数，可能会不安全。要求实现src="***.do"，参数通过其他方法传！//////</div> </li> <li><a href="/article/3487.htm" title="Bootstrap A标签关闭modal并打开新的链接解决方案" target="_blank">Bootstrap A标签关闭modal并打开新的链接解决方案</a> <span class="text-muted">qiaolevip</span> <a class="tag" taget="_blank" href="/search/%E6%AF%8F%E5%A4%A9%E8%BF%9B%E6%AD%A5%E4%B8%80%E7%82%B9%E7%82%B9/1.htm">每天进步一点点</a><a class="tag" taget="_blank" href="/search/%E5%AD%A6%E4%B9%A0%E6%B0%B8%E6%97%A0%E6%AD%A2%E5%A2%83/1.htm">学习永无止境</a><a class="tag" taget="_blank" href="/search/bootstrap/1.htm">bootstrap</a><a class="tag" taget="_blank" href="/search/%E7%BA%B5%E8%A7%82%E5%8D%83%E8%B1%A1/1.htm">纵观千象</a> <div>Bootstrap里面的js modal控件使用起来很方便，关闭也很简单。只需添加标签 data-dismiss="modal" 即可。可是偏偏有时候需要a标签既要关闭modal，有要打开新的链接，尝试多种方法未果。只好使用原始js来控制。 <a href="#/group-buy" class="btn bt</div> </li> <li><a href="/article/3614.htm" title="二维数组在Java和C中的区别" target="_blank">二维数组在Java和C中的区别</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/c/1.htm">c</a><a class="tag" taget="_blank" href="/search/%E4%BA%8C%E7%BB%B4%E6%95%B0%E7%BB%84/1.htm">二维数组</a><a class="tag" taget="_blank" href="/search/%E6%95%B0%E7%BB%84/1.htm">数组</a> <div>Java代码： public class test03 { public static void main(String[] args) { int[][] a = {{1},{2,3},{4,5,6}}; System.out.println(a[0][1]); } } 运行结果： Exception in thread "mai</div> </li> <li><a href="/article/3741.htm" title="systemctl命令用法" target="_blank">systemctl命令用法</a> <span class="text-muted">wmlJava</span> <a class="tag" taget="_blank" href="/search/linux/1.htm">linux</a><a class="tag" taget="_blank" href="/search/systemctl/1.htm">systemctl</a> <div>对比表，以 apache / httpd 为例任务旧指令新指令使某服务自动启动 chkconfig --level 3 httpd on systemctl enable httpd.service 使某服务不自动启动 chkconfig --level 3 httpd off systemctl disable httpd.service 检查服务状态 service h</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>