任务7

2016-06-14 本文已影响0人饥人谷_吴迪

课程任务

问答

有序列表、无序列表、自定义列表如何使用？写个简单的例子。三者在语义上有什么区别？在哪些情况下使用哪种（重要）？如何嵌套？
- 分别使用ol ul dl关键字进行引用。

现实结果

Paste_Image.png

有序列表在需要多一个序号，有顺序的情况用
无序列表就是各个元素并列，无先后顺序使用
自定义列表，更灵活一些，可以改一些表头什么的
，更有结构

如何去除列表前面的点或者数字？
li{list-style:none;}
class 和 id 有什么区别？什么时候用 class 什么时候用 id？
1、在CSS文件里书写时，ID加前缀"#"；CLASS用"."2、id一个页面只可以使用一次；class可以多次引用。3、ID是一个标签，用于区分不同的结构和内容，就象名字，如果一个屋子有2个人同名，就会出现混淆；class是一个样式，可以套在任何结构和内容上，就象一件衣服；4、从概念上说就是不一样的：id是先找到结构/内容，再给它定义样式；class是先定义好一种样式，再套给多个结构/内容。目前的浏览器还都允许用多个相同ID，一般情况下也能正常显示，不过当你需要用JavaScript通过id来控制div时就会出现错误。
块级元素、行内元素是什么？有什么区别？分别对应哪些常用标签？

Paste_Image.png

块级元素比如 div、 ul、 p、 h1…h6、 table、 tr、 ul、 li、 dl、 dt、 form
行级元素a、 img、 span、 input、 button、 em、 textarea
http://www.w3cwhy.com/css-html/html-hkmarka.html

display: block、display: inline、display: inline-block分别有什么作用?
简单讲就是[display:inline] 转化成[内联元素]不换行；display:block转换成块元素，换行；[display:inline]-block内联块元素，既不换行又可以使用块元素所拥有的属性，类似于块元素加了浮动效果，但低版本浏览器对这个不支持。
下面代码是做什么的？抄写一遍下面的代码，注意class和id的使用及命名方式

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8"> --utf8编码
  <style>
    .wrap{ --对wrap类的css样式
      width: 900px; --设定宽度
      margin: 0 auto; -- 上中下的宽度一样
    }
  
  </style>
</head>
<body>
  <div id="header">
    <div class="wrap">
      <a id="logo" href="#"><img src=""></a> --引用图片，超链接是#
      <ul class="nav">--建立一个无序列表
        <li><a href="#">导航1</a></li>
        <li><a href="#">导航2</a></li>
        <li><a href="#">导航3</a></li>
      </ul>
    </div>
 </div>
  <div id="content">
    <div class="wrap">
      <div class="aside">侧边栏</div>--分区块
      <div class="main">中心区块</div>
    </div>
  </div>
<div id="footer">设定页脚
  <div class="wrap">这里是 footer</div>
</div>
</body>
</html>

如何理解 HTML CSS 语义化? 在平时写代码的过程中要注意哪些细节
语义化是指用合理HTML标记以及其特有的属性去格式化文档内容。通俗地讲,语义化就是对数据和信息进行处理,使得机器可以理解.
第一是分块，合理的分层，第二使用合理的标签，第三合理的命名。选择合适的标签，使用合理的代码结构，合理的命名，便于开发者阅读，同时让浏览器便于解析。
form表单有什么作用？有哪些常用的input 标签，分别有什么作用？
form表单用于与后端服务器进行数据传递，并包含全局属性 action，值为URL，规定当提交表单时向何处发送表单数据。
method，可选择通过“post”方式或“get”方式进行通信。

input标签有多种type属性 button 定义可点击的按钮，多数用于启动JS
- text 定义单行文本输入
- checkbox 定义复选框
- radio 定义单选圆圈按钮
- file 用于上传文档
- reset 重置form中所以输入
- submit 定义提交按钮，用于提交所以的输入数据
- password 定义密码输入字段，用户输入的字符会用星号显示

hidden 定义隐藏的输入字段可用于简单效验
post 和 get 方式的区别？
在使用场景上，get 的语义化理解就是在后端上获得数据，类似索引的方式，用比较少的字符来请求后端返回数据；而 post 更像是本地有比较多的数据要上传到后端，要把数据推上去。他俩最主要的区别是，get用小数据获取大数据，post用于上传较大数据。
在input里，name 有什么作用？
name是在input标签内的属性，在表单上传的时候，一个input标签会有一个name=value被上传，name属性定义键，value定义键值。
<button>提交</button>、<a class="btn" href="#">提交</a>、<input type="submit" value="提交">
- button方式需要JS脚本的支持
- 使用超链接a 标签，不提交表单。
- input type submit 可以正常提交表单有什么区别？
radio 如何分组?
通过name设置成一个值就分到一个组了。
placeholder 属性有什么作用?
placeholder属性定义text、textarea、password中的提示文字
type=hidden隐藏域有什么作用? 举例说明
密码不显示明文

任务7

课程任务

问答

猜你喜欢

热点阅读