WEB学习日记day02

复习:

表单标签:

form自带的属性:

action:

method:

enctype:

input:

type:

hidden

name:

value:

checked

select:

option

textarea:

Label:

CSS引入方式

内嵌:

内联:

外联: link -> href

_________________________________________

1.CSS的选择器

1)简单选择器

a.元素选择器: 元素(标签)

b.id选择器: [#id]

c.类选择器: [.class]

d.组合选择器: 使用[,]进行拼接

e.所有元素选择器: [*]

2)派生选择器

a.后代选择器: 使用[空格]连接

b.子代选择器: 使用[>]连接

c.相邻兄弟选择器: 使用[+]连接

3)伪类选择器

注意:[:]后+的,都是属于伪类/伪元素选择器

a.选出第一个元素:[:first-child]

b.选出最后一个元素:[:last-child]

c.和超链接相关:

a.已经访问过的状态[:visited]

b.悬停在连接上的状态[:hover]

c.普通状态[a]

d.鼠标单击状态[:active]

2.浮动效果: float

* left -> 向左浮动

* right -> 向右浮动

* 清除浮动效果: clear:both

3.盒子模型

1)特点:盒子模型是所有块元素都拥有的内容

2)组成部分:

* margin:外边距 - 元素和相邻元素之间的距离

注意: 取值不会做叠加

* padding:内边距 - 元素内容和边框之间的距离

* border:边框

* width/height: 元素内容的宽和高

3)行内元素和块元素之间的转换:

block: 转换成块元素

inline: 转换成行内元素

none: 不显示,隐藏

_________________________________________

JavaScript:

1.使用方式

1)内嵌式

* 特点: 可以放在html文件中的任意位置

* 属性: type = "text/javascript"

= "text/css"

= "text/html"

2)外联式:

使用步骤:

1.在外部创建一个js文件夹

2.在html文件中添加一个script标签,标签必须存在属性src: 引入的js文件的地址

2.ECMA - 核心基础

1)变量:

特点:

a.js中的变量是弱类型,类型是可以随意进行切换的

b.可以不用声明变量,不声明是表示全局变量

typeof类型:

值: number - 数值类型

undefined - 没有定义类型

boolean - 布尔类型

String - 字符类型

Object - 引用或者null类型

2)逻辑控制语句

注意: java中的类型全部变成var即可

3)运算符:

== 和 === 的区别:

==: 比较内容是否相等

===: 比较 内容 + 类型

4)数组:

* 特点: js中的数组是可变长数组.

* 创建方式:

new Array();

new Array(size);

new Array(元素,元素,...)

var arr = [元素,元素,...];

5)JS的函数: function

特点:

a.没有访问修饰符,返回值类型等

b.没有方法重载,会直接覆盖

c.赋值时多给了值,不会有任何影响

d.赋值时少给了值,出现NaN

NaN -> not a number

e.返回值可写可不写

3.事件 - Events

1)常用事件属性:

onblur - 让元素失去焦点,结合input标签使用

onfocus - 让元素获取焦点,结合input标签使用

onchange - 内容改变,结合select标签使用

onclick - 单击,可以用于所有元素

onmouseover - 鼠标被移动到某个元素上

onmouseout - 鼠标被移除

onkeydown - 键盘按下,结合input标签使用

onload - 某个页面被加载,结合body标签

onsubmit - 提交按钮点击后会触发的事件

2)事件的使用方式

a.内嵌式

在标签内添加事件属性

例如: onclick = ""

b.内联式

①.在标签内添加事件属性

②.添加script标签

③.调用js函数 function,在函数中写内容

④.属性值 = 函数名

例如:onclick = "m1()"

function m1()