HTML5&CSS3&JavaScript&PHP&MySQL学习笔记
1、在文字间添加一条水平线 使用<hr /> 注意该符号不是成对出现的
2、<q> </q>用来标记于段落中的较短引用,浏览器会在它之间的语句两端加上双引号。
3、<address> </address>可以包含设计者的联系方式或者电话等。 P44
4、链接是由<a href=”http://www.baidu.com”>百度一下</a>产生,其中href指定要链接到的地址。P66
5、如果希望链接网页在新网页中打开,那么需要在第4点中设置target=”_blank” P75
6、当需要跳转到页面的某个位置时,可使用id属性。 P76
7、新建一个Email链接,mailto。 P74
8、表格的一些知识。 P120
9、在<th><td>中使用clospan特效可以使表格的多个单元格合并显示,即跨行。跨列使用rowspan。P122
10、长表格,即表格有很多行。<thead></thead> <tbody></tbody> <tfoot></tfoot> P125
11、在代码中声明使用的HTML版本低HTML5,使用<!DOCTYPE html>
12、利用iframe可以在网页中内嵌显示一个网页,<iframe width="1280" height="500" src=http://map.baidu.com/></iframe>
13、使用外部CSS,<link href="css/example.css" type="text/css" rel="stylesheet" /> P224
14、在CSS中,可以在任意属性值的后面添加 !important来强调这条规则比应用于同一元素的其他规则更优先,更重要。 P228
15、CSS中,类选择器,<p class=”note”> </p>,那么CSS文件中应该是 .note{ } //note前的“.”不要忘了
如果是ID选择器,<p id=”top”> </p>,那么CSS中应该是 #top{ } P227
16、CSS中盒子(div)的定位问题
1>普通流:每个块级元素都换行显示,以至于页面中的每个项目都显示在前一个项目的下面,即使你指定了盒子的宽度,并且也有足够的空间让两个元素并排显示,他们也还是不会显示在一排,这是浏览器的默认行为,除非你规定浏览器按照其他方式显示。
2>相对定位:相对定位将一个元素在其普通流中的位置上向上下左右移动,这种移动不会使该元素脱离普通流。
3>绝对定位:绝对定位的元素的位置相对于它的包含元素。它完全脱离了普通流,也就是说不会影响到周围元素的位置(就像是直接忽略掉它所占据的空间),使用绝对定位的元素随着页面的滚动而移动。
4>固定定位:固定定位是绝对定位的一种形式,与绝对定位所不同的是,固定定位是以浏览窗口为基准进行定位。使用固定定位的元素不会随着页面的滚动而移动。
5>浮动元素:浮动一个元素可以让其脱离普通流,并定位到其包含盒子的最左边或者最右边的位置,这个浮动元素会成为一个周围可以浮动其他内容的块级元素。
6>任何元素脱离普通流时,盒子都会产生重叠,可以通过使用z-index属性设置将哪个盒子显示在上面。
17、margin属性用于依次控制对象的上、右、下、左4个方向的外边距,当margin使用两个参数时,第一个参数表示上下边距,第二个参数表示左右边距。所以:margin:0px auto;会让对象水平居中显示。
18、对于表格元素来说,要实现垂直居中秩序设置单元格的vertical-align:middle;但是这个属性在CSS中不起作用,那么要解决这一问题,只需要将盒子的行高设为与盒的高度一致即可。即,假如:盒高为height:50px;那么只需要在CSS中加入line-height:50px;即可实现垂直居中。
以上内容来自 HTML&CSS设计与构建网站 一书
1、可以在HTML5的video元素中添加字幕或者说明,格式如下
<video src=”xxx.ogv”>
<track kind=”subtitles” src=”xxx.en.vtt” srclang=”en” label=”English” default>
<track kind=”subtitles” src=”xxx.pt.vtt” srclang=”pt-br” label=”Brazilian Portuguese”>
</video>
其中,可以添加多个track,即可以有多个字幕等。kind指明添加的类型,它还可以是captions,descriptions。
label属性指明的作用是,比如有两个字幕文件,那么用户可以选择显示哪一个字幕文件(前提要浏览器支持多字幕显示)。 P152
2、播放视频中指定的一部分,可使用<video src=”xxx.oga#t=7.5,”></video>其中,#t是时间范围的一个快捷方式,7.5后面的逗号是必须的,表示从7.5秒开始一直播放到视频结束。 P154
以上内容来自 移动网页设计与开发HTML5+CSS3+JavaScript 一书
1、HTML与JavaScript交互可以通过使用文档对象模型(Document Object Model, MOD)实现。P54
2、浏览器加载页面是按照head-body的顺序执行,那么把JavaScript代码放在head中,可能会出现一些问题,这时我们可以指定在页面加载完成后再执行DOM代码,比如:
<script>
function init()
{ var plant=document.getElementById(“greenplant”);
plant.innerHTML=”RED ALERT…”
}
window.onload=init;//这表示,页面完全加载后要执行init()函数中的代码
</script> P64
3、在javascript中,我们只有一个全局作用域,也就是说,当你引入了多个.js文件时,如果他们有重名的全局变量,那么会产生意想不到的结果。 P127
4、利用javascript创建一个对象:(可以看到js对变量的定义比c++宽松多了)
var fido={
name:”wangcai”,
weight:40,
breed:”hashiqi”,
loved:[“walks”,”fetching balls”]
}; ///结束这里的分号不要忘记了,访问可以通过fido.weight方式访问对象元素
5、使用浏览器获得位置信息,navigator.geolocation.getCurrentPosition(…) P172
6、 利用<video>元素实现视频播放列表,一般的做法是,新建一个数组,保存播放列表,然后使用video.addEventListener(“ended”,nextVideo,false),该方法会监听视频的ended事件,在视频结束的时候调用nextVideo处理函数,实现下一个视频的播放。 P367
7、对于一种类型的视频文件,可以使用<video>元素的canPlayType方法获取到,浏览器是否支持播放该文件,一般浏览器可能返回probably,maybe,或者“”,即是空。空表示没有任何把握能播放该视频文件。
使用video.canPlayType(“video/ogg”)会返回maybe或者空。
使用video.canPlayType(‘video/ogg;codecs=”theora,vorbis”’)会返回probably,maybe,或者是空,因为这里我们手动指定了codecs编码类型。 P369
以上内容来自Head First HTML5 Programming一书
1、php中所以的变量名都以一个美元符号$打头。 P38
2、传递表单中的变量,我们一般有get和post两种方式可选,但是一般当我们需要在表单中提交较多的文字或者一些敏感信息(密码)时我们就需要使用post方法,因为get方法会把表单中提交的字符串写入URL中。这里需要说明的是,一般我们的搜索引擎会使用get方法提交表单而不是post方法,这是因为使用get方法后,当你将某一个搜索页面保存成书签时,下一次打开这个书签,还是你需要的那个搜索结果页面,这是因为书签URL中已经包含了搜素时的关键字。反之,post则不会。还有一种request方法。 P49
3、当我们在浏览器中输入服务器的一个URL目录时,它会查找该目录下的index.php文件,所以我们不一定非得要写全URL地址。但是记住,它只会去寻找index.php文件。不会去找其他的。 P58
4、我们可以使用include方法,使得在一个php文件中包含了一个php文件的代码,这样可以节省代码的编码量。除此之外还有require、include_once、require_once方法。 P110-116
5、PHP中变量作用域的问题,主脚本(如index.php)中存在的任何变量,在包含文件中也是可用和可修改的,但是在函数中就不一样了,函数中的变量只在函数内部有效,外部的变量在函数内部是不可访问的。如果你非要在函数内部访问外部变量,可以使用命令global或者$GLOBALS[‘ ’]将某个变量声明为超级全局变量。 P122
6、正则表达式使用模式修饰符使得匹配时不区分大小写的是i,即/PHP/i,它将可以和/PHP/、/php/、/PHp/等匹配。 P169
7、正则表达式,脱字^字符匹配字符串的开始。即/^PH/将匹配PH开头的字符串。
点号(.)表示任意单个字符除了换行符,
星号(*)表示其前面的字符出现0次或多次。
例如/^PH.*/不仅匹配PH,还匹配PHP、PHX、PHP:CBWHBFEWYHBVCCcbeh i am super cool等。 P170
8、$美元符号匹配字符串的结尾。如:/^PHP$/只能匹配PHP
+要求前面的字符出现一次或者多次,注意其与*的差别
?使得前面的字符成为可选的,如果放在一个加号或者一个星号后面,表示一次最小化匹配
|(管道符号)导致正则表达式匹配管道左边的模式或者匹配管道右边的模式
(…)圆括号定义了一组符号,他们必须一起出现或者是同时满足。
[…]方括号定义了一个字符类,字符类匹配方括号中的字符之一
注意:[^a]匹配字符串中除a之外的一个单个字符
如果想要使用这些特殊字符之一作为正则表达式模式将要匹配的一个字面字符,可以使用反斜杠\实现,例如
/1\+1=2/会匹配字符串1+1=2,这里其中的+好就只是一个纯加号了。 P171
9、我们再数据库管理中,可以增加身份验证功能,这样可以使得数据库更安全。同时配合cookie以及回话可以实现在用户访问站点的过程中保持非首次登陆所需的身份信息。而不需要每当用户要浏览或者执行一项敏感操作的时候,都需要提示用户输入密码。这就是cookie存在的意义之一。 P198
以上内容来自《PHP和MySQL Web开发从新手到高手》 Kevin Yank
以下内容来自《DIV+CSS网页布局商业案例精粹》
1、我们在设置div为float时,需要分别设置浮动到一行的每一个div的属性float:left;,这样我们才会产生需要的效果,因为div默认情况下是会在前后都产生换行符的。
2、元素高度自适应:同样可以像设置宽度一样,利用百分比设置。所不同的是我们除了设置元素的高度百分比,我们还需要设置该元素的父级元素的高度百分比。假如父级元素为body,那么:
html,body{
height:100%;}
div #test{
height:50%;}
这个时候我们的div中的50%高度才会生效。
HTML5&CSS3&JavaScript&PHP&MySQL学习笔记的更多相关文章
- HTMl5/CSS3/Javascript 学习推荐资源
HTMl5/CSS3/Javascript 学习推荐资源 前端的定义应该是数据内容的展示,在国内大家都觉得前端只是HTML+CSS+Javascript,但是实际上与展示有关的都是前端,所以Ruby/ ...
- CSS3与页面布局学习笔记(八)——浏览器兼容性问题与前端性能优化方案
一.浏览器兼容 1.1.概要 世界上没有任何一个浏览器是一样的,同样的代码在不一样的浏览器上运行就存在兼容性问题.不同浏览器其内核亦不尽相同,相同内核的版本不同,相同版本的内核浏览器品牌不一样,各种运 ...
- Mysql学习笔记(三)对表数据的增删改查。
正文内容. 这一部分是最简单的,也是最麻烦的.简单是因为其实只包括增删该插四个部分.大体上看,增加数据.删除数据.修改数据.查询数据都不麻烦啊,我们日常都是常用的.这个谁不会呢?以前在培训机构学mys ...
- MySQL学习笔记一
MySQL 学习笔记 一 一.数据库简单介绍 1. 按照数据库的发展时间顺序,主要出现了以下类型数据库系统: Ø 网状型数据库 Ø 层次型数据库 Ø 关系型数据库 Ø 面向对象数据库 上面4中数据库系 ...
- Mysql学习笔记(二)数据类型 补充
原文:Mysql学习笔记(二)数据类型 补充 PS:简单的补充一下数据类型里的String类型以及列类型... 学习内容: 1.String类型 2.列类型存储需求 String类型: i.char与 ...
- Mysql学习笔记(一)数据类型
原文:Mysql学习笔记(一)数据类型 学习内容: Mysql基本数据类型. 1.数字类型.. i.整型 Mysql数据类型 含义(有符号) tinyint(m ...
- ArcGIS API for JavaScript 4.2学习笔记[0] AJS4.2概述、新特性、未来产品线计划与AJS笔记目录
放着好好的成熟的AJS 3.19不学,为什么要去碰乳臭未干的AJS 4.2? 4.2全线基础学习请点击[直达] 4.3及更高版本的补充学习请关注我的博客. ArcGIS API for JavaScr ...
- 初识mysql学习笔记
使用VMVirtualBox导入Ubuntu后,可以通过sudo apt-get install mysql-server命令下载mysql. 在学习过程中,我遇到了连接不上Xshell的问题.最终在 ...
- MySQL学习笔记-锁相关话题
在事务相关话题中,已经提到事务隔离性依靠锁机制实现的.在本篇中围绕着InnoDB与MyISAM锁机制的不同展开,进而描述锁的实现方式,多种锁的概念,以及死锁产生的原因. Mysql常用存储引擎的锁 ...
随机推荐
- NUMA CPU optimization
technologies: OS, CPU cache, numa structure, memory access
- Javascript日期处理类库Moment.js
1.组件详情地址Moment.js中文网 http://momentjs.cn/ 2.几个方法: (1) 日期格式化 moment().format(); // 2016-02-29T14:03:30 ...
- PM2 管理nodejs项目
pm2 是一个带有负载均衡功能的Node应用的进程管理器. 当你要把你的独立代码利用全部的服务器上的所有CPU,并保证进程永远都活着,0秒的重载, PM2是完美的. 它非常适合IaaS结构,但不要把它 ...
- js观察者模式
观察者模式存在观察者和被观察者 被观察者的状态发生改变,通知观察者调用观察者的update方法,观察者的update方法对被观察者的状态进行检测,做出相应的操作 被观察者存在接口attach,deta ...
- cookie管理中的一些细节,转的
1.domain表示的是cookie所在的域,默认为请求的地址,如网址为www.jb51.net/test/test.aspx,那么domain默认为www.jb51.net.而跨域访问,如域A为t1 ...
- powerdesign设置实体显示格式
工具-显示参数选择中,如下图:
- 40个Java集合面试问题和答案【上】【转载】
1.Java集合框架是什么?说出一些集合框架的优点? 每种编程语言中都有集合,最初的Java版本包含几种集合类:Vector.Stack.HashTable和Array.随着集合的广泛使用,Java1 ...
- WCF编程系列(五)元数据
WCF编程系列(五)元数据 示例一中我们使用了scvutil命令自动生成了服务的客户端代理类: svcutil http://localhost:8000/?wsdl /o:FirstServic ...
- 禁用浏览器缓存Ajax请求
$.ajax({ url: 'url.php', cache: false, success: function(data){ //..... } }); 仅Get有缓存, Post不会缓存
- ###Linux基础 - 3
点击查看Evernote原文. #@author: gr #@date: 2014-10-15 #@email: forgerui@gmail.com 一.GCC编译程序 在Windows下使用Vis ...