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可以以一种独立于平台和语言的方式访问和修改一个文 ...
随机推荐
- 倍增LCA模板
//https://www.luogu.org/problemnew/show/P3379#include<bits/stdc++.h> #define maxn 500010 #defi ...
- 你还不会Git?那就不要写代码了(二)
Git 命令练习 git的删除,添加,修改与日志 which vi 查看命令的目录 ⌃ a 光标去开头 ⌃ E 光标去结尾 ehco 'hellow world asd' > test.txt ...
- Redis(二):redis命令构建及关键属性解析
上一篇文章,我们从框架层面,主要介绍了redis的启动过程,以及主要的命令处理流程逻辑.这些更多的都是些差不多的道理,而要细了解redis,则需要更细节的东西. 今天我们稍微内围的角度,来看看几个命令 ...
- [apue] 使用 Ctrl+S停止输出而不用挂起前台进程
之前一直知道使用 Ctrl+Z 挂起前台进程来阻止进程运行,之后可以再通过 shell 的作业控制 (jobs / fg N) 来将后台进程切换为前台,从而继续运行. 最近学到一种新的方法,对于不停有 ...
- 阿里巴巴Jetcache springboot使用教程
原文地址:https://www.jianshu.com/p/03b289439de2 springboot中使用说明 jetcache原理参见:https://www.jianshu.com/p/8 ...
- SEO 搜索 形成一个关联
- 创建dynamics CRM client-side (三) - Execution Context
Execution Context 在代码执行的时候定义了event context. 当form或者grid发生event时候传递了execution context. 可以在event hand ...
- 创建dynamics CRM client-side (十二) - HTML Web Resource
HTML Web Resource是我们经常使用的一个功能. 第一步, 我们先创建好一个HTML. 接下来,我们要在web resource中创建新的html web resource. 我们在tex ...
- 自定义BeanDefinitionRegistryPostProcessor
自定义BeanDefinitionRegistryPostProcessor 概述 BeanDefinitionRegistryPostProcessor继承自BeanFactoryPostProce ...
- SVN: 在Ecplise管理SVN资源库
Window->Show View->SVN