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/1940488256630091776.htm" title="基于 Three.js 与 WebGL 的商场全景 VR 导航系统源码级解析" target="_blank">基于 Three.js 与 WebGL 的商场全景 VR 导航系统源码级解析</a> <span class="text-muted">维小帮定位导航</span> <a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a><a class="tag" taget="_blank" href="/search/vr/1.htm">vr</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF%E5%BC%80%E5%8F%91/1.htm">前端开发</a><a class="tag" taget="_blank" href="/search/%E5%9C%BA%E6%99%AF%E4%BC%98%E5%8C%96/1.htm">场景优化</a><a class="tag" taget="_blank" href="/search/WebGL/1.htm">WebGL</a><a class="tag" taget="_blank" href="/search/%E7%89%A9%E8%81%94%E7%BD%91/1.htm">物联网</a><a class="tag" taget="_blank" href="/search/%E6%99%BA%E6%85%A7%E5%95%86%E5%9C%BA/1.htm">智慧商场</a> <div>本文面向Web前端开发者、WebGL/Three.js爱好者、对VR/AR应用开发感兴趣的技术人员、智慧商场解决方案开发者。详细介绍如何利用WebGL(Three.js框架)构建高性能的商场全景VR环境，并实现精准的室内定位与3D路径规划导航功能。如需获取商场全景VR导航系统解决方案请前往文章最下方获取，如有项目合作及技术交流欢迎私信作者。一、商场全景VR导航的核心技术概述商场全景VR导航融合了全</div> </li> <li><a href="/article/1940486241329934336.htm" title="Windows 7上IIS7.0的全面应用" target="_blank">Windows 7上IIS7.0的全面应用</a> <span class="text-muted">侯昂</span> <div>本文还有配套的精品资源，点击获取简介：IIS7.0是微软为Windows7操作系统推出的Web服务器软件，具备模块化设计、高效管理和丰富的开发环境。它支持多种网络协议，包括HTTP、HTTPS和FTP，并通过集成安全机制和优化的性能特性，如应用程序池、FTP服务、URL重写等，为用户提供了强大的Web服务管理能力。IIS7.0的设计旨在提高资源利用率、管理便捷性，并确保服务器的安全稳定运行。1.I</div> </li> <li><a href="/article/1940485359297163264.htm" title="基于 Vue + RuoYi 架构设计的商城Web/小程序实训课程" target="_blank">基于 Vue + RuoYi 架构设计的商城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/boot/1.htm">boot</a><a class="tag" taget="_blank" href="/search/uni-app/1.htm">uni-app</a><a class="tag" taget="_blank" href="/search/vue.js/1.htm">vue.js</a> <div>以下是基于Vue+RuoYi架构设计的商城Web/小程序实训课程方案，结合企业级开发需求与教学实践，涵盖全栈技术栈与实战模块：一、课程概述目标：通过Vue前端+RuoYi后端（SpringBoot）开发企业级电商系统，实现多终端（Web/H5/小程序）适配，覆盖从架构设计到部署上线的全流程。周期：8周（建议每日3小时）适合人群：具备基础Java/Vue知识的开发者，熟悉HTML/CSS/JavaS</div> </li> <li><a href="/article/1940485106791673856.htm" title="微信小程序实现websocket及单人聊天功能" target="_blank">微信小程序实现websocket及单人聊天功能</a> <span class="text-muted">蝶妹妹</span> <a class="tag" taget="_blank" href="/search/%E5%BE%AE%E4%BF%A1%E5%B0%8F%E7%A8%8B%E5%BA%8F/1.htm">微信小程序</a><a class="tag" taget="_blank" href="/search/websocket/1.htm">websocket</a><a class="tag" taget="_blank" href="/search/%E5%B0%8F%E7%A8%8B%E5%BA%8F/1.htm">小程序</a> <div>一、什么是websocket：WebSocket是HTML5下一种新的协议（websocket协议本质上是一个基于tcp的协议）它实现了浏览器与服务器全双工通信，能更好的节省服务器资源和带宽并达到实时通讯的目的Websocket是一个持久化的协议二、websocket的原理：websocket约定了一个通信的规范，通过一个握手的机制，客户端和服务器之间能建立一个类似tcp的连接，从而方便它们之间的</div> </li> <li><a href="/article/1940485106296745984.htm" title="springboot+websocket+微信小程序（实现后端主动推送消息小程序的实时报警功能）" target="_blank">springboot+websocket+微信小程序（实现后端主动推送消息小程序的实时报警功能）</a> <span class="text-muted"></span> <div>Listitem本项目主要实现的需求为：主要功能汽车在行驶的过程中如果前方遇到限高杆，车前的摄像头在安全距离前测出限高杆的高度后，小程序能够实时报警（当前车辆内否安全通过）。次要功能1.车主利用微信用户名登录后能够绑定车牌，实现车牌的增删改查2.车主可以为自己的车牌号添加家庭成员（绑定微信用户名的方式）3.简单权限管理（车主拥有其名下车牌的增删改查权限，家庭成员则没有）实现方式1.后端使用spri</div> </li> <li><a href="/article/1940484979981086720.htm" title="Java web开发常见中间件多版本下载备用" target="_blank">Java web开发常见中间件多版本下载备用</a> <span class="text-muted">却诚Salong</span> <a class="tag" taget="_blank" href="/search/%E5%AE%89%E8%A3%85%E9%97%AE%E9%A2%98%E5%92%8C%E8%A7%A3%E5%86%B3%E6%96%B9%E6%B3%95/1.htm">安装问题和解决方法</a><a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/%E4%B8%AD%E9%97%B4%E4%BB%B6/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>备注：每次换电脑都要重新构建一下环境，下载找资源很麻烦，官网英文网页找个历史版本看不懂，还要慢慢去搜，所以直接整理一波，需要的自行收藏。1.nodejs自选版本下载：地址：https://nodejs.org/download/release/网速快，自选任何版本下载。2.maven自选版本下载：地址：https://archive.apache.org/dist/maven/maven-3/网速</div> </li> <li><a href="/article/1940484096941682688.htm" title="MySQL对CPU的占用率很高怎么处理" target="_blank">MySQL对CPU的占用率很高怎么处理</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/mysql/1.htm">mysql</a><a class="tag" taget="_blank" href="/search/%E6%95%B0%E6%8D%AE%E5%BA%93/1.htm">数据库</a> <div>一、确认与定位确认整体CPU使用情况top-b-n1|head-n15观察MySQL(mysqld)进程所占的%CPU。如果是多核系统，关注总和以及单核是否满载。查看系统负载uptimeLoadAverage长期高于CPU核数，说明系统压力大。查看其它进程情况psaux--sort=-%cpu|head-n10确认是否仅MySQL占用高，或与其它进程有关。二、操作系统层面排查磁盘I/O瓶颈iost</div> </li> <li><a href="/article/1940483340951941120.htm" title="配置MySQL主从复制（一主一从）" target="_blank">配置MySQL主从复制（一主一从）</a> <span class="text-muted">cici15874</span> <a class="tag" taget="_blank" href="/search/mysql/1.htm">mysql</a> <div>MySQL主从复制简介MySQL主从复制的目的是实现数据库冗余备份，将master数据库的数据定时同步到slave库中，一旦master数据库宕机，可以将Web应用数据库配置快速切换到slave数据库，确保Web应用有较高的可用性。MySQL主从同步是一个异步复制的过程，要实现复制，首先需要在master上开启bin-log日志功能，bin-log日志用于记录在master库执行的增删改更新操作的</div> </li> <li><a href="/article/1940479302260813824.htm" title="tauri v2 开源项目学习（二）" target="_blank">tauri v2 开源项目学习（二）</a> <span class="text-muted"></span> <div>前言:tauri2编程，前端部分和electron差不多，框架部分差别大，资料少，官网乱，AI又骗我所以在gitee上，寻找tauriv2开源项目，通过记录框架部分与rust部分的写法，对照确定编程方式tarui2插件，可以查看：https://github.com/tauri-apps/plugins-workspace1.EcoPastehttps://gitee.com/ayangweb/E</div> </li> <li><a href="/article/1940475517387993088.htm" title="Java SQLException: 解决“Got error 28 from storage engine”的5个步骤" target="_blank">Java SQLException: 解决“Got error 28 from storage engine”的5个步骤</a> <span class="text-muted">墨瑾轩</span> <a class="tag" taget="_blank" href="/search/%E4%B8%80%E8%B5%B7%E5%AD%A6%E5%AD%A6Java%E3%80%90%E4%B8%80%E3%80%91/1.htm">一起学学Java【一】</a><a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/adb/1.htm">adb</a><a class="tag" taget="_blank" href="/search/%E5%BC%80%E5%8F%91%E8%AF%AD%E8%A8%80/1.htm">开发语言</a> <div>关注墨瑾轩，带你探索编程的奥秘！超萌技术攻略，轻松晋级编程高手技术宝库已备好，就等你来挖掘订阅墨瑾轩，智趣学习不孤单即刻启航，编程之旅更有趣引言在使用Java进行数据库操作时，有时会遇到java.sql.SQLException:Goterror28fromstorageengine错误。这个错误通常发生在尝试插入数据到MySQL数据库时，表示存储引擎返回了一个错误码28，这通常意味着磁盘空间不足</div> </li> <li><a href="/article/1940474885046333440.htm" title="[第一章 web入门]SQL注入-2" target="_blank">[第一章 web入门]SQL注入-2</a> <span class="text-muted">weixin_40546436</span> <a class="tag" taget="_blank" href="/search/%E6%B8%97%E9%80%8F%E6%B5%8B%E8%AF%95/1.htm">渗透测试</a> <div>1通过updatexml取数据从页面发现有一个提示如果加上?tips=1的话，通过burpsuite发包可以通过updatexml来查看回显，可以通过这个取到数据下面是通过updatexml来注入，这时4步中用到语句name=admin’andupdatexml(1,concat(0x7e,(select(database())),0x7e),1)#&pass=bbname=admin’andup</div> </li> <li><a href="/article/1940474003030339584.htm" title="Spring Framework 5.0新增的WebClient" target="_blank">Spring Framework 5.0新增的WebClient</a> <span class="text-muted">svygh123</span> <a class="tag" taget="_blank" href="/search/%E7%BC%96%E7%A8%8B/1.htm">编程</a><a class="tag" taget="_blank" href="/search/spring/1.htm">spring</a><a class="tag" taget="_blank" href="/search/Java%E5%AD%A6%E4%B9%A0/1.htm">Java学习</a><a class="tag" taget="_blank" href="/search/spring/1.htm">spring</a><a class="tag" taget="_blank" href="/search/log4j/1.htm">log4j</a><a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/WebClient/1.htm">WebClient</a> <div>SpringFramework5.0引入了WebClient，这是一个新的非阻塞、响应式Web客户端API，旨在为构建响应式微服务提供更好的支持。WebClient是基于ProjectReactor的响应式流API构建的，它可以高效地处理大量的并发请求，非常适合现代微服务架构。WebClient的主要特性响应式：WebClient基于非阻塞I/O，可以处理大量的并发请求而不会阻塞线程。类型安全：A</div> </li> <li><a href="/article/1940468821890494464.htm" title="spring中maven缺少包如何重新加载，报错java: 程序包org.springframework.web.reactive.function不存在" target="_blank">spring中maven缺少包如何重新加载，报错java: 程序包org.springframework.web.reactive.function不存在</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/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/spring/1.htm">spring</a><a class="tag" taget="_blank" href="/search/maven/1.htm">maven</a> <div>错误原因分析java:程序包org.springframework.web.reactive.function不存在这个错误是由于项目中缺少SpringWebFlux相关依赖导致的。org.springframework.web.reactive.function包属于SpringWebFlux模块（用于响应式Web开发），如果你的项目需要使用该包下的类（如RouterFunction、Serve</div> </li> <li><a href="/article/1940449412002148352.htm" title="使用vue-template-loader将模板编译成渲染函数的Webpack配置技巧" target="_blank">使用vue-template-loader将模板编译成渲染函数的Webpack配置技巧</a> <span class="text-muted">前端布洛芬</span> <a class="tag" taget="_blank" href="/search/%E5%A4%A7%E7%99%BD%E8%AF%9D%E5%89%8D%E7%AB%AF%E5%85%AB%E8%82%A1/1.htm">大白话前端八股</a><a class="tag" taget="_blank" href="/search/vue.js/1.htm">vue.js</a><a class="tag" taget="_blank" href="/search/webpack/1.htm">webpack</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a> <div>大白话使用vue-template-loader将模板编译成渲染函数的Webpack配置技巧引言：被模板编译逼疯的周三下午你是否也经历过这样的场景：deadline前的周三下午，咖啡因已经失效，屏幕上却跳出Templatecompilationfailed的红色报错。Vue单文件组件（SFC）的.vue格式用腻了，想试试把模板抽成单独的.html文件，结果webpack配置直接给你脸色看。作为每天</div> </li> <li><a href="/article/1940435923544109056.htm" title="Java开发的智能新时代——如何利用AI工具提升编程效率" target="_blank">Java开发的智能新时代——如何利用AI工具提升编程效率</a> <span class="text-muted">inscode_055</span> <div>最新接入DeepSeek-V3模型，点击下载最新版本InsCodeAIIDE标题：Java开发的智能新时代——如何利用AI工具提升编程效率引言在当今快速发展的科技时代，Java作为一门广泛应用的编程语言，在企业级应用、Web开发、移动应用等领域占据着重要地位。然而，随着项目复杂度的增加和开发周期的缩短，传统的开发方式已难以满足现代开发的需求。幸运的是，智能化的工具软件如InsCodeAIIDE正逐</div> </li> <li><a href="/article/1940435797207478272.htm" title="Java 开发的智能化革命——如何借助最新工具提升编程效率" target="_blank">Java 开发的智能化革命——如何借助最新工具提升编程效率</a> <span class="text-muted">inscode_014</span> <div>最新接入DeepSeek-V3模型，点击下载最新版本InsCodeAIIDE标题：Java开发的智能化革命——如何借助最新工具提升编程效率在当今快速发展的科技时代，Java作为一门广泛应用的编程语言，依然保持着其强大的生命力和广泛的影响力。无论是企业级应用、Web开发还是移动应用开发，Java都扮演着不可或缺的角色。然而，随着项目复杂度的增加和技术更新换代的速度加快，Java开发者们面临着前所未有</div> </li> <li><a href="/article/1940429869984837632.htm" title="PHP后台代码解决跨域问题" target="_blank">PHP后台代码解决跨域问题</a> <span class="text-muted">Happiness&Rich</span> <a class="tag" taget="_blank" href="/search/php/1.htm">php</a><a class="tag" taget="_blank" href="/search/%E8%B7%A8%E5%9F%9F/1.htm">跨域</a> <div>在前端里面，解决跨域的时候总显得那么的恶心，什么jsonp啊，ajax啊，CORS啊什么的，总觉得是在钻空子进行跨域，其实在PHP文件里面只需要加一段代码就可以跨域了，前端你该怎么写还是怎么写，post，get随便用：header("Access-Control-Allow-Origin:*");header('Access-Control-Allow-Methods:POST');header(</div> </li> <li><a href="/article/1940428857941225472.htm" title="GlobalFilter、Filter关系" target="_blank">GlobalFilter、Filter关系</a> <span class="text-muted">m0_63486540</span> <a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/java/1.htm">java</a> <div>维度GlobalFilterFilter技术体系SpringCloudGateway+WebFluxJavaServletAPI编程模型响应式(Reactive)阻塞式(Imperative)作用范围全局（所有路由）可配置路径模式执行效率更高（基于事件循环）较低（线程池模型）配置方式SpringBean自动注册web.xml或@WebFilter如何选择？如果你正在开发API网关或微服务入口，使用</div> </li> <li><a href="/article/1940427340739833856.htm" title="前端代码规范及最佳实践" target="_blank">前端代码规范及最佳实践</a> <span class="text-muted">forlong401</span> <a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/HTML5/1.htm">HTML5</a> <div>http://coderlmn.github.io/code-standards/概述本文档包含了Isobar公司的创意技术部（前端工程）开发web应用的规范。现在我们把它开放给任何希望了解我们迭代过程最佳实践的人。编写本文档的主要驱动力是两方面：1)代码一致性以及2)最佳实践。通过保持代码风格和传统的一致性，我们可以减少遗留系统维护的负担，并降低未来系统崩溃的风险。而通过遵照最佳实践，我们能确保</div> </li> <li><a href="/article/1940421287197339648.htm" title="【Django开发】前后端分离django美多商城项目第3篇：用户注册业务实现,用户注册前端逻辑【附代码文档】" target="_blank">【Django开发】前后端分离django美多商城项目第3篇：用户注册业务实现,用户注册前端逻辑【附代码文档】</a> <span class="text-muted"></span> <div>教程总体简介：欢迎来到美多商城！项目需求分析1.项目主要页面介绍2.归纳项目主要模块3.知识要点项目架构设计1.项目开发模式2.项目运行机制项目介绍创建工程1.准备项目代码仓库3.创建美多商城工程配置开发环境1.新建配置文件2.指定开发环境配置文件配置Jinja2模板引擎1.安装Jinja2扩展包配置MySQL数据库3.安装PyMySQL扩展包配置Redis数据库1.安装django-redis扩</div> </li> <li><a href="/article/1940421034138202112.htm" title="Laravel 阿里云 OSS 视频上传完整方案" target="_blank">Laravel 阿里云 OSS 视频上传完整方案</a> <span class="text-muted"></span> <a class="tag" taget="_blank" href="/search/phplavarel/1.htm">phplavarel</a> <div>一、环境准备1.1安装OSSSDKcomposerrequirealiyuncs/oss-sdk-php1.2环境配置在.env文件中添加：OSS_ACCESS_KEY_ID=你的AccessKeyIdOSS_ACCESS_KEY_SECRET=你的AccessKeySecretOSS_ENDPOINT=oss-cn-hangzhou.aliyuncs.comOSS_BUCKET=你的Bucket</div> </li> <li><a href="/article/1940418139183443968.htm" title="SoK: A Critical Evaluation of Efficient Website Fingerprinting Defenses" target="_blank">SoK: A Critical Evaluation of Efficient Website Fingerprinting Defenses</a> <span class="text-muted"></span> <div>2023攻击和防御模型防御评估准确度、精确度和召回率：使用准确率来评估攻击模型在多类别封闭世界设置中的性能，但在二进制开放世界设置中使用精确率和召回率防御策略：（1）增加虚拟流量、（2）增加流量延迟、（3）将流量从一个流移到另一个流固定速率发送流量F，随机抽样以添加填充R，修改流量以产生与目标流量样本或模式的碰撞C，将流量分成多个流S，使用对抗性扰动来欺骗机器学习模型AF：（1）（2）BuFLO,</div> </li> <li><a href="/article/1940417761251487744.htm" title="通过 Java 调用 ChromeDriver 启动 Chrome 浏览器后，当用户**手动点击按钮**时导致标签页崩溃" target="_blank">通过 Java 调用 ChromeDriver 启动 Chrome 浏览器后，当用户**手动点击按钮**时导致标签页崩溃</a> <span class="text-muted">Esengnet</span> <a class="tag" taget="_blank" href="/search/java/1.htm">java</a> <div>importorg.openqa.selenium.WebDriver;importorg.openqa.selenium.chrome.ChromeDriver;importorg.openqa.selenium.chrome.ChromeOptions;importorg.openqa.selenium.remote.CapabilityType;importjava.util.HashMap</div> </li> <li><a href="/article/1940401241993572352.htm" title="SQL SELECT INTO语句" target="_blank">SQL SELECT INTO语句</a> <span class="text-muted">Lu鹿夫人</span> <a class="tag" taget="_blank" href="/search/sql/1.htm">sql</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/sqlserver/1.htm">sqlserver</a> <div>SQLSELECTINTO语句通过SQL，您可以从一个表复制信息到另一个表。SELECTINTO语句从一个表复制数据，然后把数据插入到另一个新表中。SQLSELECTINTO语句注意：MYSQL数据库不支持SELECT…INTO语句，但支持INSERTINTO…SELECT。可以使用以下语句来拷贝表结构及数据：CREATETABLE新表ASSELECT*FROM旧表SQLSELECTINTO语法1</div> </li> <li><a href="/article/1940389259512967168.htm" title="从0到1构建智能招聘数据引擎：基于 Python 的 BOSS直聘信息采集实战与反爬破解指南" target="_blank">从0到1构建智能招聘数据引擎：基于 Python 的 BOSS直聘信息采集实战与反爬破解指南</a> <span class="text-muted">程序员威哥</span> <a class="tag" taget="_blank" href="/search/python/1.htm">python</a><a class="tag" taget="_blank" href="/search/%E5%BC%80%E5%8F%91%E8%AF%AD%E8%A8%80/1.htm">开发语言</a> <div>前言在大数据浪潮席卷的时代，招聘平台蕴藏着海量的岗位信息，揭示着行业走向、人才趋势、薪资结构等核心价值。BOSS直聘作为国内极具代表性的直招平台，其数据对职业分析、市场监测甚至智能推荐系统的构建都有着重要意义。本文将手把手带你打造一个高质量、抗封锁的Python爬虫系统，精准采集BOSS直聘网的岗位数据，并全面解析其中涉及的反爬机制识别、加密参数处理、数据提取与存储等高级技巧，助你在Web数据采集</div> </li> <li><a href="/article/1940386738786594816.htm" title="物联网实战：多语言（Java、Go、Rust、C++、C#、Rust）设备接入与数据处理" target="_blank">物联网实战：多语言（Java、Go、Rust、C++、C#、Rust）设备接入与数据处理</a> <span class="text-muted">KENYCHEN奉孝</span> <a class="tag" taget="_blank" href="/search/Rust/1.htm">Rust</a><a class="tag" taget="_blank" href="/search/C%2B%2B/1.htm">C++</a><a class="tag" taget="_blank" href="/search/go/1.htm">go</a><a class="tag" taget="_blank" href="/search/spring/1.htm">spring</a><a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/vue.js/1.htm">vue.js</a><a class="tag" taget="_blank" href="/search/rust/1.htm">rust</a><a class="tag" taget="_blank" href="/search/c%2B%2B/1.htm">c++</a> <div>SpringBoot物联网设备接入与数据处理实例物联网（IoT）设备接入与数据处理是SpringBoot的常见应用场景之一。以下是一个完整的实例，涵盖设备接入、数据传输、数据处理和存储等关键环节。设备接入物联网设备通常通过MQTT、HTTP或WebSocket等协议接入系统。MQTT是物联网领域最常用的轻量级协议。//MQTT配置类@ConfigurationpublicclassMqttConf</div> </li> <li><a href="/article/1940386360187744256.htm" title="image-webpack-loader 使用教程" target="_blank">image-webpack-loader 使用教程</a> <span class="text-muted">毛炎宝Gardener</span> <div>image-webpack-loader使用教程image-webpack-loaderImageloadermoduleforwebpack项目地址:https://gitcode.com/gh_mirrors/im/image-webpack-loader1.项目目录结构及介绍image-webpack-loader是一个用于Webpack的图片压缩加载器。由于该仓库主要是npm包而非独立的应</div> </li> <li><a href="/article/1940385855512309760.htm" title="分布式 ID 生成方案对比：Snowflake、UUID、KSUID 该怎么选？" target="_blank">分布式 ID 生成方案对比：Snowflake、UUID、KSUID 该怎么选？</a> <span class="text-muted">田猿笔记</span> <a class="tag" taget="_blank" href="/search/%E7%9F%A5%E8%AF%86%E9%9B%86%E5%90%88/1.htm">知识集合</a><a class="tag" taget="_blank" href="/search/nodeJs/1.htm">nodeJs</a><a class="tag" taget="_blank" href="/search/%E9%AB%98%E7%BA%A7%E5%BA%94%E7%94%A8/1.htm">高级应用</a><a class="tag" taget="_blank" href="/search/%E5%88%86%E5%B8%83%E5%BC%8F/1.htm">分布式</a><a class="tag" taget="_blank" href="/search/node.js/1.htm">node.js</a> <div>分布式ID生成方案对比：Snowflake、UUID、KSUID该怎么选？在分布式系统中，如何生成全局唯一ID是一个常见问题。不同的ID生成方案各有优缺点，本文将对比Snowflake、Sonyflake、UUIDv1/v4、XID、KSUID以及自定义ID，并给出Node.js实现示例，帮助你选择最适合的方案。1.为什么需要分布式ID？在单机系统中，可以使用数据库自增ID（如MySQL的AUTO</div> </li> <li><a href="/article/1940383836261117952.htm" title="MySQL数据库核心技术深度解析：SQL语句最佳实践与性能优化指南" target="_blank">MySQL数据库核心技术深度解析：SQL语句最佳实践与性能优化指南</a> <span class="text-muted">有趣的灵魂465</span> <a class="tag" taget="_blank" href="/search/mysql/1.htm">mysql</a> <div>MySQL数据库大师之路：从语法精要到高阶优化全攻略一、开篇：构建系统化的MySQL知识体系在完成《MySQL数据库技术》课程学习后，我通过300+小时的实战演练和源码研究，形成了这套覆盖MySQL5.7/8.0核心技术的知识体系。本文不仅包含标准SQL语法，更将深入InnoDB存储引擎原理、索引实现机制和事务隔离级别的底层实现，帮助开发者跨越从"会写SQL"到"精通数据库"的鸿沟。二、数据库设计</div> </li> <li><a href="/article/1940383206536704000.htm" title="ASP.NET Core + Vue.js前后端分离黄金法则：从零到部署的深度实战" target="_blank">ASP.NET Core + Vue.js前后端分离黄金法则：从零到部署的深度实战</a> <span class="text-muted">墨夶</span> <a class="tag" taget="_blank" href="/search/C%23%E5%AD%A6%E4%B9%A0%E8%B5%84%E6%96%99/1.htm">C#学习资料</a><a class="tag" taget="_blank" href="/search/asp.net/1.htm">asp.net</a><a class="tag" taget="_blank" href="/search/vue.js/1.htm">vue.js</a><a class="tag" taget="_blank" href="/search/%E5%90%8E%E7%AB%AF/1.htm">后端</a> <div>——跨域、热更新、容器化部署一网打尽为什么选择前后端分离？在微服务与敏捷开发盛行的今天，前后端分离架构已成为企业级应用的标配。本文将通过12个实战代码示例、跨域问题终极解决方案和Docker部署全流程，手把手教你实现：零配置跨域通信Vue热重载+WebAPI实时调试JWT身份验证与权限控制生产环境优化与容器化部署一、环境准备与项目搭建1.1开发环境配置工具版本要求官网链接.NET8SDK8.0.1</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>