HTML 注释
HTML 标签分类(按照功能): 文本的修饰,文字排版,图片,链接,表格,列表,表单,框架 ,语音,视频
font 标签中的属性: color, size (1-7,默认是3),face(字体)http://tool.oschina.net/
body 标签中的属性:text(文字颜色),bgcolor(背景色),background(背景图),bgproperties(背景图固定),
文本修饰标记: , ,加粗,斜体,强调斜体,下划线,中间删除线,下划线,中间删除线,上标,下标
保留格式,主要是空格和换行以及符号等,
块: p, h1-h6, pre, div, li,
行内:font, b, em, i, b, strong, del
字符实体: 空格, 尖括号,货币符号,版权符号,注册商标,申请中的商标
列表: 有序ol, 无序ul,自定义dl
滚动字幕标签
属性:bgcolor 背景色
width=“500” //不需要添加px单位
direction=“left(默认向左滚动)/right/up/down”
scrollamount="2" //每秒滚动多少像素,也不需要添加单位
scrolldelay = “1000” //滚动延迟,单位是毫秒
behavior="alternate(往返滚动)/slide(滚动一次然后靠边停止)/scroll(默认值无限同方向循环滚动)"
vspace=“300” //垂直方向距离上边距为300像素
颜色: 十六进制表示最多 color=“#ffffff” //两个一组,代表红绿蓝,每一组取值0-9,a,b,c,d,e,f
字符编码: ASCII->ANSI(GB2312,JIS)->Unicode->utf-8
BIG5 繁体中文
解决乱码问题:1.编辑器设置 2.meta 字符设置 3.浏览器编码 4.PHP字符集设置 5.Mysql数据库字符集设置
meta 标签: 元信息
// description中的内容通常会有一部分显示在搜索引擎的网页快照中。
Web标准: 结构html, 表现CSS, 行为ECMAscript
DTD 文档:strict 严格型, transitional 过渡型, frameset 框架集
img 标签: 属性: src,title, alt, width,height, vspace,hspace,align,border //边框使用: style=“border:5 solid red”
绝对路径: 1. C:\windows\wallpaper.jpg
2.file:///C:/User/Administrator/Desktop/i.jpg
3.https://www.baidu.com/img/logo.jpg
4. //第一个 斜杠 代表网站根目录
相对路径:1. 目标文件与当前页面在同一目录: src="1.jpg"
2.目标文件所在的文件夹与当前页面在同一目录: src="img/1.jpg"
3.目标文件在当前页面的上一级目录: src="../1.jpg" , 上两级: src="../../1.jpg"
4.目标文件所在的文件夹与当前页面的文件夹在同一目录: src="../img/1.jpg"
超链接:anchor
href hypertext reference
url Uniform Resource Locator
超链接类型: 1.外部链接 https://
2.内部链接
3.图片链接(将img 标签嵌套在a标签的内容中)//处理IE中图片链接有边框的方法,在图片属性中添加border=“0”
4.下载链接:将文件打包成 *.rar, *.mp4, *.wmv, *.flv, *.zip, *.iso , 然后直接在href中添加即可, 当用户点击时,浏览器会自动关联下载工具或使用浏览器自带的下载工具
5.空连接 //点击一次之后链接的颜色变为紫色,同时页面返回最顶部
//点击之后链接的颜色不会改变,页面不会返回最顶部
6.邮件链接 联系我 //点击之后自动关联电子邮箱工具,默认会打开outlook
7.锚链接 第一步:定义锚点
第二步:调用锚点 //跳转到其他页面的锚点位置
分割线hr标签: 属性: size(1-7,粗细),width(所占宽度),height(所占高度),vspace,hspace
换行br 标签
表格标签: 一个table就是一个表格
先有行,再有列,列在行中
表格标题
flash的实例: 将flash 的代码嵌入到网页中即可,注意路径 ()
表单标签:
属性:name, action,method,enctype
表单元素: input
属性: type="text", name="username", size="20" maxlength="30"
type="password"
type="radio" checked="checked" id="tt" (male) //label实现点击文字实现选中
type="image"
type="button"
type="hidden"
type="file" //上传文件 如果有上传文件,则form标签中的编码类型为:enctype=”multipart/form-data”
select 下拉列表
属性: name
multiple="multiple"
size="3" // 只显示3个
select中的元素: option 选项
上海
textarea 文本域
属性:name
cols
rows
表单提交:input
属性: type="submit" value="提交" name=“submit”
type="reset" value="重写"
地图 map: 使用dreamweaver 来实现
CSS尺寸: CSS 外部引入:
http://www.dreamdu.com/style.css"; />
清空默认内外默认边距:*{ margin:0;padding:0;}
使用通配符选择器会遍历页面所有的标签,这样会严重影响性能,所以不推荐使用上边的通配符方式
而是采用以下标准的清空做法:(网址:http://yui.yahooapis.com/3.18.1/build/cssreset/cssreset-min.css)
html{color:#000;background:#FFF}body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td{margin:0;padding:0}table{border-collapse:collapse;border-spacing:0}fieldset,img{border:0}address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:normal}ol,ul{list-style:none}caption,th{text-align:left}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal}q:before,q:after{content:''}abbr,acronym{border:0;font-variant:normal}sup{vertical-align:text-top}sub{vertical-align:text-bottom}input,textarea,select{font-family:inherit;font-size:inherit;font-weight:inherit;*font-size:100%}legend{color:#000}#yui3-css-stamp.cssreset{display:none}
px(相对于屏幕的分辨率), em(1倍的系统默认字体高度), %(相对于当前默认值的百分比)
字体属性:font-family (设置字体,建议使用中文字体的英文名字), font-size(字体大小), font-weight(100-900、字体的加粗方式),font-style(字体样式,italic 斜体)
文本属性: color(颜色,用16进制), text-align(文本对齐方式), line-height(行高),text-indent(), letter-spacing(行距), text-decoration(下划线,上划线,删除线)
padding , margin, border, background(background-color,background-image, background-repeat, background-position, background-attachment) //精灵图就是使用background-position
CSS浮动: float: left/right
浮动的位置:浮动到包含元素的边界,或具有浮动属性元素的边上。
浮动元素都是块级元素(行内元素浮动后自动转为块级元素)
清除浮动:
//在浮动作用完成之后,要清除浮动,以免对后面的浮动造成影响。CSS优先级: 1.当CSS冲突时,采用就近原则。 行内样式>内嵌样式>外部样式
2.行内样式>id>class>标签
3.权重值,特征值
标签:1
类:10
ID:100
Style:1000
!important : 最高优先级
定位属性:position: (需要先设置用来配合定位的坐标: left right top bottom)
static 静态,不定位
fixed 固定, 脱离正常的文档流,比普通元素层级高,相对浏览器窗口进行定位
relative 相对,脱离文档流,层级高于普通元素, 相对原来的自己位置, 原来的位置别的元素不能占用
absolute 绝对, 脱离文档流,层级高于普通元素,相对于上一级具有定位属性的元素进行定位,直至body 为止
常用方法: 子绝父相。 外层元素通常设置相对定位,不用坐标;内层元素设置绝对定位,配合坐标定位。
盒模型: Margin, Border, Padding, Content
标准盒模型和IE盒模型的差别: width 和height的计算差别
margin的上下合并问题(上下大吃小),左右叠加
初始化清除浏览器默认值
overflow(溢出): hidden(超出隐藏)/scroll(滚动条)/auto(自适应)
display: block(块显示)/inline(行内显示)/inline-block (双重作用,在一行内显示,又有宽高)/none(不显示)
JS: JavaScript
JS 编程语言 HTML&CSS 标记语言
变量: var abc = 1;
警告信息: alert(); document.write(); prompt(); confirm;
查看数据类型: typeof(变量名称)
区分大小写,分号结尾。
数据类型: 数字,字符串,布尔,未定义,空类型,复合类型(数组,对象)
注释: 单行注释 //内容
多行注释 /*内容*/
运算符: 赋值运算符, 算数运算符,逻辑运算符,位运算符, 运算符优先级
传值: 赋值传值(数字类型,字符串类型),引用传值
流程控制:1. 条件语句: ①if(条件) {语句块}
②if(条件) {语句块} else{语句块}
③if(条件) {语句块} else if{语句块}
④switch(变量或者表达式) {case 值1: 语句1;break;...... default: 语句}
2.循环语句: 循环的三大组成部分: 循环变量的初始化,循环变量的改变,循环条件的判断
①var i=1; while(i<100) {循环体;i++}
②var i=1; do{循环体;i++}while(i<100)
③for(var i=1;i<100;i++) {循环体}
知识点: break: 跳出整个循环,开始执行循环之后的语句
continue:跳出当次的循环,当次循环之后的语句不再执行,然后开始执行下一次循环
函数:定义: function 函数名(形参1,形参2,...){代码; return 值;}
调用:函数名(实参1,实参2, ...)
return 可以返回值或者不返回值,可以用于停止函数执行。
知识点: 全局变量 局部变量 函数的位置可以任意,因为函数只有在调用时才会执行。
系统内部自带的常用函数: isNaN 非数字,返回bool值
isfinite 为无穷大,
parseInt() 向下取整
递归函数:函数本身调用函数本身,条件是必须有可以让函数停止调用的条件。
function f1(){ f1(); }
数组:格式: var arr = [10,20,30]; // 定义兼赋值
第二种定义: var arr = new Array(10,20,30);
下标:0, 1, 2
数组元素的调用:arr[0]
属性:arr.length //数组长度,即为元素个数
二维数组:数组的每一个元素仍然是一个一维数组。
二维数组元素的调用: arr[0][0]
数组的排序:即数组中元素按照升序或者降序排列。思路:定义一个临时变量,每一次都将最大或最小的值放在开头或者结尾,原值与临时变量交换。
数组的方法:arr.concat(arr1);//将arr1的元素添加到arr中
arr.join("字符");//返回一个字符串,该字符串是arr中的所有元素用“字符”连接起来的。
arr.pop();//删除数组最后一项并返回。
arr.reverse();//把数组的顺序翻转。
字符串: 定义: var str = "abcdefg";
第二定义:var str = new String("abcdefg");
字符串方法:str.indexOf("字符");
str.toUpperCase;
str.toLowerCase;
知识点:属性和方法
属性:对象.属性名
方法:对象.方法名()
Math对象: Math.pow(n1,n2);//n1的n2次方
Math.abs(n);//n的绝对值
Math.round(n);//n的四舍五入值
Math.max(n1,n2,...);//最大值
Math.min(n1,n2,...);//最小值
Math.floor(n);//向下取整
Math.ceil(n);//向上取整
Math.random();//获得[0,1)之间的随机数
Math.floor(Math.random()*(y+1-x)+x);//获取x~y之间的随机整数
知识点: 特殊字符: \r 换行 \n 回车 \t 制表符
时间日期对象: 创建: var d1 = new Date();//创建当前时间
var d2 = new Date("2017/09/11 21:26:00");//创建指定时间
var d3 = new Date(2017,09,10,21,26,00);//创建指定时间(月份0~11)
var d4 = new Date(13345478456745);//创建毫秒数时间
获取: var year = d1.getFullYear();//
var month=d1.getMonth();//获得月份
var date=d1.getDate();//获得日期
var day=d1.getDay();//获得星期
var hours=d1.getHours();//获得小时数
var minute=d1.getMinutes();//获得分钟数
var second=d1.getSecond();//获得秒数
var millisecond=d1.getMilliseconds();//获得毫秒数(0到999)
var timeshijian=d1.getTime();
设置:D1.setFullYear(2017);
D1.setMonth(n);
D1.setDate(n);
D1.setHours(n);
D1.setMinutes();
D1.setSeconds();
D1.setMilliSeconds()
对象: 指具体的东西,以js的眼光看所有的标签都是标签对象。
事件: HTML和JS通过事件建立起来联系
鼠标事件:onclick, onmouseover,onmouseout,onbdclick,onmousedown,onmouseup,onmousemove
键盘事件: onkeyDown,onkeyUp,onkeyPress
表单事件: onsubmit,onreset,onfocus(获得焦点),onblur(失去焦点)
窗口事件: onload, window.onload
Event: 指事件发生时,事件源相关的一些信息。clientX,clientY,event.target
JS控制DOM: 指JS控制改变标签的html属性和CSS 属性
①获取标签
②找到对应的标签属性并赋值
③object.html属性名, object.style.css属性名
知识点:从网页上获得的数据都是字符串。
innerHTML,value的区别
document.getElementById("ID标签名");
document.getElementByTagName("类标签名")
定时器:设置重复性:setInterval("fn()",1000);
一次性:setTimeout("fn()",1000);
清除定时器:clearInterval(); clearTimeout();
知识点: this:事件源,对象本身
对象绑定事件:object.onclick=函数名
删除标签:必须要找到这个对象的上级标签。
DOM: Document Object Model 文档对象模型
官方定义:W3C的DOM,可以使程序或脚本(JS或AS、JScript),动态的访问或操作文档的内容、结构、样式。
DOM只是一个标准,就是操作网页的标准。而这个标准(模型)在浏览器中,以“对象”的方式实现。
分类: 核心DOM HTMLDOM EventDOM CSSDOM
DOM中节点类型: document文档节点 element元素节点 attribute属性节点 text文本节点
知识点:JS中的事件属性,要全部小写
Event 对象: e 或者event
BOM:Browser Object Model 浏览器对象模型
Style对象
table表格对象
form表单对象: 属性 方法 事件
表单提交方法:
input对象
select对象 option对象
WAMP: 默认安装完成,phpMyAdmin的用户名是root,密码为空
PHP:
注释: HTML注释:
CSS注释: /* 注释内容 */
JS注释: // 或 /* 注释内容 */
PHP注释: // 或 # 或 /* 注释内容 */
变量:$开头
数据类型:标准型(字符串,整型,浮点型,布尔型) 复合型(数组,对象) 特殊数据类型(资源,NULL)
类型判断:var_dump(); //打印输出
is_*();// 判断变量是否为某一种类型
isset();//判断变量是否设置
empty();//检测某一个变量是否为空
获取表单提交数据:$_GET[] $_POST[]
数据类型转换:强制转换 自动转换
运算符: 算数,字符串,赋值,比较,逻辑,三元
运算符优先级
流程控制: 条件判断: if, if else, if else if
switch--case
循环语句: while, for
知识点: break 语句: break[n];//跳出n层循环
continue语句:continue[n];//中止n层循环
拷贝传值:两个变量独立, 字符型,整型,浮点型,NULL,数组
引用传值:两个变量指向同一个地址。 对象和资源 , 强制引用传值:在赋值的变量之前添加&
数组:分类:枚举数组,关联数组,混合数组,多维数组
创建:$arr = array(10,20,...);
$arr1 = array("name"=>"张三", 2=>男);
$arr2[0] = "李四";
相关函数:print_r(); unset(); count();
foreach($arr3 as $value) {}
函数:语法结构:
function 函数名(形参1,形参2,...){功能代码}
参数传递: 值传递参数, 引用传递参数
变量作用域:在PHP中,全局变量,不能直接在函数内部使用。
global关键字使用注意
global关键字,只能在函数内部来使用。
global关键字,不能一边声明全局变量,一边赋值。
global的真正含义,是“引用传地址”,
日期函数: date("Y年m月d日 H:i:s");
time(); //当前时间戳
数据库:
Mysql: 登录:
语法格式:mysql.exe –h主机名–u用户名–p密码
语法:show databases;
create database lan;
drop databaase lan;
show create database lan;//查看当前数据库的默认字符集
alter database lan default charset utf8;//修改数据库的字符集
use lan;
show tables;
create table news();
drop table news;
describe news;
数据类型:tinyint,smallint,mediumint,int,bigint
float(M,D) double(M,D)
date time
char(M) varchat(M) tinytext text longtext
SQL 语句: 增加记录: insert into table_name(字段1,字段2,...) values(值1,值2,...);
删除记录:delete from table_name where
修改记录:update table_name set 字段1=新值1,字段2=新值2,... where
查找记录:select * from table_name where
导入SQL文件到phpAdmin: 注意选择文件的字符集与导入文件的字符集一致,通常选择utf8
数据库操作的4步:1.登录到mySQL服务器
2.选择当前要操作的数据库
3.设置请求和返回数据的字符集
4.执行SQL语句
处理中文显示乱码的问题:
1.确保数据库本身的字符编码为utf8 (查看和修改 Show,alter)
网页本身的字符编码为utf-8()
编辑器的环境设置字符编码为utf-8(Setting - Preference - Encoding)
PHP请求返回的数据字符集编码为utf8(mysql_query("set names utf8");这一步放在选择数据库之后)
PHP+MySQL数据库编程的步骤
第一步:PHP连接MySQL服务器
第二步:选择当前要操作的数据库
第三步:设置请求或返回的数据的字符集
第四步:执行各种SQL语句。
PHP函数补充:include() require() header()
URL统一资源定位符:
http://www.sina.com.cn/index.php?username=yao&userpwd=123456#top
http:// 协议名称www.sina.com.cn是网址
?之前是文件名称, ?之后是查询字符串
查询字符串之后是锚点名称 例:#top
PHP函数补充
md5("字符串");
学习源码: DEDECMS (织梦CMS), 帝国CMS, discuz!, ecshop
重点: 设计数据表 (基于最终网站的实现方式)
获取地址栏的传递参数 用 GET方法, id=$_GET['id']
打印基本变量 用 echo
打印结果集/资源/数组 用 dump()
在线HTML 代码编辑器 kindeditor,