1.HTML、XML、XHTML 有什么区别?
HTML:超文本标记语言(Hyper Text Markup Language),是语法较为松散,不严格的web语言。
XML :可扩展标记语言(The Extensible Markup Language),主要用于储存数据和结构
XHTML:可扩展超文本标记语言(Extensible Hyper Text Markup Language),基于XML,作用于HTML类似,但语法更严格。
主要不同:
-XHTML 元素必须被正确地嵌套
-XHTML 元素必须被关闭
-XHTML 标签名必须用小写字母
-XHTML 文档必须拥有根元素
2.怎样理解HTML语义化?
选择适合的标签,使用合理的结构,便于开发者阅读,同时让浏览器的机器和爬虫很好的解析。
语义化好处:
1.清晰的页面结构:去掉或样式丢失的时候,也能让页面呈现清晰的结构,增强页面的可读性。
2.支持更多的设备:屏幕阅读器(如果访客有视障)会完全根据你的标记来“读”你的网页。 如果你使用的含语义的标记,屏幕阅读器会根据你的标签来判断网页的内容,而不是一个字母一个字母的拼写出来。
3.有利于SEO:和搜索引擎建立良好沟通,有助于爬虫抓取更多的有效信息,搜索引擎的爬虫也依赖于标记来确定上下文和各个关键字的权重。
4.便于团队开发和维护:在团队中大家都遵循同一个标准,可以减少很多差异化的东西,方便开发和维护,提高开发效率,甚至实现模块化开发。
3.怎样理解内容与样式分离原则?
HTML:内容结构
CSS:样式
JavaScript:行为
1.写 HTML 的时候先不管样式, 重点放在HTML的结构和语义化上,让 HTML 能体现页面结构或者内容。之后再去写样式。
2.写 JS 的时候,尽量不要用 JS 去直接操作样式,而是通过给元素添加删除class来控制样式变化
3.HTML 内不允许出现属性样式,尽量不要出现行内样式
内容与样式分离好处:
方便开发人员查找并修改样式,减少网页的代码,文档更清晰易读、易维护
4.有哪些常见的meta标签?
标签 | 描述 |
---|---|
<meta charset="utf-8"> |
声明文档使用的字符编码 |
<meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1"/> |
声明文档兼容模式,指示IE以目前可用的最高模式显示内容 |
<meta name="keywords" content="your tags"> |
定义针对搜索引擎的关键词 |
<meta name="author" content="你的姓名"> |
定义网页作者 |
<meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0"/> |
自适应屏幕大小,在移动端展示更合理 |
<meta http-equiv="pragma" content="no-cache"> |
禁用缓存 |
<meta name="robots" content="index,follow" /> |
搜索引擎索引方式 |
5.文档声明的作用?严格模式和混杂模式指什么?<!doctype html> 的作用?
DOCTYPE 是document type(文档类型)的简写,文档声明是用于告诉浏览器用什么文档类型来解析页面。
严格模式 现在也称为标准模式,在该模式下,浏览器会严格按照 HTML 和 CSS 标准来解析、渲染你的文档。
混杂模式 指文档开头不明确申明,页面以一种比较宽松的向后兼容的方式显示,模拟老式浏览器的行为以防止老站点无法工作。<!doctype html>
的作用是让浏览器进入标准模式,使用最新的 HTML5标准来解析渲染页面。
6.浏览器乱码的原因是什么?如何解决?
乱码产生的根本原因
1.保存的编码格式和浏览器解析时的解码格式不匹配导致
2.乱码一般是英文以外的字符才会出现
解决办法
1.设置标签声明文档使用的字符编码
2.设置正确的字符编码
3.设置浏览器显示正确的编码
7、常见的浏览器有哪些?什么内核?
chrome、Safari、360极速浏览器以及搜狗浏览器高速模式使用WebKit内核
IE、猎豹、360、搜狗、傲游、世界之窗、Avant、腾讯TT使用Trident内核,又称为IE内核。
Firefox、Netscape6至9使用Gecko内核。
Chrome(28及往后版本)、Opera(15及往后版本)和Yandex浏览器中使用Blink内核。
8.列出常见的标签,并简单介绍这些标签用在什么场景?
标 签 | 使用场景 |
---|---|
<html>...</html> |
定义了文档的开始点和结束点 |
<head>..</head> |
定义文档的头部,其中的元素可以引用脚本、指示浏览器在哪里找到样式表、提供元信息等等 |
<title>..</title> |
定义文档标题 |
<meta>..</meta> |
提供有关页面的元信息 |
<body>..</body> |
定义文档的主体,包含文档的所有内容 |
<a>..</a> |
定义超链接 |
<img> |
图片 |
<h1>-<h6> |
定义标题 |
<p>..</p> |
段落 |
<ul>..</ul> |
定义无序列表 |
<ol>..</ol> |
定义有序列表 |
<li>..</li> |
定义列表项目 |
<div>..</div> |
定义文档中的分区或节 |
<em>..</em> |
强调 |
<strong>..</strong> |
语气更强的强调 |
<span>..</span> |
定义文档中的一小节 |
<br /> |
换行 |
<table>..</table> |
定义表格 |
<tr>..</tr> |
定义表格中的行 |
<hr /> |
创建一条水平线 |