-
超链接要点:
a标签的target属性
_blank 在新打开、未命名的窗口打开链接,
_parent 在父窗口打开链接
_self 当前窗口打开
_top 目标将会清除所有被包含的frame框架 -
锚点
href="#duanluo" //锚点配合超链接的使用
< a name=“duanluo”> //锚点的定义
< a href=“01.html#duanluo”> //其他文本的锚点
锚点必须先定义在使用 -
列表细节:
table 的行和列的合并,
行:rowspan
列:colspan
具体语法,在当前 < td> 中 < td coslpan = “2”>合并2列
< td rowspan= “2”>合并2行 -
CSS中背景图片设置:
background-attachment:(scroll:背景随滚动条滚动/fixed:背景不随滚动条滚动)。 -
伪类:
伪类的分类
伪类包含两种:
状态伪类(状态发生改变)和结构性伪类(选择子元素)
(结构性)伪类选择器
:first-child:选择元素的第一个子元素
:last-child:选择某个元素的最后一个子元素
:nth-child():选择某个元素的一个或多个特定的子元素
:nth-last-child:选择某个元素的一个或多个特定的子元素,从这个子元素的最后一个子元素开始算
:first-of-type:选择一个上级元素下的第一个同类子元素 -
选择器
1、空格选择器也称作子孙(后代)选择器
举例:div标签下的所有p标签被选中。注意,不论p标签位于那一层。
div p{
color:blue;
}
2、>选择器就是子选择器(不是子孙后代)
举例:div标签下一层的p标签被选中
div>p{
color:red;
}
3、+选择器就是相邻兄弟选择器
举例:div标签同一个层级的p标签被选中
div+p{
color:red;
}
4、[]属性选择器
举例:p标签的属性class是p1的元素选中
p[class=“p1”]{
} -
div设置
- overflow用于超出div部分处理。visible默认,不做裁剪,呈现在div外;hidden超出部分被隐藏;scoll无论是否超出范围都显示滚动条;auto按需显示滚动条。
- 使用top/left进行位置设置时必须加入position定位设置,否则坐标无效;
- css轮廓
outline:dashed;虚线轮廓
none不显示
dotted点状轮廓
solid实线
double双线
css边框
boder-bottom:soild;下边框实线
boder-left
boder-right
boder-top
boder-bottom.
-
盒子模型
网页中的每个元素都可以看作一个盒子,盒子有外边距(margin)、边框(border)、内边距(padding)、内容(content)这4个属性。
外边距(margin):是元素与元素之间的距离,或者是元素外面留出的一段空白;
内边距(padding):元素里的内容与元素边框之间的距离;
边框(border):元素本身;
内容(content):元素中放置的东西,元素的宽和高指的是元素中内容的宽和高,并不是元素本身的宽和高padding内边距的距离产生自哪里呢?
可以分别设置两个属性值来改变:
box-sizing: content-box ; // 第一种方式是系统默认的方式,将不改变原来内容的高度和宽度的属性值,扩充边框来达到目的
box-sizing: border-box : // 设置之后,边框的大小再在改变,压缩内容以保证内边距的大小。 -
定位机制
(标准)文档流、脱标流(float position:absolute)(脱离标准文档流)
文档流特点:
1 空白折叠现象(编辑区换行回车显示空格)
2 高矮不齐,底边对齐
3 自动换行,一行写满,换行写。
4 将子元素设置为浮动之后,父元素在没有指定高度的情况下父元素的高度将不存在。
10.css定位
position: relative absolute static fixed分别对应相对,绝对,无定位,固定,默认是无定位。
相对定位 相对定位的偏移参考元素是元素本身。不会使元素脱离文档流。元素的初始位置占据的空间会被保留。
主要代码 position:relative;
相对位置的偏移 是相对于自己以前的位置进行的偏移
相对定位一般不作为元素单独显示 而是作为容器进行包含 配合其他子元素将相对定位做成父元素来使用
绝对定位 相对于已定位的最近的祖先元素,如果没有已定位的最近的祖先元素,那么他的位置就相对于最初的包含块(如 body)
主要代码 position:absolute;
绝对定位会产生浮动效果
绝对定位,会产生浮动的效果,破坏原有的文档流,不同区域之间可以实现重合,叠加。
固定定位 相对于浏览器窗口进行定位
主要代码 position:fixed
示例:演示div相对浏览器位置不改变的效果 移动滚动条位置不发生改变
相对定位与绝对定位
参照物:自己 最近的父级元素
不破坏文档流 破坏文档流
通常情况下 相对定位作为父一级单位 绝对定位作为子一级单位
相对定位可以不设置 top left 依然保留在原位置 供绝对定位有参照物
浮动与定位
浮动与绝对定位的组合 都会破坏文档流 破坏之后 绝对定位会忽略绝对定位所占用的位置 而浮动会绕过浮动所占用的位置
浮动与相对定位的组合 便兼具两者的特点,既可以采用浮动 又可以偏移
-
JS字符串操作:
str.substr(a,b);从a位置开始截,截b个
str.substring(a,b);从a位置开始截,截到b位置,但不包含b位
str.indexOf(a);查找字符a在字符串str中第一次出现的位置
str.indexOf(a,b);从第b位开始查找,字符a第一次出现的位置var arr[] = str.split(a);以字符a为介质,将字符串str分割,以数组的形式返回
str.concat(a);在原字符串的后面追加字符a
arr.concat(a,b,c);在原数组的基础上追加a,b,c三个元素
str.replace(a,b);将字符串str中第一次出现的a替换成b -
内置函数:
字符串函数:
split(fn)利用字符串fn分割字符串,返回字符串数组
concat(fn) 作用:在原字符串的后面添加字符串fn(fn可以是多个字符串),或在原数组的基础上为数组添加新的元素fn
replace(要被替换的元素,替换元素) 作用:将第一次出现的“要被替换的元素”替换成“替换元素”
日期函数:
对象初始化:var d1=new Date();获取当前时间的对象 var d2=new Data(“2020-1-1 10:58:58”);设置时间对象
函数:
getMonth()获得月份(JS中月份的取值范围为0-11)
getDate()获取几号
getFullYear()获取年份
getHours()获取小时
getMinutes()获取分钟
getSeconds()获取秒
getTime()将日期转换为毫秒
getDay()获得星期几,取值范围为0~6
Math.round(参数) 对参数进行四舍五入取整
n.toFixed(2) 对n进行四舍五入,并保留两位小数
Math.min(参数1,参数2,…)求取n个参数的最小值(Math.max同理)
Math.abs(参数)求绝对值 -
JS事件
单击事件:οnclick=“执行函数1,执行函数2…”
刷新页面就会显示函数功能的事件:οnlοad=“执行函数1,执行函数2,…”(当前页面显示前先执行onload中的内容)
获取单选按钮的值:document.getElementsByName() 利用checked属性(若选中,则checked值为true)和value属性
下拉菜单(三级联动):通过在body中的onload事件
函数:
var yyyy=document.getElementById(“yyyy”);
yyyy.options.add(new Option(“1”,“1”));(值value,显示的名字)
获取某一下拉列表的长度:yyyy.length;
设置某一下拉元素为默认值:yyyy.selectedIndex=n(要先获取该下拉表单的长度,n是默认值在下拉表单中的位置索引)
删除下拉列表中的元素:dd.options.length=0;将该下拉列表的长度设置为0,效果是删除
onchange事件配合select标签使用,当下拉表单中的元素发生改变时就会触发onchange事件
删除下拉列表中的某一元素:dd.options.remove(n); n为要被删除的元素的位置索引。
易错点:
yyyy.options.add(new Option(i,i));(值,名字),
注意,第一个是options,首字母小写,后面是复数!!!
第二个,添加new选项的时候,是“Option”,没有s,首字母大写!!!