【嘉兴东臣php】HTML+CSS+JS周总结
2015-12-12 00:00
465 查看
摘要: 东臣的日常
这一周我们学习了XHTML、CSS、JS三大块内容，从简到难的学习过程，XHTML让我学到了各种各样的标签等等，css定义了标签元素的样式，js实现了弹窗、函数调用的效果。
差不多这一周一直在做登陆注册的页面，我觉得我对于css的内容还不是特别熟练，各种对于样式的调试，div的运用还是初出茅庐，js的话还可以，流程控制方面和c语言有些相似之处，所以掌握得还行。
2、XML，XML其实是一种标记性的语言。例如：
<break></break>,<hello><rose></rose></hello>
3、XHTML 有以下几个特性：
1、有头就有尾，用<>表示出来。
2、层次化的东西，一定要正确，不要颠倒。
3、所有的属性和元素都要小写。
4、空元素，也要有结束标签 例如<br/><hr/>
5、多用ID，少用Name
4、dl dd dt 都是定义一个自定义列表的，参考以前学过的ul li，例如：
<dl>
<dt>你好</dt>
<dd>这是向你问好</dd>
<dt>你很好</dt>
<dd>这是说你人很好</dd>
</dl>
5、visibility: hidden; 设置元素不可见
6、background-repeat:no-repeat 背景不重复
7、整理一个登录页面完成的步骤(参考renren.com)：
1、定义列表 <dl><dd></dd></dl>
2、在列表的相关的项里面加入input 文本框
3、设置文本框的样式，height,width,padding,margin,font-size等
4、设置dd的样式
width，height等。注意设置了dd样式一定也要考虑好input文本框的样式，因为dd里面嵌套了至少一个input
5、接下来考虑的是按钮，按钮只需要遵守dd的基本样式，并且设置好背景颜色即可。
6、验证码：注意验证码的dd列表，有两部分组成：文本框和验证码图片，注意分配宽度，另外，要想两个控制在一行，请设置验证码图片float:right;另外需要注意：文本框不能太宽，可能会把验证码挤掉，最重要一点一定要限制dd的宽度，不然会在屏幕的最右边去了。
7、边框，border，注意：设置相关的width和高度，另外最好设置一个背景图片或者颜色，最好设置一个内边距padding，因为边框和控件最好有距离。
8、设置这个边框，float:right
9、设置body的背景图片：background-image:(url:图片链接)。
&nbs
3ff8
p; 盒子模型顾名思义就是像盒子，它包括，外边距(margin)，内边距(padding)，边框(border)，详细请参加firebug中的盒子模型的图例。
2、clear:both 清除浮动，由于float浮动会造成所有的元素都会在一行，因此清除的话可能会达到换行的效果。
3、opacity: 0.2(表示20%的透明度); 透明度，一般设置在层里。
4、z-index: 数字。数字越大，显示在越上层，可以表示负数。
5、border-top-style: 上边框的样式
border-top-width: 上边距的粗细
border-top-color: 上边框的颜色
border-top: 上边框
6、border: 10px inset red; 综合设置，相关的样式 边框粗细，样式，颜色，注意只能综合设置，不能设置单一。
7、boder-style： dashed 虚线 dotted 点线
solid 实线 none 不显示
8、background-position: 2px 0px; 图片定位，注意两个参数表示为 x 和 y。注意设置这个块元素的宽和高。
9、font: 36px 微软雅黑; 设置字体的复合属性，大小和字体
10、负数之美：margin 是可以使用负数，也就是相反的反向，padding 不可以使用负数。
11、清除内边距、清除外边距 例如 body{
margin:0px;padding 0px;
} （基本上都是工作上的网站用法）
12、overflow: hidden; 当界面溢出之后的效果，hidden为隐藏，还有一种常用就是scroll
13、margin: 0 auto 水平居中，但是要注意：因为设置的是外边距，因此最好是设置div里面的块元素。
14、background-repeat:背景是否平铺。repeat 平铺，no-repeat 不平铺，repeat-x 横轴平铺，repeat-y 纵轴平铺
15、background-attachment:随背景图片滚动，fixed不滚动，scroll滚动，一般设置为fixed
16、position：relative 相对定位，距离最近的元素标签的距离
position：absolute 绝对定位，距离body的距离
2、JS，JS是基于Web的网页端的脚本语言。
HTML是名词 ，CSS 是形容词，JS 是动词。
3、function 函数名(){ } 定义一个函数，函数名() 调用了一个函数
4、alert(“内容”); 警告框。
5、document.write("内容")；写入一个内容，可以加入HTML代码
6、confirm(“内容”)； 是确认框
7、window.close 关闭窗口 IE
8、关键字：又叫保留字，特指语言中内部所使用单词，这些单词禁止用来做 变量、常量或者函数的名字。
9、标识符：是告诉你 变量、常量或者函数的名字只能 字母、下划线、$符号开头。
10、转义符：可以经常用\ 转义某一个特殊符号 如" 能让脚本正常运行。
11、变量：可以改变的量，如数值、字符串、浮点、布尔
变量用var申明。例如var a = 10；这就是告诉你，一个名字叫a的变量赋了一个初始值为10；注意10为整型。
12、常量：不能改变的量，常量用const申明，例如：const b = 10；这就是告诉你，一个名字叫b的常量值为10，并且这个值不能改变，除非你销毁它。
13、document.writeln("<pre>") 支持转义字符，如\n换行等，注意：必须在<pre> </pre> 之间写转义。
14、undenfied 是指找不到某一个对象的属性或者某一个变量，没有赋初始值，如:var abc; alert( document.alert );
15、null 是指空置，特指找到了属性，但是找不到或者获取不到值。所以为空。
16、全局变量和局部变量，一般发生在作用域之内，全局变量一般是在函数的之外，局部的是在函数的里面的。全局变量可以作用于多个函数，但是局部只能作用于自己的函数里，不能去管别人。
17、+ 在通常的情况下是表示字符串的连接符，例如："a"+"b" 输出的就是ab，
18、+ 在字符串和任何的类型都是连接符。
19、+ 在整型之间的是做加法运算符。
20、其他的 - * / 都是运算符，但是注意：如果强制让一个字符串运算的话，结果是NaN，就是特指未知的值。
21、parseInt() 将其他类型转化为整型，注意转化整型是从左往右，取出全部的整型，当遇到第一个非整型的值时结束。如：“101a1” 取出的是 101
21、parseFloat() 将其他类型转化为浮点型。
22、运算符分类
1、算术运算符：+ - * /
2、比较运算符：> < == >= <=
3、赋值运算符：a = b
4、逻辑运算符：&&(同时满足)，||(或，满足一个)，！(非，取反值)。
5、条件运算符：条件 ？条件成立 : 条件不成立
1、注意：比较运算符返回，布尔类型也就是true或者false。
2、注意：&&(与)运算符，如果两个数比较的话，返回后者，注意：同时满足才会满足。
3、注意：或运算符,如果两个数比较的话，或运算符的特点就是满足一个就是满足，后面的相当于不需要看，所以只要前面满足，返回就是前面后面。
23、条件判断
1、第一种形式
if(条件){
}else{
}
2、第二种形式
if(条件){
}else if(条件){
}else{
}
3、第三种形式
if(条件){
if(条件){
}else{
}
}else{
}
这一周我们学习了XHTML、CSS、JS三大块内容，从简到难的学习过程，XHTML让我学到了各种各样的标签等等，css定义了标签元素的样式，js实现了弹窗、函数调用的效果。
差不多这一周一直在做登陆注册的页面，我觉得我对于css的内容还不是特别熟练，各种对于样式的调试，div的运用还是初出茅庐，js的话还可以，流程控制方面和c语言有些相似之处，所以掌握得还行。
一、XHTML
1、XHTML 就是XML和HTML的结合体，X代表可扩展的。简单的说XHTML就是严谨规范化的HTML语言。2、XML，XML其实是一种标记性的语言。例如：
<break></break>,<hello><rose></rose></hello>
3、XHTML 有以下几个特性：
1、有头就有尾，用<>表示出来。
2、层次化的东西，一定要正确，不要颠倒。
3、所有的属性和元素都要小写。
4、空元素，也要有结束标签 例如<br/><hr/>
5、多用ID，少用Name
4、dl dd dt 都是定义一个自定义列表的，参考以前学过的ul li，例如：
<dl>
<dt>你好</dt>
<dd>这是向你问好</dd>
<dt>你很好</dt>
<dd>这是说你人很好</dd>
</dl>
5、visibility: hidden; 设置元素不可见
6、background-repeat:no-repeat 背景不重复
7、整理一个登录页面完成的步骤(参考renren.com)：
1、定义列表 <dl><dd></dd></dl>
2、在列表的相关的项里面加入input 文本框
3、设置文本框的样式，height,width,padding,margin,font-size等
4、设置dd的样式
width，height等。注意设置了dd样式一定也要考虑好input文本框的样式，因为dd里面嵌套了至少一个input
5、接下来考虑的是按钮，按钮只需要遵守dd的基本样式，并且设置好背景颜色即可。
6、验证码：注意验证码的dd列表，有两部分组成：文本框和验证码图片，注意分配宽度，另外，要想两个控制在一行，请设置验证码图片float:right;另外需要注意：文本框不能太宽，可能会把验证码挤掉，最重要一点一定要限制dd的宽度，不然会在屏幕的最右边去了。
7、边框，border，注意：设置相关的width和高度，另外最好设置一个背景图片或者颜色，最好设置一个内边距padding，因为边框和控件最好有距离。
8、设置这个边框，float:right
9、设置body的背景图片：background-image:(url:图片链接)。
二、CSS
1、盒子模型&nbs
3ff8
p; 盒子模型顾名思义就是像盒子，它包括，外边距(margin)，内边距(padding)，边框(border)，详细请参加firebug中的盒子模型的图例。
2、clear:both 清除浮动，由于float浮动会造成所有的元素都会在一行，因此清除的话可能会达到换行的效果。
3、opacity: 0.2(表示20%的透明度); 透明度，一般设置在层里。
4、z-index: 数字。数字越大，显示在越上层，可以表示负数。
5、border-top-style: 上边框的样式
border-top-width: 上边距的粗细
border-top-color: 上边框的颜色
border-top: 上边框
6、border: 10px inset red; 综合设置，相关的样式 边框粗细，样式，颜色，注意只能综合设置，不能设置单一。
7、boder-style： dashed 虚线 dotted 点线
solid 实线 none 不显示
8、background-position: 2px 0px; 图片定位，注意两个参数表示为 x 和 y。注意设置这个块元素的宽和高。
9、font: 36px 微软雅黑; 设置字体的复合属性，大小和字体
10、负数之美：margin 是可以使用负数，也就是相反的反向，padding 不可以使用负数。
11、清除内边距、清除外边距 例如 body{
margin:0px;padding 0px;
} （基本上都是工作上的网站用法）
12、overflow: hidden; 当界面溢出之后的效果，hidden为隐藏，还有一种常用就是scroll
13、margin: 0 auto 水平居中，但是要注意：因为设置的是外边距，因此最好是设置div里面的块元素。
14、background-repeat:背景是否平铺。repeat 平铺，no-repeat 不平铺，repeat-x 横轴平铺，repeat-y 纵轴平铺
15、background-attachment:随背景图片滚动，fixed不滚动，scroll滚动，一般设置为fixed
16、position：relative 相对定位，距离最近的元素标签的距离
position：absolute 绝对定位，距离body的距离
三、JS
1、background-color:rgba(0,0,0,0.5); 设置DIV透明度2、JS，JS是基于Web的网页端的脚本语言。
HTML是名词 ，CSS 是形容词，JS 是动词。
3、function 函数名(){ } 定义一个函数，函数名() 调用了一个函数
4、alert(“内容”); 警告框。
5、document.write("内容")；写入一个内容，可以加入HTML代码
6、confirm(“内容”)； 是确认框
7、window.close 关闭窗口 IE
8、关键字：又叫保留字，特指语言中内部所使用单词，这些单词禁止用来做 变量、常量或者函数的名字。
9、标识符：是告诉你 变量、常量或者函数的名字只能 字母、下划线、$符号开头。
10、转义符：可以经常用\ 转义某一个特殊符号 如" 能让脚本正常运行。
11、变量：可以改变的量，如数值、字符串、浮点、布尔
变量用var申明。例如var a = 10；这就是告诉你，一个名字叫a的变量赋了一个初始值为10；注意10为整型。
12、常量：不能改变的量，常量用const申明，例如：const b = 10；这就是告诉你，一个名字叫b的常量值为10，并且这个值不能改变，除非你销毁它。
13、document.writeln("<pre>") 支持转义字符，如\n换行等，注意：必须在<pre> </pre> 之间写转义。
14、undenfied 是指找不到某一个对象的属性或者某一个变量，没有赋初始值，如:var abc; alert( document.alert );
15、null 是指空置，特指找到了属性，但是找不到或者获取不到值。所以为空。
16、全局变量和局部变量，一般发生在作用域之内，全局变量一般是在函数的之外，局部的是在函数的里面的。全局变量可以作用于多个函数，但是局部只能作用于自己的函数里，不能去管别人。
17、+ 在通常的情况下是表示字符串的连接符，例如："a"+"b" 输出的就是ab，
18、+ 在字符串和任何的类型都是连接符。
19、+ 在整型之间的是做加法运算符。
20、其他的 - * / 都是运算符，但是注意：如果强制让一个字符串运算的话，结果是NaN，就是特指未知的值。
21、parseInt() 将其他类型转化为整型，注意转化整型是从左往右，取出全部的整型，当遇到第一个非整型的值时结束。如：“101a1” 取出的是 101
21、parseFloat() 将其他类型转化为浮点型。
22、运算符分类
1、算术运算符：+ - * /
2、比较运算符：> < == >= <=
3、赋值运算符：a = b
4、逻辑运算符：&&(同时满足)，||(或，满足一个)，！(非，取反值)。
5、条件运算符：条件 ？条件成立 : 条件不成立
1、注意：比较运算符返回，布尔类型也就是true或者false。
2、注意：&&(与)运算符，如果两个数比较的话，返回后者，注意：同时满足才会满足。
3、注意：或运算符,如果两个数比较的话，或运算符的特点就是满足一个就是满足，后面的相当于不需要看，所以只要前面满足，返回就是前面后面。
23、条件判断
1、第一种形式
if(条件){
}else{
}
2、第二种形式
if(条件){
}else if(条件){
}else{
}
3、第三种形式
if(条件){
if(条件){
}else{
}
}else{
}
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 