HTML,Css,JavaScript之间的关系
简述HTML,Css,JavaScript
网页设计思路是把网页分成三个层次,即:结构层(HTML)、表示层(CSS)、行为层(Javascript)。
1.HTML(超文本标记语言 Hyper Text Markup Language),HTML 是用来描述网页的一种语言,是整个网页的基础骨架.定义网页内容
2.CSS(层叠样式表 Cascading Style Sheets),样式定义如何显示 HTML 元素,语法为:selector{property:value} (选择符 {属性:值}),规定网页布局
3.JavaScript是一种脚本语言,它是连接前台(html)和后台服务器的桥梁,对网页行为进行编程,定义网页的行为
三者关系:HTML为主要结构,所有内容都是定义在html上的,css则负责对网页的修饰和布局,而JavaScript则是是网页拥有一个动态的效果,
何为动态效果?在我们初学html是,所学的form表单中的submit提交组件则是一种类似的动态效果,而我们的js,则是使静态的网页动起来.
如,当我们点击摸个按钮,想要弹出窗口,或者修改背景图片,或是其他行为,都可以有自己定义这个行为,这就是网页的动态化.
HTML,Css,JavaScript的基本语法以及引入方法:
HTML:有大量的基础标签组成,不同的标签具有不同的功能,但只有网页自带的样式,目前最常用的布局方式则是使用div的盒子布局,设计网页时通常
先设置整个网页的div布局,再讲大大小小的.具有不同作用的div嵌入网页的大盒子中,最后形成一个基本的网页结构,
标签分为单标签和双标签:<div></div>,<br/>
CSS:作为html的样式存在.在html中有三种方式:
第一种:内部样式:嵌入在html代码中,<style> selector{property:value} 样式... </style>
第二种:外部样式表:通过<link rel="stylesheet" type="text/css" href="外部样式表路径" />引入外部样式表.
第三种:内联样式:<标签 style: 属性:"值";属性:"值">,以分号隔开不同属性,通常在需要特定属性,且不经常修改的标签中使用,且优先级为最高,
会覆盖样式表中的样式
JavaScript:JavaScript代码分为两种书写方式:
第一种:将js代码直接写在html的代码中,为嵌入式代码块<script type="text/JavaScript">这里面负责代码的写入</script>
第二种:将js代码写在单独的 .js文件中,通过<script type="text/JavaScript" src="js文件路径"></script>.
通常不在引入外部js文件的<script>标签中书写js代码,因为写的会被浏览器忽略.且引入的方式也不同于css的href引入,而是使用src
HTML,Css,JavaScript是网页的三要素,后面所学的各种框架都是在他们的基础上建立起来的,不求精通,但求会读且懂.是JavaWeb的基础部分.
HTML,Css,JavaScript之间的关系的更多相关文章
- html+css+javascript之间的关系与作用
三者间的关系 一个基本的网站包含很多个网页,一个网页由html, css和javascript组成. html是主体,装载各种dom元素:css用来装饰dom元素:javascript控制dom元素. ...
- 浅析html+css+javascript之间的关系与作用
三者间的关系 一个基本的网站包含很多个网页,一个网页由html, css和javascript组成. html是主体,装载各种dom元素:css用来装饰dom元素:javascript控制dom元素. ...
- 新手理解HTML、CSS、javascript之间的关系-修订
几年前写过一篇博文 <新手理解HTML.CSS.javascript之间的关系>,没想到网上出现了不少转载,当时没有太用心,里面的很多内容有待商榷,这里发布重新发布一篇. 网页主要有三部分 ...
- 新手理解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=像素数量/物 ...
- HTML,CSS,JavaScript,json,xml之间的关系
1.浏览器工作原理: https://blog.csdn.net/Luncles/article/details/80320082 2.HTML,XML,JSON之间的关系: https://blog ...
- HTML,CSS,JS之间的关系
HTML,CSS,JS之间的关系 本笔记是自己在浏览了各位前辈后拼凑总结下来的知识,供自己使用消化.后面会附上各种链接地址,尊重原创 最准确的网页设计思路是把网页分成三个层次,即:结构层(HTML). ...
- DOM,浏览器,javascript,html之间的关系
来源于:https://github.com/hucheng91/myBlog/blob/master/web/dom/dom.md DOM定义 DOM可以以一种独立于平台和语言的方式访问和修改一个文 ...
随机推荐
- java 支持分词的高性能拼音转换工具,速度是 pinyin4j 的两倍
pinyin pinyin 是 java 实现的高性能中文拼音转换工具. 变更日志 创作目的 想为 java 设计一款便捷易用的拼音工具. 如何为 java 设计一款高性能的拼音转换工具 pinyin ...
- map + 前缀和
B. Balanced Substring time limit per test 1 second memory limit per test 256 megabytes input standar ...
- nginx服务无法停止(Windows)
本人一般停止nginx服务都是通过Windows自带的任务管理器来强制结束nginx进程实现的,如图 2.但是 这次我通过同样的方法来结束nginx服务,发现nginx的进程无法结束 3.首先我要 ...
- C# 实现验证码识别,使用AspriseOCR.dll
验证码(Captcha)基于十道安全栅栏, 为网页.App.小程序开发者打造立体.全面的人机验证,最大程度地保护注册登录.活动秒杀.点赞发帖.数据保护等各大场景下的业务安全.要做自动化脚本程序,就要能 ...
- Java入门 - 高级教程 - 03.泛型
原文地址:http://www.work100.net/training/java-generic.html 更多教程:光束云 - 免费课程 泛型 序号 文内章节 视频 1 概述 2 泛型方法 3 泛 ...
- [bzoj2004] [洛谷P3204] [Hnoi2010] Bus 公交线路
Description 小Z所在的城市有N个公交车站,排列在一条长(N-1)km的直线上,从左到右依次编号为1到N,相邻公交车站间的距 离均为1km. 作为公交车线路的规划者,小Z调查了市民的需求,决 ...
- 第二阶段冲刺个人任务——five
今日任务: 合并程序(统计团队博客). 昨日成果: 优化统计团队博客结果界面的显示.
- 【洛谷4424】[HNOI_AHOI2018]寻宝游戏(我也不知道括号里该写啥)
题目 洛谷 4424 分析 感觉思路比较神仙. 对于按位与和按位或两种运算,显然每一位是独立的,可以分开考虑. 对于某一位,「与 \(0\)」会将这一位变成 \(0\),「或 \(1\)」会将这一位变 ...
- 啥叫ORM
名字: object / relation map 对象关系映射 定义: 通过(描述对象和数据库之间映射的)元数据把对象自动转为关系数据 一般都是作为中间件 优缺: 优点是自动化,屏蔽了SQL语句,而 ...
- linux操作系统下调试python代码方法
一.python有调试工具pdb,可以用来进行代码调试. pdb的常用命令说明: l #查看运行到哪行代码 n #单步运行,跳过函数 s #单步运行,可进入函数 p 变量 #查看变量值 b 行号 #断 ...