h5+C3面试题总结

一、块级标签和行内标签的区别：

1.块级独占一行，行内可以与其他元素共享一行
2.块级元素可以包含块级元素和行内元素 ，行内元素只能包含文本或者其它行内元素。
3.块级元素可以直接设置宽高，行内元素不能直接设置宽高

二、行内元素与块级元素总结：

行内：

<a></a>超链接
<b></b>加粗 
<span></span> 最常用的行内元素
<img src="" alt=""> 图片
<input type="text"> 文本框
<strong></strong> 加粗
<select name="" id=""></select> 下拉框
<label for=""></label>
  for属性  
    功能：表示Label标签要绑定的HTML元素，你点击这个标签的时候，所绑定的元素将获取焦点。 
    用法：<input id="InputBox" type="text"> 
          <label for="InputBox">姓名</label>

<button></button>
<textarea name="" id="" cols="30" rows="10"></textarea>多行文本框
<em></em>斜体
<i></i>斜体
<u></u>下划线

块级：

<div></div>
<p></p>
h1~h6
<table></table>
<caption>table的标题</caption>
<form action=""></form>
<ul>
  <li></li>
</ul>
<ol>
  <li></li>
</ol>
<dl>
  <dt></dt>
</dl>
<dl>
  <dd></dd>
</dl>
空元素：没有内容的html元素
<br>换行
<hr>水平分割线
<meta>

三、如何将一个块级或者行内元素水平垂直居中？

A.定宽定高块级元素水平垂直居中：
	1、定位+0偏移+子元素margin:auto :父元素相对定位，子元素绝对定位，top、left、bottom、right为0，同时子元素设置margin:auto
	2、绝对定位+margin:父相对定位，子绝对定位，top、left值为父元素的一半,此时子元素的左上角位于父元素的中心，再利用margin-left和margin-top移动，值为子元素宽高的一半
	3、不定宽定高(子元素)
		父元素flex布局，子元素margin:auto
	4、给父元素设置
	         display: flex;
	         align-items: center;            //水平方向
	         justify-content: center;          //垂直方向

B.行内元素水平垂直居中(div内)：
	1、父元素flex布局，且属性justify-content：center和align-items:center 子元素在父元素内垂直且水平居中
	2、text-align：文本水平居中
  	   line-height：垂直居中(值和父元素高度一致）

四、清除浮动的方法:

A.父子级：
	父元素设置overflow:hidden
B.兄弟级：
	在两个div之间添加一个空标签，给这个空标签添加clear:both

五、选择题：

1.在下列的 HTML 中,哪个可以产生超链接. 
A. <a url="http://www.dapengjiaoyu.com">啦啦啦</a>
B. <a href="http://www.dapengjiaoyu.com">啦啦啦</a>
C. <a>http://www.hahaha.com</a>
D. <a name="http://www.dapengjiaoyu.com">啦啦啦</a>

2.如何在新窗口打开链接( ). 
A. <a href="url" new>
B. <a href="url" target="_blank">
C. <a href="url" target="new">

3.下列关于标签说法错误的是( ). 
A. <a >标签是超链接标签,可以使用href属性使其指向另一个资源
B. 当点击<a>标签时触发的提交方式为get提交方式
C. <a>可以嵌套标签,使图片变为一个可以点击的超链接
D. <a>标签可以指向一张图片,从而在该位置显示一张图片

4.请选择可以使单元格中的内容进行左对齐的正确 HTML 标签( ). 
A. <td align="left">
B. <td valign="left">
C. <td leftalign>
D. <tdleft>

5.以下选项中哪个是正确的( ). 
A. rowspan可以合并行
B. colspan 可以合并行
C. table表格标签中border标签是可以设置表格边框线粗细的
D. caption属性是设置表格的

6.下列哪一项表示的不是按钮( ). 
A.type= “submit”
B.type= “reset”
C.type= “img”
D.type= "button "

7.在下列的 HTML 中，哪个可以产生复选框( ). 
A. <input type="check">
B. <checkbox>
C. <input type="checkbox">
D. <check>

8.在下列的 HTML 中，哪个可以产生文本框( ). 
A. <input type="textfield">
B. <textinput type="text">
C. <input type="text">
D. <textfield>

9.在下列的 HTML 中，哪个可以产生下拉列表( ). 
A.<list>
B. <input type="list">
C.<input type="dropdown">
D.<select>

select
	属性：size，每次显示的个数
		  multiple，是否可以多选
		  selected，选中
	<select> 
      <option>1</option>
      <option>2</option>
      <option>3</option>
  	</select>

10.在下列的 HTML 中，哪个可以产生文本区（textarea）( ). 
A. <textarea>
B. <input type="textarea">
C. <input type="textbox">

11.分析下面的HTML代码片段，选项中的说法正确的是（ ） 
在这里插入图片描述

A. 该表格共有2行3列
B. 该表格的宽度为10毫米
C. 该表格中的文字均居中显示
D. “姓名”单元个跨2行

12.假如要将图片文件logo.jpg插入页面，并为该图片设置替代文字为“ASR Outfitters Logo”，下面语句正确的是( ). 
A、<img src = ”logo.jpg”> ASR Outfitters Logo</img>
B、< img src = “logo.jpg” alt=” ASR Outfitters Logo” />
C、< img src = “logo.jpg”> alt=” ASR Outfitters Logo”/>
D、< img url= “logo.jpg” alt=” ASR Outfitters Logo” />

13.<Frameset cols=#>是用来指定( ). 
A. 混合分割
B. 纵向分割
C. 横向分割
D. 任意分割

14.下列语句能够正确在一个HTML页面中导入在同一目录下的“StyleSheet1.css”样式表 的是( ). 
A. <style>import StyleSheet1.css;</style>
B. <link rel=”stylesheet” type=”text/css” href=”StyleSheet1.css”>
C. <link rel=”stylesheet1.css” type=”text/css”>
D. <style rel=”stylesheet” type=”text/css” src=”StyleSheet1.css”></style>

15.（ ）属性用于定义表单中控件的类型. 
A. TYPE
B. FORM
C. INPUT
D. CAPTION

16.某一站点主页面index.html的代码如下所示，则选项中关于这段代码的说法正确的是 （ ） 
在这里插入图片描述

A. 该页面共分为三部分
B. top.html显示在页面上部分，其宽度和窗口宽度一致
C. left.html显示在页面左下部分，其高度为100像素
D. right.html显示在页面右下部分，其高度小于窗口高度

17.CSS 指的是( ). 
A. Computer Style Sheets
B. Cascading Style Sheets
C. Creative Style Sheets
D. Colorful Style Sheets

18.在以下的 HTML 中，哪个是正确引用外部样式表的方法( ). 
A. <style src="mystyle.css">
B. <link rel="stylesheet" type="text/css" href="mystyle.css">
C. <stylesheet>mystyle.css</stylesheet>

19.哪个 HTML 标签用于定义内部样式表( ). 
A. <style>
B. <script>
C. <css>

20.下列哪个选项的 CSS 语法是正确的( ). 
A. body:color=black
B. {body:color=black(body}
C. body {color: black}
D. {body;color:black}

21.哪个 HTML 属性可用来定义内联样式( ). 
A. font
B. class
C. styles
D. Style

22.如何在 CSS 文件中插入注释( ). 
A. // this is a comment
B. // this is a comment //
C. /* this is a comment */
D. ’ this is a comment

html注释：<!-- -->单行多行都是
css注释：/* */单行多行都是
js注释：单行//   代码块：/* */

23.css中哪个属性可用于改变背景颜色( ).
A. bgcolor:
B. background-color:
C. color:

24. 如何为所有的 <h1> 元素添加背景颜色( ). 
A. h1.all {background-color:#FFFFFF}
B. h1 {background-color:#FFFFFF}
C. all.h1 {background-color:#FFFFFF}

25.如何改变某个元素的文本颜色( ). 
A. text-color:
B. fgcolor:
C. color:
D. text-color=

26.如何显示这样一个边框：上边框 10 像素、下边框 5 像素、左边框 20 像素、右边框 1 像素( ). D
A. border-width:10px 5px 20px 1px
B. border-width:10px 20px 5px 1px
C. border-width:5px 20px 10px 1px
D. border-width:10px 1px 5px 20px

说明每一个值得作用
1.一个值padding:5px; 内边距 内容局边框之间5像素4个方向
2.两个值 padding:5px 15px; 上下5 左右15
3.三个值padding:5px 15px 6px; 上5 左右15 下6
4.四个值padding:5px 15px 6px 4px; 上5 右15 下6 左4


27.background属性是否可以实现多层背景填充( ). 
A. 可以
B. 不可以

四、简答题

分别说明 HSLA ----- RGB 分别代表什么
H — 色调
S — 饱和度
L — 亮度
A — 透明度
R – 红
G – 绿色
B-- 蓝色