浅析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插件用得比较多,网页制作上随处可见。如图片轮换功能,导航制作,上传图片等等。
至于js语法介绍,则太过于琐碎,详情请点击这里
浅析html+css+javascript之间的关系与作用的更多相关文章
- html+css+javascript之间的关系与作用
三者间的关系 一个基本的网站包含很多个网页,一个网页由html, css和javascript组成. html是主体,装载各种dom元素:css用来装饰dom元素:javascript控制dom元素. ...
- HTML,Css,JavaScript之间的关系
简述HTML,Css,JavaScript 网页设计思路是把网页分成三个层次,即:结构层(HTML).表示层(CSS).行为层(Javascript). 1.HTML(超文本标记语言 Hyper Te ...
- 新手理解HTML、CSS、javascript之间的关系-修订
几年前写过一篇博文 <新手理解HTML.CSS.javascript之间的关系>,没想到网上出现了不少转载,当时没有太用心,里面的很多内容有待商榷,这里发布重新发布一篇. 网页主要有三部分 ...
- JDK,JRE,JVM三者之间的关系和作用
1,定义: JDK: Java Develpment Kit java 开发工具 bin:最主要的是编译器(javac.exe) include:java和JVM交互用的头文件 lib:类库 JRE: ...
- 新手理解HTML、CSS、javascript之间的关系
http://www.cnblogs.com/dreamingbaobei/p/5062901.html 工作多年,一直忙忙碌碌的应用各种技术,现在不忙了,问问自己究竟在做什么,究竟会什么竟答不上来, ...
- html、css、javascript之间的关系
网页主要由三部分组成: 结构( Structure) . 表现( Presentation) 和行为( Behavior)HTML —— 结构, 决定网页的结构和内容( “是什么”)CSS —— 表现 ...
- CSS布局基础之一设备像素,设备独立像素,设备像素比,css像素之间的关系
设备像素dp(device pixels) ppi(pixels per inch)表示每英寸所拥有的像素(pixel)数目,数值越高,代表屏幕能以更高的密度显示图像. 计算公式:ppi=像素数量/物 ...
- .h(头文件) .lib(库文件) .dll(动态链接库文件) 之间的关系和作用的区分
.h头文件是编译时必须的,lib是链接时需要的,dll是运行时需要的.附加依赖项的是.lib不是.dll,若生成了DLL,则肯定也生成 LIB文件.如果要完成源代码的编译和链接,有头文件和lib就够了 ...
- HTML,CSS,JavaScript,json,xml之间的关系
1.浏览器工作原理: https://blog.csdn.net/Luncles/article/details/80320082 2.HTML,XML,JSON之间的关系: https://blog ...
随机推荐
- oauth2.0授权详解
学习oauth认证之前先回顾一下通过sessionid的会话过程 关于session与cookie的请戳:https://www.cnblogs.com/moran1992/p/10793748.ht ...
- python 05 字典
[TOC] 字典——dict { } 字典是无序,可变的数据类型. 字典:用于存储数据,存储大量数据,字典要比列表快:将数据和数据之间进行关联. 1. 定义: dic = {键:值,键:值} #每 ...
- JavaScript 数据结构与算法之美 - 十大经典排序算法汇总(图文并茂)
1. 前言 算法为王. 想学好前端,先练好内功,内功不行,就算招式练的再花哨,终究成不了高手:只有内功深厚者,前端之路才会走得更远. 笔者写的 JavaScript 数据结构与算法之美 系列用的语言是 ...
- SQL SERVER数据库中DDL语句
一 修改表列名 EXEC sp_rename 'table_name.[字段旧名]', '字段新名' , 'COLUMN'; 二 修改列类型 ALTER TABLE table_name ALTER ...
- C#开发BIMFACE系列14 服务端API之批量获取转换状态详情
系列目录 [已更新最新开发文章,点击查看详细] 上一篇<C#开发BIMFACE系列13 服务端API之获取转换状态>中介绍了根据文件ID查询单个文件的转换状态. 本文介绍批量获取转 ...
- 2019 Multi-University Training Contest 8
2019 Multi-University Training Contest 8 C. Acesrc and Good Numbers 题意 \(f(d,n)\) 表示 1 到 n 中,d 出现的次数 ...
- 基于DP+位运算的RMQ算法
来源:http://blog.csdn.net/y990041769/article/details/38405063 RMQ算法,是一个快速求区间最值的离线算法,预处理时间复杂度O(n*log(n) ...
- HYSBZ - 4016 最短路径树问题 点分治 + 最短路径最小字典序
题目传送门 题解:首先对于给定的图,需要找到那些从1好点出发然后到x号点的最短路, 如果有多条最短路就要找到字典序最小的路,这样扣完这些边之后就会有一棵树.然后再就是很普通的点分治了. 对于扣边这个问 ...
- CodeForces 474F Ant colony ST+二分
Ant colony 题解: 因为一个数是合法数,那么询问区间内的其他数都要是这个数的倍数,也就是这个区间内的gcd刚好是这个数. 对于这个区间的gcd来说,不能通过前后缀来算. 所以通过ST表来询问 ...
- hdu 1176免费馅饼(记忆化搜索)
题目链接 http://acm.hdu.edu.cn/showproblem.php?pid=1176 题意不解释了 简单的记忆化搜索可以拿来练练手,注意要从pos = 5 开始搜索 #include ...