本系列将学习最基础的web前端知识:

HTML---CSS---JavaScripts---jQuery

四大部分学习完以后再进入到JavaWeb的知识。(后端)

然后再学习SpringBoot技术、SSM、Vue等等,

最后再讲讲实际项目开发、就业面试等内容。


第一章:下载一个自己喜欢的轻量化代码编辑器

我推荐初学者在一开始使用较为原始的开发环境,

比如我们在学习Java的时候,我们先使用了记事本+控制台编译的形式,

学到一定程度之后再换上开发工具IDEA。

学习HTML也是一样,我一开始会先使用比较简单的开发工具:Sublime Text,一个Mac平台的文本编辑器。

在Windows平台请使用notepad++!

并且选择对应的语法高亮。

对于Mac上的软件下载,我推荐浏览http://macwk.com,这绝对是一个牛逼的网站。

我不能接受有Mac(绿色)用户不知道这个网站。

第二章:编写第一个HTML文件

这就是一个最基本的HTML文件,文件后缀名是.html(.htm也可以)

最外面用<html> 和</html>包围,里面有一个head和body

<html>
<head>
<title>
我是标题
</title>
</head> <body>
Hello World </body> </html>

保存文件,然后双击用浏览器打开,就可以看到我们的成果了!

我们还可以在文本编辑器中,直接右键,在浏览器中打开。

第三章:解决编码问题-无脑版

标题是乱码,本来应该显示“我是标题”。

这是一个编码问题,我们文本编辑器的编码和我们浏览器读取的编码不同导致的。

(如果你使用开发环境来编写HTML文件,可能不会出现这些问题,但是这个问题非常基础,我们必须了解,这就是为什么我们使用这样的编写方式)

解决方法很简单,我们将文本编辑器的编码和浏览器读取编码保持一致即可。

都选用同一个编码之后,网页就可以正常显示了。

后面,我们会学习更多的标签,去自动解决标签问题。

第四章:一些语法规则

1、html语法不区分大小写 2、有开始,就必须有结尾,除了一些单独的标签 3、如hr

<hr/>是那个分割线

【HTML】学习路径1-网页基本结构-标签基本语法的更多相关文章

  1. 【HTML】学习路径4-align对齐-标签属性

    每个标签都可以设置各种属性,比如可以给一个段落标签添加一个name的属性: <p name="段落标签1"> 这一节我们学习一个属性:align对齐标签 第一章:ali ...

  2. python爬虫 | 一条高效的学习路径

    数据是创造和决策的原材料,高质量的数据都价值不菲.而利用爬虫,我们可以获取大量的价值数据,经分析可以发挥巨大的价值,比如: 豆瓣.知乎:爬取优质答案,筛选出各话题下热门内容,探索用户的舆论导向. 淘宝 ...

  3. 从零开始学习html(二)认识标签(第一部分)——上

    一.语义化,让你的网页更好的被搜索引擎理 学习html标签过程中,主要注意两个方面的学习:标签的用途.标签在浏览器中的默认样式. 标签的用途:我们学习网页制作时,常常会听到一个词,语义化. 那么什么叫 ...

  4. Java学习路径及练手项目合集

    Java 在编程语言排行榜中一直位列前排,可知 Java 语言的受欢迎程度了. 实验楼上的[Java 学习路径]中将首先完成 Java基础.JDK.JDBC.正则表达式等基础实验,然后进阶到 J2SE ...

  5. HTML5的新结构标签

    在之前的HTML页面中,大家基本上都是用了Div+CSS的布局方式.而搜索引擎去抓取页面的内容的时候,它只能猜测你的某个Div内的内容是文章内容容器,或者是导航模块的容器,或者是作者介绍的容器等等.也 ...

  6. JavaWeb学习笔记(九)—— JSTL标签库

    一.JSTL概述 1.1 什么是JSTL  JSTL是apache对EL表达式的扩展(也就是说JSTL依赖EL),JSTL是标签语言!JSTL标签使用以来非常方便,它与JSP动作标签一样,只不过它不是 ...

  7. SSM(spring mvc+spring+mybatis)学习路径——1-1、spring入门篇

    目录 1-1 Spring入门篇 专题一.IOC 接口及面向接口编程 什么是IOC Spring的Bean配置 Bean的初始化 Spring的常用注入方式 专题二.Bean Bean配置项 Bean ...

  8. web前端开发学习路径图

    第一阶段 WEB前端工程师课程 HTML语句,HTML页面结构.css语法.style属性.link和style标签.id属性.等HTML语句中的相关属性: 通过Dreamweaver制作出跨越平台限 ...

  9. .NET平台技术体系梳理+初学者学习路径推荐+我们的愿景与目标

    文章出自:http://www.cnblogs.com/ice-river/p/3475041.html 一 .NET平台技术体系梳理 .NET平台应用领域众多(桌面开发,web开发,移动开发),不断 ...

随机推荐

  1. idea中一些常用的快捷键

    ctrl+shift+alt:多行操作psvm:生成main()方法:fori:生成for循环:Ctrl+Alt+v:自动补齐返回值类型ctrl+o:覆写方法ctrl+i:实现接口中的方法ctrl+s ...

  2. TypeScript(7)泛型

    泛型 指在定义函数.接口或类的时候,不预先指定具体的类型,而在使用的时候再指定具体类型的一种特性. 引入 下面创建一个函数, 实现功能: 根据指定的数量 count 和数据 value , 创建一个包 ...

  3. React关于constructor与super(props)之间的相爱相杀

    我们先把菜鸟教程的一段代码拿过来分析一下.下面这段代码是用了将生命周期方法添加到类中实现时钟效果. // 将生命周期方法添加到类中 class Clock extends React.Componen ...

  4. Web思维导图实现的技术点分析(附完整源码)

    简介 思维导图是一种常见的表达发散性思维的有效工具,市面上有非常多的工具可以用来画思维导图,有免费的也有收费的,此外也有一些可以用来帮助快速实现的JavaScript类库,如:jsMind.KityM ...

  5. 用python进行加密和解密——我看刑

    加密和解密 密码术意味着更改消息的文本,以便不知道你秘密的人永远不会理解你的消息. 下面就来创建一个GUI应用程序,使用Python进行加密和解密. 在这里,我们需要编写使用无限循环的代码,代码将不断 ...

  6. Netty 如何高效接收网络数据?一文聊透 ByteBuffer 动态自适应扩缩容机制

    本系列Netty源码解析文章基于 4.1.56.Final版本,公众号:bin的技术小屋 前文回顾 在前边的系列文章中,我们从内核如何收发网络数据开始以一个C10K的问题作为主线详细从内核角度阐述了网 ...

  7. 【docker专栏1】docker解决的实际问题及应用场景

    Docker是一个开源的容器引擎,它轻巧,且易移植,"build once, configure once and run anywhere".使用go语言开发,并遵从apache ...

  8. 看起来是线程池的BUG,但是我认为是源码设计不合理。

    你好呀,我是歪歪. 前几天看到一个 JDK 线程池的 BUG,我去了解了一下,摸清楚了它的症结所在之后,我觉得这个 BUG 是属于一种线程池方法设计不合理的地方,而且官方在知道这个 BUG 之后表示: ...

  9. Collection集合汇总

    Collectioin(java) Collection简介 打开帮助文档 java.utill //使用时需要导包 Interface Collection 集合层次结构中的根界面 . 集合表示一组 ...

  10. idea的使用技巧和必要的设置

    idea 如何开启多个线程 打开下面按钮,然后运行相同的代码即可 打开idea需要选择打开哪一个项目 * 设置如下,关闭下面选项即可