html5默认值,html5标签默认值

HTML5初学者笔记

HTML5记录

创新互联专业为企业提供泸水网站建设、泸水做网站、泸水网站设计、泸水网站制作等企业网站建设、网页设计与制作、泸水企业网站模板建站服务，十多年泸水做网站经验，不只是建网站，更提供有价值的思路和整体网络服务。

一、VS code引入插件后运行，终端执行

二、引入外部js文件：

1、js的exports.a = a；方式暂时不知道怎么做

2、直接引入，script之后可以直接使用。参照html-vue项目

3、数据类型

String、Number、Boolean、Null、undefined、symbol、Object、Array、Function

三、 JS显示数据方式：

window.alert()

document.write()

innerHTML=‘’

console.log()

四、 let、const、var

五、全局变量、局部变量注意点

如果变量在函数内没有声明（没有使用 var 关键字），该变量为全局变量。

六、事件：

onchange、onclick、onmouseover、onmouseout、onkeydown、onload…

html dom onclick之类的直接使用，vue是@click，小程序是bindTap

七、 this关键字：

1、在对象方法中， this 指向调用它所在方法的对象。

2、单独使用 this，它指向全局(Global)对象。

3、函数使用中，this 指向函数的所属者。

4、严格模式下函数是没有绑定到 this 上，这时候 this 是 undefined。

5、在 HTML 事件句柄中，this 指向了接收事件的 HTML 元素。

6、apply 和 call 允许切换函数执行的上下文环境（context），即 this 绑定的对象，可以将 this 引用到任何对象。

八、箭头函数：

1、有的箭头函数都没有自己的 this 。不适合定义一个对象的方法。

2、当我们使用箭头函数的时候，箭头函数会默认帮我们绑定外层 this 的值，所以在箭头函数中 this 的值和外层的 this 是一样的。

3、箭头函数是不能提升的，所以需要在使用之前定义。

4、使用 const 比使用 var 更安全，因为函数表达式始终是一个常量。

九、闭包：

闭包是一种保护私有变量的机制，在函数执行时形成私有的作用域，保护里面的私有变量不受外界干扰。

直观的说就是形成一个不销毁的栈环境。

闭包会持有父方法的局部变量和参数并且不会随父方法销毁而销毁

不必要的闭包只会增加内存消耗

十、事件

body事件：onload、onunload

元素事件：onclick、onmouseover、onmouseout、onmousedown、onmouseup、onfocus

事件捕获

document.getElementById(‘demo’).addEventListener(‘事件名’, 方法名, 是否捕获传递)

方法名：如果是相应事件，则只可写方法名methodName，写成methodName()则会自动执行

如果方法需要传递参数，则只可以使用匿名函数， function( { methodName(p1, p2) } );

是否捕获传递：默认false，即冒泡传递

IE8和更早版本： x.attachEvent("onclick", myFunction) ;

十一、Window加载，页面声明周期入口

window.onload = function () { }

十二、数据存储

localStorage不会被自动删除，

sessionStorage 网页关闭会自动删除

sql

manifest文件

区别：

localStorage只要在相同的协议、相同的主机名、相同的端口下，就能读取/修改到同一份localStorage数据。

sessionStorage比localStorage更严苛一点，除了协议、主机名、端口外，还要求在同一窗口（也就是浏览器的标签页）下。

十三、 CSS声明权重（选择器）

内联ID伪类属性类元素/类型通用

!important会改变优先级

十四、元素隐藏/显示

1、dispatch：none 隐藏不占用空间

2、visibility：hidden 隐藏，仍然占用空间

3、v-if 存在/不存在

4、v-show 只生成一次，占用内存

十五、 Position

static 默认方式，没有定位

fixed 相对于浏览器窗口固定定位，不占用文档流，其他元素会相对位移

absolute 相对于最近的已定位父元素定位，不占用文档流，其他元素会相对位移

relative 相对于自身的定位

sticky 粘滞定位，基于用户的滚动位置定位

十六、 float

1、只能左右浮动

2、左右浮动，直到外边缘碰到另一个浮动元素

3、浮动之后的元素将围绕它

4、浮动之前的元素不受影响

5、如果是图像浮动，下面的文本流将环绕它

6、clear声明的元素，属性指定元素两侧不能出现浮动元素。

推荐使用flex布局

十七、文字显示…

单行

任意行

十八、 box-shadow顺序

十九、 flex布局

容器属性：

属性 / 说明可选值

f方向： lex-direction

换行：flex-wrap

简写：flex-flow

主轴上的对齐方式：justify-content

交叉轴上如何对齐：align-items

多根轴线的对齐方式：align-content。

如果项目只有一根轴线，该属性不起作用

项目item属性:

order：排列顺序，越小越靠前

flex-grow：放大比例，2比1占用的空间大一倍

flex-shrink：缩小比例，默认1，当空间不足时等比例缩小。如果一个项目的属性为0，其他项目都为1，则空间不足时，前者不缩小

flex-basis：定义了在分配多余空间之前，项目占据的主轴空间

flex ：简写

align-self：允许单个项目与其他项目不一样的对齐方式，可覆盖align-items属性。默认值为auto，表示继承父元素的align-items属性，如果没有父元素，则等同于stretch

html 里select 下拉列表中设置默认值怎么写？

设置下拉列表框的默认值:使用关键字selected

select name = "pronvince"

option value ="SH"上海/option

option value ="BJ"北京/option

option value ="JS"江苏/option

option value ="HB" selected="selected"湖北/option

option value ="ZJ"浙江/option

/select

如果希望设置默认值，在option 的标签里加入:selected = "selected"即在展示时，为默认值。

html 有一个selected属性，selected=‘true’时，即选中，selected=‘false’则未选中。在html5中则将selected=‘true’可以缩写为selected,因为selected=‘false’是默认属性，比如： Volvo Saab Opel Audi 那么第4个option就是被选中的元素。

meter标签是什么？'>HTML5>meter标签是什么？

meter 标签是HTML5新增的标签，定义度量衡。仅用于已知最大和最小值的度量。也就是必须定义度量的范围，既可以在元素的文本中，也可以在 min/max 属性中定义。

meter min="0" max="20"5/meter

meter2 out of 10/meter

meter30%/meter

high number 定义度量的值位于哪个点，被界定为高的值。

low number 定义度量的值位于哪个点，被界定为低的值。

max number 定义最大值。默认值是 1。

min number 定义最小值。默认值是 0。

optimum number 定义什么样的度量值是最佳的值。如果该值高于 "high" 属性，则意味着值越高越好。如果该值低于 "low" 属性的值，则意味着值越低越好。

value number 定义度量的值。

可以用CSS的伪元素对默认的显示方式处理下（因为很可能各个浏览器的显示方式不一）：

!doctype html

html lang="en"

head

meta charset="UTF-8"

titleCoolwp.net Demo/title

style

.deal meter { -webkit-appearance: none; }

.deal ::-webkit-meter-bar {

height: 1em;

background: white;

border: 1px solid black;

}

.deal ::-webkit-meter-optimum-value { background: green; } /* 好 */

.deal ::-webkit-meter-suboptimum-value { background: orange; } /* 凑合 */

.deal ::-webkit-meter-even-less-good-value { background: blue; } /* 糟糕 */

.deal ::-moz-meter-bar {

background: rgba(0,96,0,.6);

}/style

/head

body

默认的：meter low="69" high="80" max="100" optimum="100" value="92"A/meter

meter low="69" high="80" max="100" optimum="100" value="72"C/meter

meter low="69" high="80" max="100" optimum="100" value="52"E/meter

p class="deal"

处理后的：meter low="69" high="80" max="100" optimum="100" value="92"A/meter

meter low="69" high="80" max="100" optimum="100" value="72"C/meter

meter low="69" high="80" max="100" optimum="100" value="52"E/meter

/body

/html

实际显示效果：

名称栏目：html5默认值,html5标签默认值
标题网址：https://www.cdcxhl.com/article8/dsdspop.html

成都网站建设公司_创新互联，为您提供动态网站、定制开发、移动网站建设、手机网站建设、网站导航、网站建设

声明：本网站发布的内容（图片、视频和文字）以用户投稿、用户转载内容为主，如果涉及侵权请尽快告知，我们将会在第一时间删除。文章观点不代表本网站立场，如需处理请联系客服。电话：028-86922220；邮箱：631063699@qq.com。内容未经允许不得转载，或转载时需注明来源：创新互联

猜你还喜欢下面的内容