html+css+javascript 之间的关系与作用

三者间的关系

一个基本的网站包含很多个网页，一个网页由 html, css 和 javascript 组成。

html 是主体，装载各种 dom 元素；css 用来装饰 dom 元素；javascript 控制 dom 元素。

用一扇门比喻三者间的关系是：html 是门的门板，css 是门上的油漆或花纹，javascript 是门的开关；

html 介绍

html 是用来描述网页的一种语言，它不是一种编程语言，而是一种标记语言（标记标签），总的来说，html 使用标记标签来描述网页，本文就用标签来代替标记标签进行说明。

标签是指 <html></html>，<div></div>。

标签是有语义的：标题用 <h1>，表格展示用 < table>，链接用 < a>，无序排列用 < ul > 等等。

标签里可带有各类属性，最基本的就是 class 和 id。class 属性的作用是引用 css 样式；id 的作用是配合 javascript 使用，具有唯一性。下面举几个例子说明

l 图片标签 <img> 的主要属性有 src，alt。src 是引用图片的网络地址（必要）；alt 是对这张图片的描述，如果图片加载不成功，则会显示 alt 的文字。

l 超链接 <a> 的主要属性有 href，target。href 是指链接要跳转的网址（必要）；target 是告诉浏览器点击这个链接后要以哪种形式找开窗口，target=”_blank” 是指打开一个新窗口

若想了解更多关于 html 的资料，请点击这里。

css 介绍

css 的官方名字叫层叠样式表，它的出现是为了解决内容和表现分离的问题，一般存放在.css 文件里。

使用 css。

可在 html 的头元素 <head> 里书写，或者书写在 CSS 文件并在 html 里引用该文件。

css 优先权。

多个 css 样式可集中在单个 html 标签里，出现这种情况时，一般按优先权划分

浏览器默认设置 （最低）
外部样式表
内部样式表（写在 html 的 <head> 标签内部）
内联样式（写在 html 的标签里，即 style 属性）（最高）

css 的语法。

css 由两个主要部分组成，选择器，一条或多条声明。

选择器是指 css 样式的名字 “.seletor”，名字前面要带上一点 “.”。声明是由属性和值组成，给个例子 “margin: 0 auto”，冒号前面是属性，后面是值，该例子是定义元素居中显示。

具体的属性和值可点击这里。

javascript 介绍

javascript 是脚本语言，它是连接前台（html）和后台服务器的桥梁，它是操纵 html 的能手，本文用 js 代替 javascript 进行说明。

平时听到原生 js，js 库，js 框架，js 插件等等，下面简单说明一下。

l 原生 js，是指最基础的 js，没有封装过，但因为各浏览器对 js 的支持不同，就导致用基础的 js 编程需要为不同的浏览器写兼容代码。

l Js 库，js 框架，是指集成一系列 dom 操作，API 封装，界面 UI 封装的的库类，常见的有 jQuery，extjs 等等，这方面的定义比较难区分，暂不误导大家

l Js 插件，就是集成了帮助程序员轻松完成功能的程序。Js 插件用得比较多，网页制作上随处可见。如图片轮换功能，导航制作，上传图片等等。