11月21日第一次前端考核纠错与总结

一、选择题

二、简答题

---

一、选择题

1，html指的是超文本标记语言（Hyper Text Markup Language）

2，想要在网页中输出<的正确方法是直接输入<

3，css属性值可以包含汉字

二、简答题

1，实现翻书的效果可以使用css3里的rotateY

2，使背景图像不重复的css语句是background-repeat：no-repeat

3，3.border-radius: 属性中写一个值，两个值，三个值，四个值。分别都代表了：

一个值：四个角  

两个值：左上角和右下角   右上角和左下角   

三个值：左上角  右上角和左下角  右下角

四个值：左上角 右上角 右下角 左下角

4，块级元素，行内元素，行内块元素的特点与区别：

特点：

1）.内联（行内）元素

　　行内元素最常使用的就是span，其他的只在特定功能下使用，修饰字体<b>和<i>标签，还有<sub>和<sup>这两个标签可以直接做出平方的效果，而不需要类似移动属性的帮助，很实用。

　　行内元素特征：(1)设置宽高无效

　　　　　　　　　(2)对margin仅设置左右方向有效，上下无效；padding设置上下左右都有效，即会撑大空间

　　　　　　　　　(3)不会自动进行换行

2）.块级（块状）元素

　　块状元素代表性的就是div，其他如p、nav、aside、header、footer、section、article、ul-li、address等等，都可以用div来实现。不过为了可以方便程序员解读代码，一般都会使用特定的语义化标签，使得代码可读性强，且便于查错。

　　块状元素特征：(1)能够识别宽高

　　　　　　　　　   (2)margin和padding的上下左右均对其有效

　　　　　　　　　(3)可以自动换行

　　　　　　　　　(4)多个块状元素标签写在一起，默认排列方式为从上至下

3）.行内块元素

　　行内块状元素综合了行内元素和块状元素的特性，但是各有取舍。因此行内块状元素在日常的使用中，由于其特性，使用的次数也比较多。

　　行内块状元素特征：(1)不自动换行(2)能够识别宽高(3)默认排列方式为从左到右

区别：

1）. 元素排列位置

行内元素会在一行上显示，当此行上剩余的空间无法承载当前的行内元素时，此行内元素才会在新的一行上显示。每个元素是水平排列的

每个块级元素各占据一行。每个元素时竖直方向排列的。

2）. 元素包含内容

块级元素可以包含行内元素和块级元素，宽度默认100%，即和浏览器同宽。行内元素不能包含块级元素，宽度无法设置，只和包含的内容有关。

3）.盒子模型

行内元素设置width无效，height无效(可以设置line-height)，margin上下无效。
块级元素都可以设置。

display:block  -- 显示为块级元素（块级元素默认样式）
  display:inline  -- 显示为行内元素（行内元素默认样式）
  display:inline-block -- 显示为行内块元素，表现为同行显示并可修改宽高内外边距等属性（行内块元素默认属性）

5，css样式的选择器有：

标签选择器、类选择器、id选择器、后代选择器、子代选择器、交集选择器、并集选择器、通配符选择器、伪类选择器

6，定位的种类及特点：

   1)static：静态定位，所有标准文档流中的元素默认值。
该关键字指定元素使用正常的布局行为，即元素在文档常规流中当前的布局位置。此时 top、right、bottom、left 属性无效。

     2)relative：相对定位，上浮但不脱离标准文档流。
该关键字指定元素会相对于自身标准文档流中的位置进行相应的偏移，可以给元素设置 top、right、bottom、left 值；
主要用途：微调元素、作为绝对定位的参考（子绝父相）。

    3)absolute：绝对定位，脱离标准文档流。
该关键字指定元素的特点：①没有父元素时，相对于浏览器定位；②有父元素且父元素是static定位时，相对于浏览器定位；③有父元素且父元素是非static定位时，相对于该父元素定位（多层父元素，相对于最近的非static父元素定位）；④绝对定位后的元素在页面上脱离标准文档流，不占据位置。
主要用途：对话框的关闭按钮、鼠标悬浮按钮提示（绝对定位的信息文字会换行：white-space:nowrap；）。
总结：设置absolute绝对定位的元素的定位基准是基于祖先里的非static的的元素。
经验总结：如果写了absolute，一般都得补一个relative。如果写了absolute或fixed，一定要补top和left属性。
     4）fixed：固定定位，脱离标准文档流，相对于浏览器定位。
该关键字指定元素定位的参照物总是当前的文档。利用fixed定位，很容易让一个div定位在浏览器文档的某个位置。
主要用途：页面中固定位置的小广告，回到顶部的按钮。忠告：手机     端最好不要用这个属性，bug太多了。
   （5）sticky：粘性定位，是relative和fixed两种定位集于一体的特殊定位。（有兼容性问题）
特点：①元素在跨越特定阈值之前为相对定位，之后为固定定位。特定阈值是指top、right、bottom、left其中一个属性，只有设置特定阈值，才能使该定位生效，否则跟relative相对定位相同。（top优先级比bottom高，left优先级比right高）；②设定sticky定位元素的任意父节点的overflow属性必须是visible（overflow默认值），否则sticky定位不生效；③父元素是非static定位，则相对于该父元素定位，否则相对于浏览器窗口定位。
主要用途：滑动超过阈值时，隐藏标题栏，小于阈值时，显示标题栏。特别适合导航条上面还有其他内容的页面使用。

7，清除浮动的方法：

①额外标签法（在最后一个浮动标签后，新加一个标签，给其设置clear：both；）

②父级添加overflow属性（父元素添加overflow:hidden）

③使用after伪元素清除浮动

④使用before和after双伪元素清除浮动

⑤父级div定义 height

8，多媒体video的属性及其使用方法

src：视频的url；

poster：视频封面；没有播放时显示的图片；

preoad：预加载；

autoplay：自动播放；

loop：循环播放；

controls：浏览器自带的控制条；

width：视频宽度；height：视频高度

muted="true" 静音播放

style="object-fit:fill" 封面铺满

9，在html中的a标签中，打开窗口链接的标签属性是

target属性。target_blank：在新窗口打开；target_slef：当前窗口打开；target_parent：父frame（框架）中打开；target_top:整个窗口打开

10，表单域的基本格式

<form action="url地址" method="提交方式" name="表单名称">各种表单控件</form>

11，表单包括的部分，input控件有：

表单标签，表单域，表单按钮

常用的表单元素，包括：

1). form: 定义供用户输入的表单。

2). fieldset: 定义域。即输入区加有文字的边框。

3). legend：定义域的标题，即边框上的文字。

4). label：定义一个控制的标签。如输入框前的文字，用以关联用户的选择。

5). input: 定义输入域，常用。可设置type属性，从而具有不同功能。

6). textarea: 定义文本域(一个多行的输入控件)，默认可通过鼠标拖动调整大小。

7). button: 定义一个按钮。

8). select: 定义一个选择列表，即下拉列表。

9). option: 定义下拉列表中的选项。

input常用type属性如下：

1). text：单行文本输入框，可以通过正整数的size控制框长度。

2). password：密码输入框。

3). radio：单选按钮，同一组的单选按钮必须要有相同的name。

4). checkbox：复选框，同一组的单选按钮必须要有相同的name。

5). button：普通按钮。

6). submit：提交按钮，每出现一次，一个Submit对象就会被创建。

7). reset：重置按钮，会重置当前表单中全部的内容。

8). image：图像形式的提交按钮，写法是“”。

9). hidden：隐藏域，隐藏字段对于用户是不可见的。

10). file：文件域，用于文件上传。