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标签里,出现这种情况时,一般按优先权划分

  1. 浏览器默认设置 (最低)
  2. 外部样式表
  3. 内部样式表(写在html的<head>标签内部)
  4. 内联样式(写在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插件用得比较多,网页制作上随处可见。如图片轮换功能,导航制作,上传图片等等。

  • 8
    点赞
  • 63
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
HTMLJavaScriptCSS是Web前端开发中最常用的三种技术。它们之间是紧密联系的,三者相互配合才能达到Web开发的最佳效果。 一、HTML是网页的骨架 HTML全称为“超文本标记语言”,它是网页的骨架,用于描述网页的结构和内容。HTML将页面分为不同的区块,比如标题、段落、列表、表格等。开发者可以通过HTML标签来定义这些区块,从而实现网页的布局和内容呈现。 HTMLCSS关系非常紧密。CSS用于控制网页的样式,而HTML则定义了网页的结构和内容。CSS通过选择器(如标签名、类名、ID等)来选择HTML元素,并应用样式。例如,我们可以使用CSS来设置HTML元素的颜色、字体、大小、布局等。 同时,HTML也是JavaScript的基础。在HTML中,我们可以使用script标签来嵌入JavaScript代码。JavaScript可以通过HTML文档对象模型(DOM)来访问和操作HTML元素。通过DOM,JavaScript可以动态地修改HTML内容和属性,从而实现交互效果和动态效果。 二、JavaScript是网页的灵魂 JavaScript是一种脚本语言,它用于为网页添加动态效果和交互功能。JavaScript可以与HTMLCSS紧密协作,实现更加灵活和丰富的网页交互效果。 JavaScript可以直接嵌入HTML文档中,也可以通过外部JavaScript文件来引入。在HTML中,我们可以使用script标签来嵌入JavaScript代码。JavaScript代码可以直接访问HTML中的元素,也可以通过DOM来访问和修改HTML元素。 JavaScriptCSS之间关系也非常紧密。JavaScript可以通过DOM来访问和修改HTML元素的样式,从而实现更加灵活的样式控制。例如,我们可以使用JavaScript来动态修改HTML元素的颜色、字体、大小、布局等。 同时,JavaScript也是HTML的灵活性和互动性的基础。通过JavaScript,我们可以实现网页的动态效果和交互效果,比如表单验证、弹出框、菜单、轮播图等。 三、CSS是网页的外表 CSS全称为“层叠样式表”,它用于控制网页的外观和布局。CSS可以独立于HTML存在,也可以嵌入到HTML文档中。CSS可以通过选择器来选择HTML元素,并应用样式。 CSSHTML之间关系非常紧密。通过CSS,我们可以控制HTML元素的外观和布局。例如,我们可以使用CSS来设置HTML元素的颜色、字体、大小、边框、间距、位置等。 CSSJavaScript之间关系也非常紧密。JavaScript可以通过DOM来访问和修改HTML元素的样式,从而实现更加灵活的样式控制。同时,CSS也可以通过伪类和伪元素实现一些特殊的效果,比如鼠标悬停、选中、响应等。 总结 HTMLJavaScriptCSS是Web前端开发中最基础、最重要的三种技术。它们之间的联系非常紧密,三者相互配合才能达到Web开发的最佳效果。HTML是网页的骨架,JavaScript是网页的灵魂,CSS是网页的外表。这三种技术的协同作用,实现了Web前端开发的丰富性和灵活性。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值