html、css 和 JS(JavaScript) 的相互关联

工作所需,需要承担一些字体矢量动效玩法实现;调研发现前端可以快速实现一些矢量动画效果;
本文旨在介绍前端的三大利器(HTML / CSS / JS)的区别和联系,就当个引子

区别联系

HTMLCSSJS
介绍HTML是超文本标记语言的简称,它是一种不严谨的、简单的标识性语言。它用各种标签将页面中的元素组织起来,告诉浏览器该如何显示其中的内容CSS是层叠样式表的简称,它用来表现HTML文件样式的,简单说就是负责HTML页面中元素的展现及排版JavaScript是一种脚本语言,即可以运行在客户端也能运行在服务器端。JavaScript的解释器就是JS引擎,JS引擎是浏览器的一部分。而JavaScript主要是用来扩展文档交互能力的,使静态的HTML具有一定的交互行为(比如表单提交、动画特效、弹窗等)
特性侧重内容组织和标记;语言形式不严谨(无需精确的闭合,内容彼此独立,后面不影响前面)侧重内容的修饰,例如内容样式美化展示侧重做网页的交互方面

合作方式

  • HTML是一门独立的技术,需要CSS和JS丰富它的功能和展示效果
  • CSS和XML/HTML强绑定,独立的CSS没法运行,无法脱离HTML/XML的环境
  • JS不同于CSS,可以独立存在,并且可以操作HTML和CSS达到交互目的

JavaScript

  • JS 是一门轻量级脚本语言,可用于 HTML 和 web,适用于各端(服务端/移动端等)
  • 放置位置
    HTML 中的 Javascript 脚本代码必须位于 <script></script> 标签之间。
    Javascript 脚本代码可被放置在 HTML 页面的 <body><head> 部分中。
    
  • JS 执行环境和使用语法

前端字体动效

文字动画效果

  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值