些程序员学编程走了不少的弯路，一段时间学Java，接着又换php。

结果呢，到头来什么都没有学好。

最近有个w3cschool粉丝问了这样的一个问题：26岁跨行学前端靠谱吗?

其实，这个主要还是看爱好以及是否适合。

就比如前端这三驾马车，HTML+CSS+Javascript。html算是比较简单的，如果学习html都觉得很吃力，那就别提后面JavaScript的学习啦!

不过，学html难免会遇到一些困惑，w3cschool给程序员小伙伴们解答一下常见的3大问题：

0、学html选什么书?

HTML是超文本标记语言，没有变量，没有循环，没有函数。

如果是零接触的新手，推荐《HTML之路：XHTML和CSS最佳实践指南》，它是国外著名网站HTML DOG中的精华内容的集结。

然后就是看《Head first HTML&CSS》 这本神奇的入门书，看个两三遍就会对html有个整体的印象。

1、选什么网上教程?

跟着Learn to code这个网站学html还是很有帮助的，完成任务会有徽章奖励，可以调动学习积极性，不会感觉枯燥。

另外，W3Cschool网站上的HTML在线教程可以过一遍，了解每个标签以及属性。

当然，你还可以通过w3cschool app或者网站上的html编程微课学习。

html编程微课采用了游戏化编程实战闯关，各种的小节测验，帮助你快速打下基础。

2、做什么项目实战?

有不少学html的新手都会问要做什么项目呢?

其实，你觉得学到了一定的程度，便可以小试牛刀，譬如最简单的就是搭一个博客，也可以做简单的静态展示类网页。

TML 基础

非常简单的HTML文档

HTML 标题

HTML 段落

HTML 链接

HTML 图片

实例解析

HTML 标题

HTML 标题

在html源码中插入注释

插入水平线

实例解析

HTML 段落

HTML 段落

更多段落

本例演示在 HTML 文档中折行的使用。

HTML 格式化的某些问题。

实例解析

HTML 文本格式化

文本格式化

此例演示如何使用 pre 标签对空行和空格进行控制。

此例演示不同的"计算机输出"标签的显示效果。

此例演示如何在 HTML 文件中写地址。

此例演示如何实现缩写或首字母缩写。

此例演示如何改变文字的方向。

此例演示如何实现长短不一的引用语。

文本下划线与删除线

实例解析

HTML 样式

HTML Style 元素

背景色样式

字体样式，颜色，大小

文本对齐样式

设置文本字体

设置文本字体大小

设置文本字体颜色

设置文本字体，字体大小，字体颜色

HTML使用不同样式

没有下划线的链接

链接到一个外部样式表

实例解析

HTML 链接

创建超级链接

将图像作为链接

在新的浏览器窗口打开链接

链接到同一个页面的不同位置

跳出框架

创建电子邮件链接

创建电子邮件链接 2

实例解析

HTML 图像

插入图像

从不同的位置插入图片

排列图片

本例演示如何使图片浮动至段落的左边或右边。

制作图像链接

创建图像映射

实例解析

HTML 表格

简单的表格

没有边框的表格

表格中的表头

带有标题的表格

跨行或跨列的表格单元格

表格内的标签

单元格边距(Cell padding)

单元格间距(Cell spacing)

实例解析

HTML 列表

无序列表

有序列表

不同类型的有序列表

不同类型的无序列表

嵌套列表

嵌套列表 2

定义列表

实例解析

HTML Forms 和 Input

创建文本域(Text fields)

创建密码域

复选框

单选按钮

简单的下拉列表

预选下拉列表

本例演示如何创建一个文本域（多行文本输入控件）。

创建一个按钮

本例演示如何在数据周围绘制一个带标题的框。

带有文本域与输入域的表单

带有复选框与提交按钮的form表单

带有单选框与提交按钮的表单

发送邮件表单

实例解析

HTML iframe

内联框架 (HTML页面中插入框架)

实例解析

HTML 头部元素

描述了文档标题

HTML页面中默认的URL链接

提供文档元数据

实例解析

HTML 脚本

插入一个脚本

使用 <noscript> 标签

实例解析

如您还有不明白的可以在下面与我留言或是与我探讨QQ群308855039，我们一起飞！

文作为一个纯CSS3实现网格的示例，在不使用table标签，仅仅利用div标签及flex布局，用flexbox及相关属性来实现一个带有表头和页眉的跨行、跨列的表格。

废话不多讲，直接上代码：

CSS代码如下：

HTML代码如下：

效果图如下：