【嘉兴东臣php】HTML+CSS+JS基础学习周总结
本周是我进入PHP学习的第一周,本周的学习任务主要是XHTML CSS JS三部分。对于三年纯属混日子的我,几乎可以说对于网页页面设计只会利用Dreamweaver的设计视图利用表单工具拖出一个大致布局。一开始只能简单的做好各种按钮、图片、文本框、复选框。然后就乱起八糟挤在一起不知道该如何进行排版布局,进行排版设置之后也是一个东一个西,整个屏幕各处跑。经过一个星期的梳理学习之后,把零散的知识点整合加上动手操作,可以大致完成一个较为完整、美观的登录、注册页面。
一、XHTML
XHTML是一种可扩展超文本标记语言。HTML是一种基本的WEB网页设计语言,XHTML是一个基于可扩展标记语言的标记语言,看起来与HTML有些相象,只有一些小的但重要的区别,XHTML就是一个扮演着类似HTML的角色的可扩展标记语言(XML),所以,简单的说XHTML就是严谨规范化的HTML语言。在语法上XHTML语言必须符合XML的格式。
与HTML对比
1.所有的标记都必须要有一个相应的结束标记,即有头就有尾,用<>表示出来。
2.所有标签的元素和属性的名字都必须使用小写。
3.所有的XML标记都必须合理嵌套。也就是说,一层一层的嵌套必须是严格对称,层次化,不能颠倒。
4.所有的属性必须用引号""括起来。
5、空元素,也要有结束标签 例如<br/><hr/>
6、多用ID,少用Name
二、CSS(盒子模型)
CSS的含义就是级联样式表的意思,简而言之就是风格表的意思,可以通过CSS来进行对页面的外观设置,一般把给CSS文件一个单独的文件,然后在HTML文件中引入,<link type="text/css" href="url" rel="sheet.css">。
CSS 规则由两个主要的部分构成:选择器,以及一条或多条声明。
选择器通常是您需要改变样式的 HTML 元素;每条声明由一个属性和一个值组成。
在HTML元素中设置CSS样式,需要在元素中设置"id" 和 "class"选择器。CSS 中 id 选择器以 "#" 来定义;类选择器以一个点"."号显示。id 选择器可以为标有特定 id 的 HTML 元素指定特定的样式。class 选择器用于描述一组元素的样式,class 选择器有别于id选择器,class可以在多个元素中使用。
CSS样式重点:
盒子模型顾名思义就是像盒子,它包括,外边距(margin),内边距(padding),边框(border),
clear : both; 清除浮动
opacity : 透明度 ; 设置透明度,一般表示在层里面
z-index:数字 ; 数字越大就显示在越上层 。
border-top-style: 上边框的样式
border-top-width: 上边距的粗细
border-top-color: 上边框的颜色
border-top: 上边框
border: 10px inset red; 综合设置,相关的样式 边框粗细,样式,颜色
boder-style: dashed 虚线 , dotted 点线 , solid 实线 , none 不显示
background-position: 2px 0px; 图片定位,注意两个参数表示为 x 和 y。注意设置这个块元素的宽和高。
font 设置字体的复合属性,大小和字体。
background-attachment:随背景图片滚动,fixed不滚动,scroll滚动,一般设置为fixed
position:relative 相对定位,距离最近的元素标签的距离
position:absolute 绝对定位,距离body的距离
三、JS
JavaScript 是脚本语言,这门语言可用于 HTML 和 web,插入 HTML 页面后,可由所有的现代浏览器执行。
function 函数名(){ } 定义一个函数,函数名() 调用了一个函数
alert(“内容”); 警告框。
document.write("内容");写入一个内容,可以加入HTML代码
confirm(“内容”); 是确认框
window.close 关闭窗口 IE
关键字:又叫保留字,特指语言中内部所使用单词,这些单词禁止用来做 变量、常量或者函数的名字。
标识符:是告诉你 变量、常量或者函数的名字只能 字母、下划线、$符号开头。
转义符:可以经常用\ 转义某一个特殊符号 如" 能让脚本正常运行。
变量:可以改变的量,如数值、字符串、浮点、布尔 变量用var申明。例如var a = 10;这就是告诉你,一个名字叫a的变量赋了一个初始值为10;注意10为整型。
常量:不能改变的量,常量用const申明,例如:const b = 10;这就是告诉你,一个名字叫b的常量值为10,并且这个值不能改变,除非你销毁它。
document.writeln("<pre>") 支持转义字符,如\n换行等,注意:必须在<pre> </pre> 之间写转义。
undenfied 是指找不到某一个对象的属性或者某一个变量,没有赋初始值,如:var abc; alert( document.alert );
null 是指空值,特指找到了属性,但是找不到或者获取不到值。所以为空。
全局变量和局部变量,一般发生在作用域之内,全局变量一般是在函数的之外,局部的是在函数的里面的。全局变量可以作用于多个函数,但是局部只能作用于自己的函数里,不能去管别人。
+ 在通常的情况下是表示字符串的连接符,例如:"a"+"b" 输出的就是ab,
+ 在字符串和任何的类型都是连接符。
+ 在整型之间的是做加法运算符。
其他的 - * / 都是运算符,但是注意:如果强制让一个字符串运算的话,结果是NaN,就是特指未知的值。
parseInt() 将其他类型转化为整型,注意转化整型是从左往右,取出全部的整型,当遇到第一个非整型的值时结束。如:“101a1” 取出的是 101
parseFloat() 将其他类型转化为浮点型。
运算符分类 1、算术运算符:+ - * / 2、比较运算符:> < == >= <= 3、赋值运算符:a = b 4、逻辑运算符:&&(同时满足),||(或,满足一个),!(非,取反值)。 5、条件运算符:条件 ?条件成立 : 条件不成立注意:1、比较运算符返回,布尔类型也就是true或者false。 2、注意:&&(与)运算符,如果两个数比较的话,返回后者,注意:同时满足才会满足。3、注意:或运算符,如果两个数比较的话,或运算符的特点就是满足一个就是满足,后面的相当于不需要看,所以只要前面满足,返回就是前面。
流程控制语句:
if(表达式){JavaScript 语句1} else {javascript语句2;}
For(初始化;条件;增量或减量) {JavaScrip语句;} 注意嵌套for的情况,外面循环一次,里面的for要循环N次。
While(条件) {JavaScrip语句;} 例如:while(条件){
循环操作
}
注意:不要死循环,切记不到万不得已,不要写true。有个限制才会从while循环里出来。
do..while:也是循环写法和while的区别就是:do..while 先执行一次再判断条件,while先判断条件,再看是否执行。
Switch(表达式){case 常量1:javascript语句1;break;} 例如:switch(){
case 0:
case 1:
default:
}
注意:default用于默认情况,也就是都不满足的情况下执行。
break:在英文意思是打破,在程序中的意思是跳出当前循环。
contiue:在英文意思是继续,在程序中的意思是跳出当前循环,进入下一个循环。
四、自我小结:
在整体布局方面还需要多加练习,提高操作熟悉度,在JS里面的逻辑运算比较绕!++i;i++还是有一定纠结程度!
转载于:https://my.oschina.net/9979187/blog/543473
- 点赞
- 收藏
- 分享
- 文章举报
- 【嘉兴东臣php】HTML+CSS+JS基础学习周总结
- 【嘉兴东臣php】HTML+CSS+JS基础学习笔记
- 【嘉兴东臣PHP】HTML+CSS+JS 周总结
- 自己总结前端web知识学习——太多太多(html/css/js/php)
- 前端学习 HTML、CSS、JS基础
- html+css+js基础学习
- 问题总结php、html、js、css、java、python、vue、spring等
- html + css基础-个人学习总结
- 此为传送门,关于学习html、css、js、apache、php、mysql的学习
- 学习Web基础(HTML/CSS/JS)+服务器端技术(LAMP)
- 【嘉兴东臣PHP】HTML+CSS+js笔记
- 【嘉兴东臣php】PHP基础学习周总结
- 【嘉兴东臣PHP】html,css与js
- 【嘉兴东臣php】JS,Jquery,Ajax学习周总结
- 学习及应用html,css,js,jqurey 的总结
- HTML/CSS/Js/Jquery/PHP网站0基础开发到大神系列【飞鸽学院】
- JavaWeb之HTML与CSS基础学习与总结
- html、css、js、jq的学习总结
- 【前端】HTML、CSS、JS、PHP 的学习顺序
- html+css+js基础学习