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 属性规定一旦视频就绪马上开始播放。

<video controls="controls" autoplay="autoplay">

  <source src="movie.ogg" type="video/ogg" />

  <source src="movie.mp4" type="video/mp4" />

</video>

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

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

<video controls="controls" preload="auto">

  <source src="movie.ogg" type="video/ogg" />

  <source src="movie.mp4" type="video/mp4" />

</video>


变量声明的提前性

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) 。

    如: <div class=" container ">

       <div class=" row "></div>

       </div>

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

    如: <div class="container">

            <div class="row">

            <div class="col-md- 4 "></div>

            <div class="col-md- 8 "></div>

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中引入。

/*以上源自知乎*/

©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 219,635评论 6 508
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 93,628评论 3 396
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 165,971评论 0 356
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 58,986评论 1 295
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 68,006评论 6 394
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 51,784评论 1 307
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 40,475评论 3 420
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 39,364评论 0 276
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 45,860评论 1 317
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 38,008评论 3 338
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 40,152评论 1 351
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 35,829评论 5 346
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 41,490评论 3 331
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 32,035评论 0 22
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 33,156评论 1 272
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 48,428评论 3 373
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 45,127评论 2 356

推荐阅读更多精彩内容