1.2基 本格式
1.
文档声明,告诉计算机这是一个 HTML5
文档,
不分大小写但一般都这样写 。
对比一下 HTML4
的声明文档:
"
http://www.w3.org/TR/html4/loose.dtd
">
2.
双标签,所有的文档内容均包含在这个标签里面。
3.
不可见内容,包含文档标题、字符编码等。
4.
可见内容 ,
图片、文本表单等所有可见内容
开始标签
head标签存放文档的基本信息,不可见元素
弹出对话框输出内容“xxx”
结束标签
1.3 元素的概念与3个常用标签
HTML 元素指的是从开始标签到结束标签的所有代码。
开始标签
元素内容
结束标签
h标签用来表示标题
p标签表示一个段落
我是一个单标签,我会给文档加一个横线
*注意我没有结束标签哦!
1.5 文本元素
文本元素,就是讲一段文本设置成相匹配的结构和含义
1.b元素: 我的作用就是 加粗文字 ;
2.br元素: 我的作用就是强制换行; 在同一个段落要换行用这个
3.i元素: 我的作用就是让 文字倾斜 ;
4.del元素 : 我的作用就是 删除文子
5.strong元素 : 我的作用是强调一段文本 我的实际作用也是加粗文字 .
6.wbr元素: 我的作用是表示安全换行Theshiyigehenchanghenchangdedanci.
再来对比一下没有安全换行的文本 Theshiyigehenchanghenchangdedanci.
7.em元素: 我的作用是强调,我的实际作用也是让文字倾斜
8.s元素 : 我的实际作用就是 删除线 ;从语义上来看,表示不准确的删除。
9.u元素: 我的实际作用就是 给文字加下划线
10.ins元素: 我的实际作用也是 给文字加下划线 ;从语义上来看,是添加一段文字,起到强调作用。
11.small元素: 我的作用是 添加小号字体 ,从语义上来看,用于免责声明和澄清声明。
12.sub和sup元素:我们的作用就是添加下标和上标: sub表示下标:HTML5 ;sup表示上标我的房子100m2
13.dfn元素: 我的作用从语义上看表示定义术语,是对一个词或短语的解释,实际效果就是倾斜文本
14.abbr元素: 我的作用是表示一段文本的缩写,在文本显示上没有任何实际效果,比如WTO
15.q元素: 我的作用从语义上看表示引用来自其他地方的的内容, 我的实际作用就是给文本加上双引号
16.code等元素: code元素用来表示计算机代码片段;function(){}
var元素用来表示编程语言中的变量; num
samp元素表示程序或计算机的输出您没有权限浏览该网页
kbd元素表示某部分内容是由用户利用键盘输入如:请按Enter键
*这几个元素属于英文范畴,必须将lang="en",英语才能体现效果。
17.ruby元素: 我的作用是表示位于表意文字上方或右方的注音符英雄yingxiong ***不常用,浏览器支持不太好,很多浏览器不支持此功能
18.cite元素: 我的作用从语义上来看就是表示引用其他作品的标题。 实际效果就是文本
19.bdo元素: 我的功能是设置文字方向,必需使用 dir属性才可以设置,共两个值,rtl(从右到左);ltr(从左到右)默认为ltr
rtl就是从右到左,即:right to left
20.mark元素: 我的作用是突出显示文本,用于记号, 我的实际作用就是加上一个黄色的背景。
21.time元素: 我的作用从语义上来看就是表示日期和时间,例如 2015-9-18
22.span元素 : 我的作用就是表示一般性的文本,没有特殊效果
dir 属性规定元素内容的文本方向 , 共两个值, rtl(从右到左);ltr(从左到右)默认为ltr ;
dir 属性在以下标签中无效: , , , , , 以及 。
1.7超链接1
学习要点:掌握a标签建立连接的几种方式
1. 连接其他网址(输入要连接到的网址)
1.百度一下
2.连接本地文档 (直接输入本地文件地址)
八阵图
3.图片链接(必须假后缀名啊)
这个是元素的嵌套,图片地址必须要有后缀名不然无法打开 通过点击图片会跳转到对应链接
src
属性: 加图片链接地址,可以是本地的也可以是网页的;
4.邮箱连接(服务器配置要发邮件就会自动打开)
联系我
5.下载链接(服务器要提供下载的东西,当浏览器不能解析就是下载)
11
目录语法:
同一个目录:直接写文件名称
或
./
文件名
比如:
tp.jpg
或者
./tp.jpg
在下级(子)目录:
xxx/tp.jpg
在下下级目录:
xx/xxx/tp.jpg
在上级(父)目录:
../tp.jpg
在上上级目录:
../../tp.jpg
1.7超链接2
1.target
属性的四个值:
_self :点击超链接时就在当前位置打开页面,默认值;
八阵图
_blank:
点击超链接时新建一个窗口打开
;
百度
_top(
最顶层框架
)
和
_parent(
父框架
)
2.id 属性:通用属性,可以理解为元素的身份证;name 属性:可以理解为元素的名字
锚点1 作用:点击上面的就会定义到下面对应的内容
锚点2 href属性值是#+下面定义的id属性值
锚点3
锚点1 只有 标签没有结束标签
这里就可以输入锚点1的内容了
锚点2
锚点2内容
锚点3
锚点3内容
1.9元素嵌入图片
img的属性
1.src:必要属性,指定图片来源的路径;
2.alt属性:当图片无法显示时的替代文字;
3.width和height属性,指定图片的宽度和高度;单位是像素px或百分比(width百分比是相对与body页面大小,heigth百分比无意义)
title属性
title 属性:属性值为字符串,效果是当鼠标移动到该位置时显示该内容。
1.10绝对路径和相对路径
绝对路径
需要指出链接资源的绝对位置,与你的HTML 文档的位置无关; 1. 服务器中的位置:href=" http://www.nipic.com/show/2/52/8144173k9c3cc84f.html " 2. 本地存储的位置: file:///D:\ 桌面\HTML5 课程\HTML5 入门实例课程\lesson9\ 西施.png
相对路径
如果链接资源与你的 HTML 文档位于同一个路径或者文件夹里,可以省略;否则必须指出相对路径,和 HTML 文档的位置有关;
目录语法: 同一个目录:直接写文件名称 或 ./ 文件名 比如: tp.jpg 或者 ./tp.jpg 在下级(子)目录: xxx/tp.jpg 在下下级目录: xx/xxx/tp.jpg 在上级(父)目录: ../tp.jpg 在上上级目录: ../../tp.jpg
1.11列表
无序列表
1无序列表的基本格式
2无序列表type的属性
无序列表的 type 属性 有三个值:1.disc (默认值 实心小圆 ;2.circle 空心小圆 ;3.square 小方块
注意: type 属性, html5 不提议直使用 type 属性设置样式,应该用 css 样式表实现内容和样式的分离来。 css 可以设置复杂的样式。
有序列表
1有序列表的基本格式
列表内容
列表内容
列表内容
……………
2有序列表的type属性
整数(默认值); 2. 大(小)写字母 A\B\C...3. 大小写的罗马字母: i ii .../I II III
列表内容
列表内容
列表内容
列表内容
3有序列表的start属性
定义列表的开始序号,比如第一项不是数字 1 ,而是从 10 开始 .......
列表内容
列表内容
4有序列表的value属性
定义某个单个列表项的序号....... value 属性是放在 标签里面的
列表内容
列表内容
列表内容
列表内容
列表内容
列表内容
自定义列表
自定义列表项组成:由 dl 定义列表; dt 定义列表项目; dd 定义列表内容
列表名称1
列表内容
列表名称2
列表内容
列表名称3
列表内容
1.12表格元素
学习要点:
表格的基本构成 表格的属性 表格的合并
1.表格构成的3个基本要素
table:表格的范围,外框;用来定义表格,表格的其他元素包含在table标签里面; tr: 表格的行; td:表格的单元格 border属性定义表格的边框宽
单元格1 单元格2 第一行
单元格1 单元格2 第二行
margin属性设置页面外边距为0,margin:0; padding:0; list-style:none;全部布满网页中所有的元素的外边距和内边距都为0项目列表前的类型为无
2.关于表格的一点说明
HTML5 中删除了 HTML4 中 table 的大部分属性, HTML5 中推荐使用 CSS 设定原来 table 属性实现的效果
3.th元素,为表格添加标题行
th 元素用来定义表格的标题单元格,他是 tr 元素的子元素,必须放在tr 标签里边( 和td 元素一样) ;tr 元素的内容会自动居中对齐并加粗文字
标题1 标题2 标题3 --->表格的标题
单元格1 单元格2 第一行
单元格1 单元格2 第二行
……………………
4.colspan元素用来横向合并单元格
属性值为正整数,表示该单元格合横向合并的列数,语法为
则在右边两列删除2 个单元格才行
标题1 标题2 --->表格的标题
单元格1 第一行
单元格1 单元格2 第二行
……………………
5.rowspan元素用来纵向合并单元格
属性值为正整数,表示该单元格合纵向向合并的行数数,语法为
则在下面两行分别删除一个单元格才行
标题1 标题2 标题3
单元格1 单元格2 第一行
单元格1 单元格2 第二行
标题1 标题2 标题3
单元格2
单元格2
……………………
6.caption元素用来为表格添加标题
用来制定表格的标题或者说明;是table的子元素,必须放在table中使用。
caption的align属性可以
设置标题的位置, 但是,在HTML5中已经被废弃,不推荐使用,建议使用CSS样式设置。
表格标题
单元格1 单元格2 第一行
单元格1 单元格2 第二行
7.thead/tbody/tfoot元素
thead 元素:表格的表头;tfoot 元素: 表格的页脚;tbody 元素:表格的主体;表格规范的写法应该包含这三部分内容。注:这三个主要结合 CSS 、 javaScript 来使用
标题
--表格的表头
标题行1 标题行2
表格的主体
单元格1 单元格2 单元格3 单元格4
单元格1 单元格2 单元格3 单元格4
单元格1 单元格2 单元格3 单元格4
单元格1 单元格3 单元格4
单元格1 单元格3 单元格4
单元格1 单元格2 单元格3 单元格4
表格的页脚
备注:
8.colgroup元素 设置列的宽度
colgroup 元素用来 组合列 ,他的span 属性可以设置组合列的数目;它可以包含一个子元素 col; colgroup 元素为table 元素的子元素, 必须放在caption 元素之后,thead 元素之前 。
table
span默认为1,表示1列,span=n表示n列都是后面的宽度,
要设置不同列不同宽度,就像这样写几个colgroup。
title
单元格 单元格 单元格
单元格 单元格 单元格
单元格 单元格 单元格
单元格 单元格 单元格 设置这行单元格高度
单元格 单元格 单元格
备注:
9.col元素 是单标签,设置列的属性,如颜色
col元素用来设定列的属性,他也可以使用span属性; col元素一般作为colgroup元素的子元素配合使用。
表格例子:
css样式表格
特殊符号的使用
符号 实体名称 实体数值 描述
1 2 3 4
其他的特殊符号大家可以在网上查看就可以。
1.14特殊符号的使用
1.HTML 实体
在 HTML 中,某些字符是预留的。
在 HTML 中不能使用小于号(<)和大于号(>),这是因为浏览器会误认为它们是标签。
如果希望正确地显示预留字符,我们必须在 HTML 源代码中使用字符实体(character entities)。
实体元素:有些特殊符号浏览器是不能解析的,就要用特殊符号的实体代替,eg :
表示一个空格,参考
《HTML 实体符号参考手册》
你可能感兴趣的:(html)
How to learn html?基于chatGLM-b生成示例(仅供参考)
不是吧这都有重名
html 前端
如何学习HTML目录章节11.1.HTML基础概念章节22.1.HTML文档结构章节33.1.HTML基本标签章节44.1.HTML文本格式化章节55.1.HTML列表和表格章节66.1.HTML表单和输入章节77.1.HTML图片和多媒体章节88.1.HTML链接与导航章节99.1.HTML样式与CSS的基本应用章节1010.1.HTML常用属性与属性标签章节1111.1.HTML注释与特殊字符
C/C++炫酷烟花③(完整代码)
Want595
C/C++趣味编程 c++ 开发语言
系列专栏《Python趣味编程》《C/C++趣味编程》《HTML趣味编程》《Java趣味编程》写在前面C/C++语言实现新春烟花动画的完整代码。
SpringBoot Web开发中的Thymeleaf模版引擎
利瑞华
spring boot 前端 后端
在SpringBoot的Web开发中,模板引擎是处理视图层的重要组件之一。在众多模板引擎中,Thymeleaf以其优雅的自然模板设计和对HTML的良好支持,成为了SpringBoot官方推荐的模板引擎。本文将详细介绍如何在SpringBoot项目中使用Thymeleaf模板引擎进行Web开发。Thymeleaf简介Thymeleaf是一个用于Web和独立环境的现代服务器端Java模板引擎。它类似于
可爱狗狗的404动画页面HTML源码
酷爱码
html html5 前端
源码介绍可爱狗狗的404动画页面HTML源码,源码由HTML+CSS+JS组成,记事本打开源码文件可以进行内容文字之类的修改,双击html文件可以本地运行效果效果预览源码获取可爱狗狗的404动画页面HTML源码
由于直接提供完整的游戏商城代码超出了简单回答的范围,并且游戏商城的实现可以相当复杂,涉及前端展示、后端逻辑、数据库设计等多个方面,我会分别用几种流行的编程语言和技术栈概述如何开始搭建一个基本的游戏商城
编程小飞侠a
游戏 前端 数据库
前端(HTML/CSS/JavaScript+React)React示例:fengbaoshun.com首先,你需要安装Node.js和npm(Node包管理器),然后使用CreateReactApp来快速启动你的前端项目。bashnpxcreate-react-appgame-store-frontendcdgame-store-frontendnpmstart接下来,你可以使用React组件来
由于直接提供完整的大型项目代码(如购物商城)在单一回答中是不切实际的,我将为你概述如何在几种流行的编程语言中设置购物商城的基本框架和思路。这包括前端(如HTML/CSS/JavaScript)和后端(
SigridFelix
前端 html css
前端(HTML/CSS/JavaScript)dz61.comHTML:创建基础的页面结构,如主页、商品列表页、购物车页和结账页。html我的购物商城欢迎来到我的购物商城商品列表购物车CSS:简单的样式表,用于美化页面。css/*styles.css*/body{font-family:Arial,sans-serif;}h1{color:#333;}ul{list-style-type:none
使用Python爬虫抓取与分析航班信息:从数据采集到应用的完整实践
Python爬虫项目
2025年爬虫实战项目 python selenium 自动化 爬虫 开发语言 php microsoft
目录:前言爬虫基础知识什么是爬虫?爬虫的工作原理爬虫的应用领域航班数据爬取的实际应用航班数据分析的重要性选择爬虫技术栈常见的爬虫框架与工具选择合适的工具:requestsvsSeleniumvsScrapy如何获取航班信息航班数据来源分析航班信息的结构与抓取目标爬虫抓取航班信息的步骤发送HTTP请求并获取航班数据使用Selenium抓取动态数据解析HTML页面并提取航班信息航班数据存储与处理存储抓
在线考试题库抓取:Python 爬虫抓取各类在线考试平台题库和试题
Python爬虫项目
2025年爬虫实战项目 python 爬虫 开发语言 网络爬虫
目录引言1.确定目标网站和分析网页结构示例网站:网页分析:2.安装必要的Python库3.编写爬虫代码3.1发送HTTP请求3.2解析HTML页面3.3存储数据4.处理分页抓取4.1分析分页规则5.反爬虫机制与应对策略5.1设置请求头5.2使用代理池5.3控制请求频率6.小结引言随着教育信息化的进程不断加快,在线考试逐渐成为了教育评估的主流形式之一。许多在线学习平台和考试平台为用户提供了海量的题库
python实现坐标系转换_python – 执行坐标系转换的库?
weixin_39622150
python实现坐标系转换
您可以使用shapely库:http://toblerity.org/shapely/manual.htmlfromshapely.geometryimportPointfromfunctoolsimportpartialimportpyprojfromshapely.opsimporttransformpoint1=Point(9.0,50.0)print(point1)project=part
访问DOM元素(节点)
froginwe11
开发语言
DOM(文档对象模型)是Web开发中用于处理HTML和XML文档的标准接口,它允许开发者通过脚本语言(如JavaScript)动态地访问和修改文档的结构、内容和样式。在DOM中,文档的每个部分都被视为一个节点,包括元素、文本、属性等。访问DOM元素(节点)DOM提供了一系列方法来访问和操作元素(节点):getElementById():通过元素的ID获取元素节点。例如,document.getEl
Java web 富文本内容生成转为word格式并导出下载
摘星喵Pro
java web 编程技巧 java 前端 servlet
Javaweb富文本内容生成转为word格式并导出下载最近思路,按标签逐一解析,实现复杂一点但是完美解决问题:https://blog.csdn.net/a2272062968/article/details/126227076思路:Word是完全支持html标签的,但是富文本内容并不是完整的html代码,需要先补全html标签,然后转码输出问题:虽然导出worddoc但是事件内容流还是htm,只
HTML+CSS初学 (day3)
灵封~
html 前端 css
HTML,全称为超文本标记语言(HyperTextMarkupLanguage),是一种用于创建网页的标准标记语言。HTML是构建Web页面的基础,它使用一系列称为标签的关键字来定义页面的结构。一、HTML的基本概念定义:HTML通过标签来描述网页中的各个元素,如标题、段落、图片、链接等。这些标签告诉浏览器如何显示内容,包括文字、图片、视频等。作用:定义网页的结构和内容,使网页内容能够按照预定的格
Thymeleaf基础知识语法
沐暖沐
thymeleaf 开发语言
1、简介Thymeleaf是⾯向Web和独⽴环境的现代服务器端Java模板引擎,能够处理HTML、XML、JavaScript、CSS、TEXT、RAW这六种模板。这六种模版模式包含两种标记模板模式(HTML和XML),三种⽂本模板模式(TEXT,JAVASCRIPT和CSS)和⼀个⽆操作模板模式(RAW)。①简单表达式变量表达式:${…}选择变量表达式:*{…}消息表达:#{…}链接URL表达式
csdn编写技巧
大哥喝阔落
python 图像处理
在CSDN的Markdown编辑器中,默认情况下不支持直接修改字体颜色,因为标准的Markdown语法并不支持字体颜色的设置。不过,CSDN的编辑器支持HTML标签,因此可以通过嵌入HTML代码来实现字体颜色的修改。方法1:使用HTML标签你可以使用标签或标签来设置字体颜色。示例1:使用标签这是红色字体这是蓝色字体这是绿色字体这是红色字体这是蓝色字体这是绿色字体示例2:使用标签这是红色字体这是蓝色
web自动化——前端知识
大哥喝阔落
前端 自动化 运维
是HTML中的一个元素,用于在当前网页中嵌入另一个网页或文档。它就像一个“窗口”,可以在页面中显示其他内容。主要特点:嵌入外部内容:可以在网页中嵌入其他网页、视频、地图等。独立上下文:嵌入的内容与主页面相互独立,拥有自己的JavaScript和CSS环境。可定制:可以通过属性调整大小、边框等。常用属性:src:指定要嵌入内容的URL。width和height:设置iframe的宽度和高度。fram
html手机端富文本,移动端富文本踩坑
weixin_39608657
html手机端富文本
最近在做一个vue的项目。之前的前端同事离职了,和女朋友去云南潇洒去了,剩下我一个苦逼坐在电脑前哒哒哒敲代码。刚刚接手就开始做移动端富文本编辑器的需求。主管说压了半个月,尽快做出来。在网上找了不少编辑器,前段时间做过react的后台项目,用了百度的编辑器。功能很多很强,遗憾的是ios不支持flash,在移动端并不适用。因为要兼容ios和Android,而且还要在vue的项目中使用,在网上找了很多编
【jQuery】jQuery 处理 Ajax 以及解决跨域问题的方式
一二¬
前端 jquery javascript 前端
文章目录HTTP原生创建AjaxjQuery处理Ajax$.ajax()$().load()$.get()$.post()跨域CORSJSONPiframewebsocketsHTTP超文本传输协议(HTTP,HyperTextTransferProtocol)是互联网上应用最为广泛的一种网络协议。设计HTTP最初的目的是为了提供一种发布和接收HTML页面的方法。一次HTTP操作称为一个事务,其工
element-plus select 滚动加载更多
日积一沙
javascript
思路:监听select下拉面板的滚动事件,滚动到底部时,调用接口加载更多数据一、自定义指令importtype{Directive,DirectiveBinding}from"vue";interfaceElTypeextendsHTMLElement{copyData:string|number;__handleClick__:any;}constloadmore:Directive={moun
Flask框架-Python系列(一)—— 基础入门(flask库安装及简单使用)
云霄IT
python库教程 python flask 后端
目录一、flask库安装二、简单使用三、前端返回类型设置(一)返回文本类型(二)返回json类型(三)重定向到另一路由(四)返回html类型,嵌入js,css,image等内容(一)py文件(二)html文件写法(三)静态目录结构四、静态资源路径修改五、实现提供文件下载一、flask库安装pipinstallflask二、简单使用fromflaskimportFlask,requestapp=Fl
JAVA 安装教程
连云港大帅哥
java基础 java jdk 安装 配置环境变量
下载官网地址:http://www.oracle.com/technetwork/java/javase/downloads/index.html,选择1.8版本jdk进行下载安装JDK直接运行exe可执行程序,默认安装即可;备注:路径可以自己定义,不建议路径包含中文名、特殊符号、空格。配置环境变量1)新建变量名:JAVA_HOME,变量值:D:\Java8(JDK安装路径);2)打开PATH,添
ThreeJS实现波纹粒子效果
weixin_30500473
javascript ViewUI
今天我们来用ThreeJS的库实现一个波纹粒子效果,我们用到的ThreeJS的库有CanvasRenderer.js,OrbitControls.js,Projector.js,stats.min.js和three.js。这些库都是不可或缺的,我们先来看看实现的效果,如下图所示。我们再来看看项目结构是怎么样的,项目结构如下图所示。我们的效果全部写在了index.html里,现在我们直接贴出inde
HTML `<head>` 元素详解
浪浪山小白兔
html 前端
在HTML文档中,元素是一个非常重要的部分,它包含了文档的元数据(metadata)和其他与文档相关的信息。虽然中的内容不会直接显示在网页上,但它对网页的行为、样式和搜索引擎优化(SEO)有着至关重要的影响。本文将详细介绍元素及其常见子元素的使用方法,并通过丰富的示例帮助你更好地理解和应用。1.元素概述元素是HTML文档的头部部分,位于标签内,标签之前。它主要用于定义文档的元数据、链接外部资源、设
深入理解 HTML DOM:文档对象模型详解
浪浪山小白兔
html 前端
在前端开发中,HTMLDOM(文档对象模型,DocumentObjectModel)是一个非常重要的概念。它是浏览器将HTML文档解析为一个树形结构的方式,开发者可以通过JavaScript动态地访问和操作文档的内容、结构和样式。本文将详细介绍HTMLDOM的核心概念、功能以及实际应用。1.什么是HTMLDOM?HTMLDOM是浏览器将HTML文档解析为一个树形结构的编程接口。它将文档中的每个部分
css粒子效果
HainesFreeman
css 前端 html
htmlcss:body{height:100vh;background:radial-gradient(ellipseatbottom,#1b27350%,#090a0f100%);overflow:hidden;filter:drop-shadow(0010pxwhite);}@functionrandom_range($min,$max){$rand:random();$random_ran
html文字旋转以后变形,关于css:CSS3中的变形处理transform功能旋转缩放倾斜移动
weixin_39974958
html文字旋转以后变形
1transform属性在CSS3中,能够利用transform性能实现文字或图像的旋转、缩放、歪斜、挪动这4中类型的变形解决。(1)浏览器反对到目前为止:Safari3.1以上、Chrome8以上、Firefox4以上、Opera10以上浏览器反对该属性。2旋转应用rotate办法,在参数中退出角度值,角度值前面跟示意角度单位的“deg”文字即可,旋转方向为顺时针方向。transform:rot
js 变量提升 函数提升 作用域
huch_shyh
前端 变量提升 函数提升 作用域
再说这个知识点前,我们先了解下javascript语言的本质。简单来说js是一个脚本语言,是介于标记语言(例html中使用的标签等是一种被动的,被用来浏览\显示的,无行动能力)与编程语言(具有逻辑性和行为能力,这是主动的)之间,特点是不需要编译,可以直接书写,但依赖解释器来负责解释执行。js代码解析原则js引擎首先在读取js代码时默认执行2个步骤:1.解释(通篇扫描所有js代码,然后把所有声明(变
使用HTML+CSS+JS 实现粒子动画
余大力BBQ
前端小案例 HTML CSS JavaScript 粒子动画 鼠标交互
:阿余:2022-3-2-2:如有错误,敬请指正。感谢!使用HTML+CSS+JS实现粒子动画1设置网页的样式2移动鼠标生成粒子3为每个粒子生成随机颜色属性4让粒子动起来5让粒子在垂直方向随机向上或向下移动6为粒子设置生命周期,销毁过期粒子7让粒子的颜色,跟随生命周期变化(淡出效果)8完整代码1设置网页的样式鼠标的粒子尾巴html,body{width:100%;height:100%;paddi
html,css,js的粒子效果
python算法(魔法师版)
html css javascript
这段代码实现了一个基于HTML5Canvas的高级粒子效果,用户可以通过鼠标与粒子进行交互。下面是对代码的详细解析:HTML部分使用声明文档类型。标签内包含了整个网页的内容。部分定义了网页的标题("高级粒子效果")和一些基本样式,如设置页面无边距、隐藏滚动条以及黑色背景。包含一个元素用于绘图。CSS部分设置body的边距为0,并隐藏溢出内容,同时设置背景颜色为黑色。canvas块级显示,确保其占据
成为专业程序员路上用到的各种优秀资料、神器及框架
lqijlyy
嵌入式开发 框架
http://www.cnblogs.com/jasondan/p/6380597.html前言成为一名专业程序员的道路上,需要坚持练习、学习与积累,技术方面既要有一定的广度,更要有自己的深度。笔者作为一位toolmad,将工作以来用到的各种优秀资料、神器及框架整理在此,毕竟好记性不如烂键盘,此项目可以作为自己的不时之需。本人喜欢折腾,记录的东西也比较杂,各方面都会有一些,内容按重要等级排序,大家
c语言网1125 委派任务
Xzh0423
算法
https://www.dotcpp.com/oj/problem1125.html题目描述某侦察队接到一项紧急任务,要求在A、B、C、D、E、F六个队员中尽可能多地挑若干人,但有以下限制条件:1)A和B两人中至少去一人;2)A和D不能一起去;3)A、E和F三人中要派两人去;4)B和C都去或都不去;5)C和D两人中去一个;6)若D不去,则E也不去。问应当让哪几个人去?输入格式无输出格式要派出的人若
深入浅出Java Annotation(元注解和自定义注解)
Josh_Persistence
Java Annotation 元注解 自定义注解
一、基本概述
Annontation是Java5开始引入的新特征。中文名称一般叫注解。它提供了一种安全的类似注释的机制,用来将任何的信息或元数据(metadata)与程序元素(类、方法、成员变量等)进行关联。
更通俗的意思是为程序的元素(类、方法、成员变量)加上更直观更明了的说明,这些说明信息是与程序的业务逻辑无关,并且是供指定的工具或
mysql优化特定类型的查询
annan211
java 工作 mysql
本节所介绍的查询优化的技巧都是和特定版本相关的,所以对于未来mysql的版本未必适用。
1 优化count查询
对于count这个函数的网上的大部分资料都是错误的或者是理解的都是一知半解的。在做优化之前我们先来看看
真正的count()函数的作用到底是什么。
count()是一个特殊的函数,有两种非常不同的作用,他可以统计某个列值的数量,也可以统计行数。
在统
MAC下安装多版本JDK和切换几种方式
棋子chessman
jdk
环境:
MAC AIR,OS X 10.10,64位
历史:
过去 Mac 上的 Java 都是由 Apple 自己提供,只支持到 Java 6,并且OS X 10.7 开始系统并不自带(而是可选安装)(原自带的是1.6)。
后来 Apple 加入 OpenJDK 继续支持 Java 6,而 Java 7 将由 Oracle 负责提供。
在终端中输入jav
javaScript (1)
Array_06
JavaScript java 浏览器
JavaScript
1、运算符
运算符就是完成操作的一系列符号,它有七类: 赋值运算符(=,+=,-=,*=,/=,%=,<<=,>>=,|=,&=)、算术运算符(+,-,*,/,++,--,%)、比较运算符(>,<,<=,>=,==,===,!=,!==)、逻辑运算符(||,&&,!)、条件运算(?:)、位
国内顶级代码分享网站
袁潇含
java jdk oracle .net PHP
现在国内很多开源网站感觉都是为了利益而做的
当然利益是肯定的,否则谁也不会免费的去做网站
&
Elasticsearch、MongoDB和Hadoop比较
随意而生
mongodb hadoop 搜索引擎
IT界在过去几年中出现了一个有趣的现象。很多新的技术出现并立即拥抱了“大数据”。稍微老一点的技术也会将大数据添进自己的特性,避免落大部队太远,我们看到了不同技术之间的边际的模糊化。假如你有诸如Elasticsearch或者Solr这样的搜索引擎,它们存储着JSON文档,MongoDB存着JSON文档,或者一堆JSON文档存放在一个Hadoop集群的HDFS中。你可以使用这三种配
mac os 系统科研软件总结
张亚雄
mac os
1.1 Microsoft Office for Mac 2011
大客户版,自行搜索。
1.2 Latex (MacTex):
系统环境:https://tug.org/mactex/
&nb
Maven实战(四)生命周期
AdyZhang
maven
1. 三套生命周期 Maven拥有三套相互独立的生命周期,它们分别为clean,default和site。 每个生命周期包含一些阶段,这些阶段是有顺序的,并且后面的阶段依赖于前面的阶段,用户和Maven最直接的交互方式就是调用这些生命周期阶段。 以clean生命周期为例,它包含的阶段有pre-clean, clean 和 post
Linux下Jenkins迁移
aijuans
Jenkins
1. 将Jenkins程序目录copy过去 源程序在/export/data/tomcatRoot/ofctest-jenkins.jd.com下面 tar -cvzf jenkins.tar.gz ofctest-jenkins.jd.com &
request.getInputStream()只能获取一次的问题
ayaoxinchao
request Inputstream
问题:在使用HTTP协议实现应用间接口通信时,服务端读取客户端请求过来的数据,会用到request.getInputStream(),第一次读取的时候可以读取到数据,但是接下来的读取操作都读取不到数据
原因: 1. 一个InputStream对象在被读取完成后,将无法被再次读取,始终返回-1; 2. InputStream并没有实现reset方法(可以重
数据库SQL优化大总结之 百万级数据库优化方案
BigBird2012
SQL优化
网上关于SQL优化的教程很多,但是比较杂乱。近日有空整理了一下,写出来跟大家分享一下,其中有错误和不足的地方,还请大家纠正补充。
这篇文章我花费了大量的时间查找资料、修改、排版,希望大家阅读之后,感觉好的话推荐给更多的人,让更多的人看到、纠正以及补充。
1.对查询进行优化,要尽量避免全表扫描,首先应考虑在 where 及 order by 涉及的列上建立索引。
2.应尽量避免在 where
jsonObject的使用
bijian1013
java json
在项目中难免会用java处理json格式的数据,因此封装了一个JSONUtil工具类。
JSONUtil.java
package com.bijian.json.study;
import java.util.ArrayList;
import java.util.Date;
import java.util.HashMap;
[Zookeeper学习笔记之六]Zookeeper源代码分析之Zookeeper.WatchRegistration
bit1129
zookeeper
Zookeeper类是Zookeeper提供给用户访问Zookeeper service的主要API,它包含了如下几个内部类
首先分析它的内部类,从WatchRegistration开始,为指定的znode path注册一个Watcher,
/**
* Register a watcher for a particular p
【Scala十三】Scala核心七:部分应用函数
bit1129
scala
何为部分应用函数?
Partially applied function: A function that’s used in an expression and that misses some of its arguments.For instance, if function f has type Int => Int => Int, then f and f(1) are p
Tomcat Error listenerStart 终极大法
ronin47
tomcat
Tomcat报的错太含糊了,什么错都没报出来,只提示了Error listenerStart。为了调试,我们要获得更详细的日志。可以在WEB-INF/classes目录下新建一个文件叫logging.properties,内容如下
Java代码
handlers = org.apache.juli.FileHandler, java.util.logging.ConsoleHa
不用加减符号实现加减法
BrokenDreams
实现
今天有群友发了一个问题,要求不用加减符号(包括负号)来实现加减法。
分析一下,先看最简单的情况,假设1+1,按二进制算的话结果是10,可以看到从右往左的第一位变为0,第二位由于进位变为1。
 
读《研磨设计模式》-代码笔记-状态模式-State
bylijinnan
java 设计模式
声明: 本文只为方便我个人查阅和理解,详细的分析以及源代码请移步 原作者的博客http://chjavach.iteye.com/
/*
当一个对象的内在状态改变时允许改变其行为,这个对象看起来像是改变了其类
状态模式主要解决的是当控制一个对象状态的条件表达式过于复杂时的情况
把状态的判断逻辑转移到表示不同状态的一系列类中,可以把复杂的判断逻辑简化
如果在
CUDA程序block和thread超出硬件允许值时的异常
cherishLC
CUDA
调用CUDA的核函数时指定block 和 thread大小,该大小可以是dim3类型的(三维数组),只用一维时可以是usigned int型的。
以下程序验证了当block或thread大小超出硬件允许值时会产生异常!!!GPU根本不会执行运算!!!
所以验证结果的正确性很重要!!!
在VS中创建CUDA项目会有一个模板,里面有更详细的状态验证。
以下程序在K5000GPU上跑的。
诡异的超长时间GC问题定位
chenchao051
jvm cms GC hbase swap
HBase的GC策略采用PawNew+CMS, 这是大众化的配置,ParNew经常会出现停顿时间特别长的情况,有时候甚至长到令人发指的地步,例如请看如下日志:
2012-10-17T05:54:54.293+0800: 739594.224: [GC 739606.508: [ParNew: 996800K->110720K(996800K), 178.8826900 secs] 3700
maven环境快速搭建
daizj
安装 mavne 环境配置
一 下载maven
安装maven之前,要先安装jdk及配置JAVA_HOME环境变量。这个安装和配置java环境不用多说。
maven下载地址:http://maven.apache.org/download.html,目前最新的是这个apache-maven-3.2.5-bin.zip,然后解压在任意位置,最好地址中不要带中文字符,这个做java 的都知道,地址中出现中文会出现很多
PHP网站安全,避免PHP网站受到攻击的方法
dcj3sjt126com
PHP
对于PHP网站安全主要存在这样几种攻击方式:1、命令注入(Command Injection)2、eval注入(Eval Injection)3、客户端脚本攻击(Script Insertion)4、跨网站脚本攻击(Cross Site Scripting, XSS)5、SQL注入攻击(SQL injection)6、跨网站请求伪造攻击(Cross Site Request Forgerie
yii中给CGridView设置默认的排序根据时间倒序的方法
dcj3sjt126com
GridView
public function searchWithRelated() {
$criteria = new CDbCriteria;
$criteria->together = true; //without th
Java集合对象和数组对象的转换
dyy_gusi
java集合
在开发中,我们经常需要将集合对象(List,Set)转换为数组对象,或者将数组对象转换为集合对象。Java提供了相互转换的工具,但是我们使用的时候需要注意,不能乱用滥用。
1、数组对象转换为集合对象
最暴力的方式是new一个集合对象,然后遍历数组,依次将数组中的元素放入到新的集合中,但是这样做显然过
nginx同一主机部署多个应用
geeksun
nginx
近日有一需求,需要在一台主机上用nginx部署2个php应用,分别是wordpress和wiki,探索了半天,终于部署好了,下面把过程记录下来。
1. 在nginx下创建vhosts目录,用以放置vhost文件。
mkdir vhosts
2. 修改nginx.conf的配置, 在http节点增加下面内容设置,用来包含vhosts里的配置文件
#
ubuntu添加admin权限的用户账号
hongtoushizi
ubuntu useradd
ubuntu创建账号的方式通常用到两种:useradd 和adduser . 本人尝试了useradd方法,步骤如下:
1:useradd
使用useradd时,如果后面不加任何参数的话,如:sudo useradd sysadm 创建出来的用户将是默认的三无用户:无home directory ,无密码,无系统shell。
顾应该如下操作:
第五章 常用Lua开发库2-JSON库、编码转换、字符串处理
jinnianshilongnian
nginx lua
JSON库
在进行数据传输时JSON格式目前应用广泛,因此从Lua对象与JSON字符串之间相互转换是一个非常常见的功能;目前Lua也有几个JSON库,本人用过cjson、dkjson。其中cjson的语法严格(比如unicode \u0020\u7eaf),要求符合规范否则会解析失败(如\u002),而dkjson相对宽松,当然也可以通过修改cjson的源码来完成
Spring定时器配置的两种实现方式OpenSymphony Quartz和java Timer详解
yaerfeng1989
timer quartz 定时器
原创整理不易,转载请注明出处:Spring定时器配置的两种实现方式OpenSymphony Quartz和java Timer详解
代码下载地址:http://www.zuidaima.com/share/1772648445103104.htm
有两种流行Spring定时器配置:Java的Timer类和OpenSymphony的Quartz。
1.Java Timer定时
首先继承jav
Linux下df与du两个命令的差别?
pda158
linux
一、df显示文件系统的使用情况,与du比較,就是更全盘化。 最经常使用的就是 df -T,显示文件系统的使用情况并显示文件系统的类型。 举比例如以下: [root@localhost ~]# df -T Filesystem Type &n
[转]SQLite的工具类 ---- 通过反射把Cursor封装到VO对象
ctfzh
VO android sqlite 反射 Cursor
在写DAO层时,觉得从Cursor里一个一个的取出字段值再装到VO(值对象)里太麻烦了,就写了一个工具类,用到了反射,可以把查询记录的值装到对应的VO里,也可以生成该VO的List。
使用时需要注意:
考虑到Android的性能问题,VO没有使用Setter和Getter,而是直接用public的属性。
表中的字段名需要和VO的属性名一样,要是不一样就得在查询的SQL中
该学习笔记用到的Employee表
vipbooks
oracle sql 工作
这是我在学习Oracle是用到的Employee表,在该笔记中用到的就是这张表,大家可以用它来学习和练习。
drop table Employee;
-- 员工信息表
create table Employee(
-- 员工编号
EmpNo number(3) primary key,
-- 姓