Web前端开发技术------HTML5、CSS3、JavaStript概念的深刻理解

最新推荐文章于 2024-09-18 23:31:07 发布

温柔徐u.

最新推荐文章于 2024-09-18 23:31:07 发布

阅读量616

点赞数 1

分类专栏： Web 文章标签：前端 css html5 javascript

本文链接：https://blog.csdn.net/XU_MENGQI/article/details/122173992

版权

Web 专栏收录该内容

10 篇文章 0 订阅

订阅专栏

本文详细介绍了网页开发的三大核心技术：HTML、CSS和JavaScript。HTML负责网页的结构，CSS用于美化页面样式，而JavaScript则为网页添加动态功能。通过CSS选择器和优先级规则控制样式，JavaScript采用事件驱动方式响应用户操作。了解这三者的基本概念和应用，对于前端开发至关重要。

摘要由CSDN通过智能技术生成

1 HTML

HTML是超文本标记语言（不需要编译）。它是一种标记语言，而不是编程语言。THML是Web网页的结构。HTML使用标记来描述网页。

网页的内容包括标题、副标题、段落、无序列表、定义列表、表格、表单等。

HTML代码框架

<html>
  <head>

  </head>
  <body>

  </body>
</html>

2 CSS

CSS语言是一种标记语言，起美化页面的作用，不需要编译。

CSS通过定义标记或者标记属性的外在表现，对页面结构风格进行控制，分离文档的内容和表现，克服了传统THML的缺点。将SCC嵌入在页面中，通过浏览器解释执行，而且CSS文件是文本文件，只要理解了HTML就可以掌握它。

CSS语言使得页面内容和表现分离。

CSS选择器：标记选择器、类选择器、id选择器、伪类选择器、属性选择器。

优先级：行内样式>id样式>class样式>标记样式。

.c1{....}   //类选择器（class="c1"）
#c2{....}   //id选择器（id="c2"）

编辑CSS有两种方式：

(1)写在HTML文件里面，位置分为两种形式：一种写在某个元素的属性部分，作为style属性的值；另一种是写在head标记里面，通过style标记包含。

<标记 style=“属性1:值;属性2:值;...”>
修饰的内容
</标记>

<style type="text/css">
选择器1{属性1:值;属性2:值;...}
......
</style>

(2)将CSS规则写在单独的文件里。

<link type="text/css" rel="stylesheet" herf="URL">  //链接外部样式表


<style type="text/css">
  @import url("外部样式表文件1名称");
  @import url("外部样式表文件2名称");
  选择器1{属性1:值;属性2:值;...}
  ......
</style>

3JavaStript

JavaStript是一种基于对象和事件驱动并具有相对安全性的客户端脚本语言。常用来给HTML网页添加动态的功能（提高用户体验）。

JavaStript的响应采用事件驱动的方式进行，当页面中执行了莫种操作时会产生特定事件。

JavaStript运行在客户端，JavaStript程序运行只依赖于浏览器，与操作系统和及其硬件无关。JavaStript程序不能独立运行，必须依赖HTML文件。

基本语法：

<script type="text/JavaStript" [src="外部js文件"]>
js语句块;
</script>

<script language="JavaStript" [src="外部js文件"]>
...
</script>