2021-1-24

initial-scale: viewport 的初始缩放级别(0-10之间的正数,1表示无缩放)

minimum-scale: viewport 能缩放的最小值(0-10之间的正数)

maximum-scale: viewport 能缩放的最大值(0-10之间的正数)

user-scalable: 是否可以手动缩放(yes or no)


没有text-color这个属性,文字颜色统一用color.再加上就近原则


autoplay 属性规定一旦视频就绪马上开始播放。

 

 

preload 属性规定是否在页面加载后载入视频。

如果设置了 autoplay 属性,则忽略该属性。

 

 


变量声明的提前性

if(! "a" in window)这句代码的意思是:判断全局对象window中是否有变量a,如果没有变量a,就进入判断将a赋值为1

但是由于变量的提前声明,以上代码与如下代码等价:

var a;

if(!“a” in  window ){

a=1;

}

alert(a);

由于变量的提前声明特性,在执行这段代码之后,全局对象window中就已经存在a这个变量了

所以不能进入判断,对a进行赋值

所以a的值为undefined


A是语法错误

B是创建一个数组对象

C是创建一个对象

D是一个创建正则对象;若为var obj=/ /; 即赋值被注释掉,及运行被结束;


H5新增标签:

article: 标签定义外部的内容。

aside:标签定义 article 以外的内容。a

audio:h5新增音频标签。没有高宽属性。

canvas:h5新增画布标签。【见下】

command: 定义命令按钮(未测试)

datalist:标签定义选项列表。

datalist 及其选项不会被想显示出来,它仅仅是合法的输入值列表。

details:标签用于描述文档或文档某个部分的细节。

figure:标签用于对元素进行组合。

figcaption:定义 figure 元素的标题。

footer:定义 section 或 document 的页脚。

header:定义 section 或 document 的页眉。

hgroup:用于对网页或区段(section)的标题进行组合。

keygen:标签规定用于表单的密钥对生成器字段

mark:标签定义带有记号的文本。

meter:通过min="0" max="20"的方式定义度量衡。仅用于已知最大和最小值的度量。

nav:定义document或section或article的导航。

output:定义不同的输出类型,比如脚本。

progress:定义任何类型的任务的进度。

rp:定义若浏览器不支持 ruby 元素显示的内容

rt:定义 ruby 注释的解释

ruby:定义 ruby 注释

section:标签定义文档中的节、区段。比如章节、页眉、页脚或文档中的其他部分。

source:audio和video的属性之一。为audio和video定义媒介源。

summary:为details定义标题。

time:定义日期或时间。

video:h5新增视频标签。具有高宽属性。












open() 方法可以查找一个已经存在或者新建的浏览器窗口。

语法:

window.open([URL], [窗口名称], [参数字符串])

参数说明:

URL:可选参数,在窗口中要显示网页的网址或路径。如果省略这个参数,或者它的值是空字符串,那么窗口就不显示任何文档。

窗口名称:可选参数,被打开窗口的名称。

1.该名称由字母、数字和下划线字符组成。

2."_top"、"_blank"、"_selft"具有特殊意义的名称。

_blank:在新窗口显示目标网页

_self:在当前窗口显示目标网页

_top:框架网页中在上部窗口中显示目标网页

3.相同 name 的窗口只能创建一个,要想创建多个窗口则 name 不能相同。

4.name 不能包含有空格。

参数字符串:可选参数,设置窗口参数,各参数用逗号隔开。


tr即table row


Bootstrap 框架的网格系统工作原理如下:

1 、数据行 (.row) 必须包含在容器( .container )中,以便为其赋予合适的对齐方式和内距 (padding) 。

    如: 

       

       

2 、在行 (.row) 中可以添加列 (.column) ,但列数之和不能超过平分的总列数,比如 12 。

    如: 

            

            

            

3 、具体内容应当放置在列容器( column )之内,而且只有列( column )才可以作为行容器 (.row) 的直接子元素

4 、通过设置内距( padding )从而创建列与列之间的间距。然后通过为第一列和最后一列设置负值的外距( margin )来抵消内距 (padding) 的影响

D(正确)

关于列的嵌套

Bootstrap 框架的网格系统还支持列的嵌套。你可以在一个列中添加一个或者多个行( row )容器,然后在这个行容器中插入列。但在列容器中的行容器( row ),宽度为 100% 时,就是当前外部列的宽度


继承最低优先级

首先,优先级顺序:

!important>行内样式>id选择器>类选择器>标签选择器>通配符>继承

在这道题目:

对于span有两种种影响样式的方式,

 (1)继承自父div的color

而对于color而言,它受到类选择器和一个内联样式的影响,并且在这个内联样式中又有一个!important,最为最高级影响 (!important>内联>类选择器),这就使得div的颜色为red,而作为其子元素的span也应该继承自父元素的color

 (2)标签选择器span

但比较这两种影响,(1)作为样式继承的优先级为0,(2)作为标签选择器的优先级为1,所以(2)的优先级以微弱优势高于(1),所以最终采用标签选择器定义的green


正确答案: BC。

B计算了offsetHeight,C重新设置了高度。

A打印出类名,无影响。

D重新设置背景,引起重绘。

B计算了offsetHeight,C重新设置了高度。

A打印出类名,无影响。

D重新设置背景,引起重绘。



reflow(回流)和repaint(重绘)

简要:整个在浏览器的渲染过程中(页面初始化,用户行为改变界面样式,动画改变界面样式等)reflow(回流)和repaint(重绘) 会大大影响web性能,尤其是手机页面。因此我们在页面设计的时候要尽量减少reflow和repaint。

什么是reflow和repaint

reflow:例如某个子元素样式发生改变,直接影响到了其父元素以及往上追溯很多祖先元素(包括兄弟元素),这个时候浏览器要重新去渲染这个子元素相关联的所有元素的过程称为回流。

reflow:几乎是无法避免的。现在界面上流行的一些效果,比如树状目录的折叠、展开(实质上是元素的显 示与隐藏)等,都将引起浏览器的 reflow。鼠标滑过、点击……只要这些行为引起了页面上某些元素的占位面积、定位方式、边距等属性的变化,都会引起它内部、周围甚至整个页面的重新渲 染。通常我们都无法预估浏览器到底会 reflow 哪一部分的代码,它们都彼此相互影响着。

repaint:如果只是改变某个元素的背景色、文 字颜色、边框颜色等等不影响它周围或内部布局的属性,将只会引起浏览器 repaint(重绘)。repaint 的速度明显快于 reflow

下面情况会导致reflow发生

1:改变窗口大小

2:改变文字大小

3:内容的改变,如用户在输入框中敲字

4:激活伪类,如:hover

5:操作class属性

6:脚本操作DOM

7:计算offsetWidth和offsetHeight

8:设置style属性

1.历史:

canvas是html5提供的新元素。

而svg存在的历史要比canvas久远,已经有十几年了。svg并不是html5专有的标签,最初svg是用xml技术(超文本扩展语言,可以自定义标签或属性)描述二维图形的语言。

2.功能:

canvas可以看做是一个画布,其绘制出来的图形为标量图。可以在canvas中引入jpg或png这类格式的图片。在实际开发中,大型的网络游戏都是用canvas画布做出来的,并且canvas的技术现在已经相当的成熟。另外,我们喜欢用canvas来做一些统计用的图表,如柱状图曲线图或饼状图等。

而svg,所绘制的图形为矢量图,不能引入普通的图片,因为矢量图的不会失真的特点,在项目中我们会用来做一些动态的小图标。这个特点也很适合被用来做地图,百度地图就是用svg技术做出来的。

3.技术:

canvas里面绘制的图形不能被引擎抓取,canvas中我们绘制图形通常是通过javascript来实现。

而svg里面的图形可以被引擎抓取,支持事件的绑定,svg更多的是通过标签来实现。我再来介绍一个svg的js库:TWO.JS。其中包含two.js和three.js前者用于绘制二维图形,后者用于绘制三维图形。TWO.JS可以支持三种格式,svg(默认)、canvas、和WEBGL。当然也可以在普通div中引入。

/*以上源自知乎*/

你可能感兴趣的:(2021-1-24)