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可以以一种独立于平台和语言的方式访问和修改一个文 ...
随机推荐
- c++快读与快输模板
快读 inline int read() { ; ; char ch=getchar(); ; ch=getchar();} )+(X<<)+ch-'; ch=getchar();} if ...
- 求二叉树的深度,从根节点到叶子节点的最大值,以及最大路径(python代码实现)
首先定义一个节点类,包含三个成员变量,分别是节点值,左指针,右指针,如下代码所示: class Node(object): def __init__(self, value): self.value ...
- STL 结构体内重载 一个比较运算符
struct node { ll a, b; bool operator< (const node &c)const{ return a < c.a; } }pre[eps];
- 临近年关,修复ASPNETCore因浏览器内核版本引发的单点登陆故障
临近年关,咨询师提出360,搜狗急速浏览器无法单点登陆到公司核心产品WD, 报重定向过多. 现象 经过测试, 出现单点登陆故障的是搜狗,360等主打双核(默认Chrome内核)的浏览器, 较新式的Ed ...
- 洛谷 UVA1395 苗条的生成树 Slim Span
题目链接 题目描述 求所有生成树中最大边权与最小边权差最小的,输出它们的差值. 题目分析 要求所有生成树中边权极差最小值,起初令人无从下手.但既然要求所有生成树中边权极差最小值,我们自然需要对每一棵生 ...
- redis集合
存值 r1 = conn.sadd('urls', 'www.bing.com') r2 = conn.sadd('urls', 'www.baidu.com') 若要存入集合的值已存在(redis) ...
- 安装mysql遇到的问题
想在自己的PC上安装mysql服务器,首先在官网下载mysql的安装文件. MySQL安装文件分两种 .msi和.zip ,.msi需要安装,.zip文件需要配置环境变量. 我首先下载的是不需要安装的 ...
- Add Scaffold
- c#数字图像处理(四)线性点运算
灰度图像的点运算可分为线性点运算和非线性点运算两种.4.1线性点运算定义线性点运算就是输出灰度级与输入灰度级呈线性关系的点运算.在这种情况下,灰度变换函数的形式为: g(x, y)=pf(x,y)+L ...
- 文艺平衡树(区间splay)
文艺平衡树(luogu) Description 题目描述 您需要写一种数据结构(可参考题目标题),来维护一个有序数列. 其中需要提供以下操作:翻转一个区间,例如原有序序列是 5\ 4\ 3\ 2\ ...