Web前端开发入门

本文介绍了HTML(超文本标记语言)的基本概念和发展历程,从1993年首次发布至今,包括HTML5在内的各版本演进。同时,文章列举了HTML在网页构建中的多种用途,如展示文字、图片、音频和视频等,并概述了与之配合使用的CSS和WebJs基础知识。

HTML:超文本标记语言 HyperText Markup Language
CSS:层叠样式表 Cascading Style Sheets
WebJS:Web JavaScript 网页脚本

Web前端就是 HTML+CSS+WebJS

一个外行看Web开发可能认为Web就是HTML,那HTML是什么,HTML有什么发展历程吗?

HTML全称:超文本标记语言。“超文本”就是指页面内可以包含图片、链接,甚至音乐、程序等非文字元素。

HTML的历史可以追溯到很久以前。1993年HTML首次以因特网草案的形式发布。20世纪90年代的人见证了HTML的大幅发展,从2.0版,到3.2版和4.0版,再到1999年的4.01版,一直到现在正逐步普及的HTML5。随着HTML的发展,W3C(万维网联盟)掌握了对HTML规范的控制权。

我们学习一门语言首先目的性是很强的?所以第一步是HTML可以干什么?

1.展示文字
2.展示图片 (SVG 矢量图)
3.展示音频,视频。
4.拥有Canvas 一个画布可以绘画你想要的东西 ECharts
5.用于获得用户的地理位置。
6.客户端存储数据。
7.应用缓存
8.web worker 后台脚本
9.服务端推送消息
10.Web Socket (与服务器进行长期交互)

那么所有以上的功能都是靠编码完成的,这个是毋庸置疑的!那么我们具体敲什么代码呢?
那么主要分为
①标签 主要是构建网页
HTML5标签参考
②CSS 样式参考 主要是让网页变得美观
CSS样式参考
③WebJs
WebJs=DOM+BOM+ECMAScript
HTML DOM学习
HTML BOM学习

综合:Javascript高级程序设计 书籍

那么HTML经常使用的标签有哪些呢?
div 标签
a 标签
form标签 及它包含的标签
table标签 及它包含的标签
ul li标签
img标签

CSS主要包含
标签元素类别
背景
边框
颜色
字体
定位
边距

WebJs主要包含
1.获取元素
2.操作元素
3.AJAX

Web前端开发入门可按以下方法进行: 首先明确入门标准,要达到能参与Web前端实际项目的开发水平,这就需要了解如今实际项目开发所用的技术栈。HTML、CSS、JavaScript这三大基础技术栈是必须掌握的,它们是参与实际项目开发的基础 [^2]。 HTML是网页的骨架,好比人体的框架,如胳膊、腿、手等,是构建网页结构的基础 [^3][^4]。CSS则如同我们穿的衣服、鞋子,用于美化网页,为网页添加样式和布局 [^4]。JavaScript像是人的大脑,控制身体的运动,在网页中负责实现交互效果和动态功能 [^4]。 学习过程中,需要系统地学习和专业的指导,避免耗费大量时间和精力却无法保障学习效果。可以参考详细的学习路线和建议,逐步掌握Web前端开发的核心技能 [^1]。 此外,市面上有适合小白学习的零基础资料,也有适合有一定经验的开发者深入学习提升的进阶课程,可根据自身情况选择合适的学习资料 [^5]。 示例代码展示HTML、CSS和JavaScript的简单结合: ```html <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Web前端入门示例</title> <style> /* CSS样式 */ body { font-family: Arial, sans-serif; background-color: #f4f4f4; } h1 { color: #333; } </style> </head> <body> <!-- HTML结构 --> <h1>欢迎来到Web前端世界</h1> <button id="myButton">点击我</button> <script> // JavaScript交互 const button = document.getElementById('myButton'); button.addEventListener('click', function () { alert('你点击了按钮!'); }); </script> </body> </html> ```
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值