1-如何学习HTML

html的用处

html是前端最基础的知识点,是构建网页的基本元素,实现UI,先要设计对应的DOM结构,编写HTML代码和css代码实现UI效果,然后通过JavaScript来实现交互,所以学习HTML相当于是搬砖的第一步,先认识有哪些砖块,每种砖块有什么用处。

🧱   🧱    🧱   🧱 🧱 🧱   🧱 🧱 🧱    🧱 🧱        🧱       🧱 🧱 🧱
 🧱  🧱 🧱 🧱      🧱 🧱   🧱         🧱    🧱   🧱   🧱    🧱 
   🧱    🧱     🧱 🧱 🧱   🧱 🧱 🧱    🧱 🧱        🧱       🧱 🧱 🧱 

在我之前最早工作的时候,还没有分前端这个职位,那时候设计师会出一套静态的网页给到服务端直接开发。现在后来前端自己写HTML页面。再到后来出现了前端框架,有了MVC、MVVM的设计理念之后,基本上前端主要工作都是写组件、写模块、组装成页面。可能用的最多的也就是div、span、table、ul、a、img等等了。

但是在开发页面的时候,还是建议大家精良用语义化的标签,比如该用header、footer、section的时候就用对应的语义化标签,而不是全写一堆的div。

html学习方法

学习不用死记硬背,建议多动手练习,自己多写几个标签试一试, 点击代码块右上角的"运行"就可以运行试一下,自己改改代码,跑一跑

<!DOCTYPE html>
<html>
 <head>
   <title>Title of the document</title>
 </head>
 <body>
   <h1>This is heading 1</h1>
   <h2>This is heading 2</h2>
   <h3>This is heading 3</h3>
   <h4>This is heading 4</h4>
   <h5>This is heading 5</h5>
   <h6>This is heading 6</h6>
 </body>
</html>

建议整体过一遍,看一遍,写一遍

为什么是英文教程

这里我废了九牛二虎之力,真是不容易找来了HTML基础知识的英文版本,这里面的英文单词、句子都比较简单,作为合格的工程师,程序员,后面不免要查看学习英文博客、英文文档,所以这里学习基础知识的时候,大家也可以练练英文。

毕竟这些技术都是外国人发明的,有些功能点哟个英语表达的更到位,需要仔细琢磨,翻译过来可能翻译的不准确,没法精确表达某些属性或者元素的含义,特别是css和js,大家后面看到就会有体会。

最后的篇章中我增加了一些总结,基本上都是工作中遇到的问题,供大家学习参考。

安装翻译插件

安装地址:https://magicfanyi.youdao.com/#/

翻译插件可以帮你翻译,同时学学英语!



请遵守《互联网环境法规》文明发言,欢迎讨论问题
扫码反馈

扫一扫,反馈当前页面

咨询反馈
扫码关注
返回顶部