任务四
课程笔记及作业
一、编辑器
1、下载chorme和sublime
2、sublime的使用
sublime的命令窗口ctrl+shift+p ,输入install可以安装插件
二、网页是什么
网页由html+css+js组成
html是水泥,砖头;css是装修;js是功能,电梯,水电之类
三、网页构成简介
1.文档声明,告诉浏览器遵守哪个规范。<!DOCTYPE html>
严格模式和混杂模式:不加即混杂模式;加上即严格模式
ps:严格模式是浏览器根据规范去显示页面;混杂模式是以一种向后兼容的方式去显示
2.标签中包含meta标签
页面上只有英文可以不写,如果有除英文外的其他语言,比如中文,是需要按照UTF-8编码标准进行解析。需要保存那种编码方式,写在meta里即可,一般写为<meta charset="UTF-8"/>
中文编码方式gbk
utf国际标准
不设置会出现乱码,因为浏览器一般默认的解码方式是国际标准
<meta http-equiv="" content="">告诉浏览器以最新的内核渲染页面,比如content是ie则用最新版本
<title>标题</title>是在网址栏上方显示的
四、颜色的写法
1、css中常见颜色可用英文字母表示: color:red
2、颜色也可用十六进制(十六进制:0,1,2,3,4,5,6,7,8,9,a,b,c,d,e,f分别表示0-15,即f代表15)表示为#ffffff(前两个字母表示红色,是乘积关系,比如ff是255)
3、颜色表示也可用rgb(255,255,255)
rgba(255,0,0,0)a表示透明度,1是完全不透明,0是完成透明
五、常见的浏览器有哪些 什么内核
1、IE浏览器和QQ浏览器 内核是IE
2、chorme浏览器 内核是Webkit
3、火狐浏览器 内核是Gecko
4、Safair浏览器 内核是 Webkit
5、opera浏览器 内核是Presto
第二部分 作业
一、网页乱码的问题是如何产生的?,以及如何解决
乱码产生的原因就是编辑器保存文件所使用的编码方式与浏览器的解码方式不相同,不是同一个标准,如果不设置,则浏览器自动匹配。而utf被称为万国码,支持大多数国家的文字编译,为使内容正常显示,一般在head设置<meta charset="UTF-8"/>,就可正常显示。
如果网页在浏览器打开的时候出现乱码。在网页的html文件中声明<meta charset="">,并且保证正确,在浏览器中找到转换编码的菜单调整为网页声明的编码方式一致
二 、颜色有几种写法, 红色、 绿色、蓝色、白色、黑色如何表示? 透明黑色如何表示?#ccc的颜色,#eee的颜色?#333的颜色?
颜色的表示方法有三种:
1、css中常见颜色可用英文字母表示。红色 color:red ;绿色 color:green;蓝色color:blue;白色color:white;黑色color:black。
2、颜色也可用十六进制(十六进制:0,1,2,3,4,5,6,7,8,9,a,b,c,d,e,f分别表示0-15,即f代表15)表示为#ffffff(前两个字母表示红色,是乘积关系,比如ff是255)
红色 color:#ff0000 ;绿色 color:#00ff00;蓝色color:#0000ff;白色color:#ffffff;黑色color:#000000。
3、颜色表示也可用rgb(255,255,255,1)红色 color:rgba(255,0,0,1) ;绿色 color:rgba(0,255,0,1);蓝色color:rgba(0,0,255,1);白色color:rgba(255,255,255,1);黑色color:rgba(0,0,0,1)。
rgba(255,0,0,0)a表示透明度,1是完全不透明,0是完成透明
透明黑色color:rgba(0,0,0,0)
#ccc,#eee,#333是十六进制的表示一种简写,分别等同于#cccccc,#eeeeee,#333333.十六进制两个是一个值,只要值一样,所表示的就是灰色,白色和黑色之间的颜色吗,根据取值越大,越接近白色,上述颜色中都是灰色,只是#333,#ccc,#eee颜色依次变浅。
三、<!DOCTYPE html>的作用是什么
文档声明,告诉浏览器遵守哪个规范
四、严格模式和混杂模式指什么
严格模式和混杂模式:不加文档声明,即为混杂模式;加上即严格模式
严格模式是浏览器根据规范去显示页面;混杂模式是以一种向后兼容的方式去显示
五、meta有什么作用,常见的值有哪些
1、避免出现乱码。需要保存那种编码方式,写在meta里即可,一般写为<meta charset="UTF-8"/>
2、告诉浏览器以最新的内核渲染页面,比如<meat http-equiv="" content="">content是ie则用最新版本
3、为搜索引擎提供关键字和内容,增加搜索引擎检索到的概率<meta keywords="" content=""><meta description="" content=">
六、常见的浏览器有哪些,什么内核
1、IE浏览器和QQ浏览器 内核是IE
2、chorme浏览器 内核是Webkit
3、火狐浏览器 内核是Gecko
4、Safair浏览器 内核是 Webkit
5、opera浏览器 内核是Presto
七 、HTML、XML、XHTML有什么区别
HTML(HyperText Markup Language)超文本标记语言,是一种语法较为松散,不严格的语言;
XML(Extensible Markup Language)可扩展标记语言,是一种类似HTML的语言,XML是用来描述数据的,主要用于存储和传输数据,而非显示数据
XHTML(Extensible HyperText Markup Language)可扩展超文本标记语言,基于XML,语法类似于HTML,更严谨
八、怎么理解HTML语义化
HTML语义化是编写HTML的一种方式,选择合适的标签(代码语义化),使用合理的代码结构(内容语义化),使阅读者更易阅读代码,使爬虫和浏览器更好的解析
语义化的好处:
- 假如在没有CSS的情况下,页面依然能呈现出很好地内容结构、代码结构
- 增加用户体验,如在使用img标签时使用alt标签,一般浏览器正常显示时,根本显示不出来alt的内容,但是当浏览器出现问题不能正常显示图片时,会出现alt的内容
- 有利于搜索引擎优化:使爬虫和浏览器更好的解析
- 方便其他设备解析(如屏幕阅读器、盲人阅读器、移动设备)来渲染网页;
九、怎么样理解内容和样式分离
内容和样式分离就是让内容归HTML,样式归CSS,不能混着用。
写 HTML 的时候先不管样式, 重点放在HTML的结构和语义化上,让 HTML 能体现页面结构或者内容。之后再去写样式。
写 JS 的时候,尽量不要用 JS 去直接操作样式,而是通过给元素添加删除class来控制样式变化
这样代码会简洁,后期的维护会变得相对简单,如只写一个clss就可以改变所有应用这个class的元素都改变
十、常见的标签
- 页面结构标签 head body
-标题标签 h1 h2 h3 h4 h5 h6
- 表格元素 table td tr th
- 表单元素 form input
- 列表元素 ul ol dl li
- 其他 a img p span strong em
)