CSS&JS

HTML的块标签

div 默认一个div占一行

span 默认在同一行

CSS概述

css是层叠样式表

样式定义如何显示html元素

样式通常存储在样式表中

外部样式表可以极大提高工作效率

多个样式定义可层叠为一

html相当于网站的骨架 css对骨架进行美化

CSS的基本语法

css的语法通常包括两个部分:一个是选择器,一个是声明

选择器{属性:属性值;属性:属性值}

h1{color:red; font-size:14px}

css的引入方式

行内样式:直接在html的元素上使用style属性设置css

页面类样式:在html的head标签中使用style标签来设置css

外部样式:单独定义一个.css的文件,在html中引入

《link href = “../../css/demo.css” ref=”stylesheet” type=”text/css”

CSS的选择器

元素选择器

—div{

border:1px solid blue;

}

ID选择器

—#d1{

/——/

}

类选择器

.divclass{

border : 1px..

}

css的浮动

使用float属性可以完成div的浮动

float属性的取值



CSS的其他选择器

属性选择器

input【type=”name”】{}

后代选择器

div span{}

查找的是div后面所有的span元素

子元素选择器

div>span

查找div中第一层的span元素

并列选择器

选择器，选择器{}

CSS中的盒子模型



CSS的定位

position属性设置定位

relative 相对定位

absolute 绝对定位

超链接的伪类


JS

JS javaScript 运行在浏览器的脚本语言

js的用途:使页面更加丰富,使页面动起来

js的语法

区分大小写

弱变量类型

尾巴上的分号可有可无

变量命名跟java一样

JS的数据类型

原始类型

undefined:未定义类型

boolean : 布尔类型

number:数字类型

string 字符或者字符串类型

null 空

引用类型

对象类型 对象的默认值是null

JS的运算符

基本与java一样

有一个===全等于,类型和值一样的情况下才为true

JS的语句

与java一致

JS的开发步骤

js通常都是由一个事件触发

触发一个函数,定义一个函数

获得操作对象的控制权

修改要操作的对象的属性或者值

定义函数

function 函数名称(){

函数体

}

window.onload=function(){

}

JS的引入方式

第一种:页面内直接写入JS代码,

第二种:将JS的代码编写到一个.js的文件中,在html中引入JS代码即可



获得页面中元素

document.getElementById(“”)

正则

JS中有两种匹配正则的方式

一:使用String对象中的match方法

二:使用正则对象中的test方法

window对象

confirm()

prompt()弹出一个可输入文本的框,两个参数 后面是默认值 prompt(“请输入内容”,”默认值”)

open(),

setInterval()定时 循环执行

setTimeout()定时 执行一次

clearTimeout 清除定时

Navigator获得浏览器信息

History对象

Location对象

host设置或者返回主机名

port 设置或者返回端口号

href设置或者返回url

JS的事件

onfocus 获得焦点

onblur 失去焦点

onsubmit 提交的时候

onload

onclick

onchange 下拉列表的改变事件

ondbclick 双击

onkeyup 键盘操作事件

鼠标操作事件

… …