To learn how the Web front-end? This is what many novice will ask the question, what web front-end development to learn what? It is hard to learn?
Learning web front-end can be divided into the following stages:
The first stage: HTML tags learning
HTML (HyperText Mark-up Language referred to as HTML), "hypertext" refers to the inside pages can contain images, links, and even music, programs and other non-text elements.
html page is a skeleton, like building a house structure - which is the basis of the front page. Try to think about, even if a house brick and cement are not, step back what meaning does?
Therefore, we must fully grasp the basic structure and common HTML tags, attributes. With a good start, even from one step closer to success - here are two suggestions, you can try:
1, to semantic memory. For example, this is the list ul li, button is the button, table is the table. In fact, this is also advocated html5, semantic tags.
2, try to write a little demo, maybe just a list, a table, or a button.
Learning HTML is to their own continued to write, to try. Looking at your code run up, with the effect in mind, the mood was very happy!
What I do not know how you can add the WEB front-end learning exchanges buttoned qun, in front of 133, intermediate 868, followed by 702 in the learning process. The group has a good tutorial and development tools, project source code sharing, professional teacher to answer questions. Share web front-end corporate demand for talent moment and you learn and how good the web front end from zero base, and learn what content.
The second stage: CSS learning
CSS, Cascading Style Sheets - (Cascading Style Sheets), is able to truly show pages with content separated from a style language.
Compared with the traditional performance in terms of HTML, CSS page layout can be in the position of an object pixel-level precision control, supports almost all of the fonts in style, with the ability to edit the page objects and models of style, and be able to interact with preliminary design, text-based display is the best performance design language.
CSS can be different according to the user's ability to understand, optimize or simplify the wording for all types of people, there is a strong legibility.
关于CSS的各种属性，我们还是可以参考学习HTML那样。可以说CSS的属性几乎完全是语义化的。我们需要改变边框，那就是“border”，那我们需要右侧边框做一些改变，那就是“border-right”。
很明显，接下来按照我们的需求还有“右边框的宽度——border-right-with”，”右边框颜色——border-right-color”等等等，诸如此类~完全就是我们需要什么，只要凭着需求去寻找。
第三阶段：JavaScript
JavaScript一种直译式脚本语言，是一种动态类型、弱类型、基于原型的语言，内置支持类型。它的解释器被称为JavaScript引擎，为浏览器的一部分，广泛用于客户端的脚本语言，最早是在HTML（标准通用标记语言下的一个应用）网页上使用，用来给HTML网页增加动态功能。
javascript是一个可以运行在浏览器上面的语言（当然现在基于一些库/框架已经远不只是在浏览器上了），它可以操控浏览器，让浏览器听从我们的命令。这有点像一个电视剧和遥控器，而javascript就是我们的遥控器。
浏览器根据javascript的指令，做出相应的反馈。比如操作DOM（也可以理解成为操作HTML），可以操作CSS。有了javascript就可以让我更加灵活&动态的操控HTML，CSS。
严格来说、HTML和CSS还算不上真正的“语言”，而javascript却是如假包换的脚本型语言，既然是语言，那就会有字符串，数组，对象等等。而我们的javascript可以处理这些与数据有关的工作，比如给数组排个序，去个重等等。
而我们依靠javascript可以做些什么呢？网页上常见的轮播图，网站的注册功能，提交我们的留言，刷新获取新闻等等。当然，我们强大的javascript远不止此！
第四个阶段：jQuery
jQuery是一个兼容多浏览器的javascript库，核心理念是write less,do more(写得更少,做得更多)。jQuery在2006年1月由美国人John Resig在纽约的barcamp发布，吸引了来自世界各地的众多JavaScript高手加入，由Dave Methvin率领团队进行开发。如今，jQuery已经成为最流行的javascript库，在世界前10000个访问最多的网站中，有超过55%在使用jQuery。
如果继续用盖房子做例子，jQuery更像是一个装修队。我们只需要关注我们的房子设计本身，把我的想法，理念告知这个装修队，让它来给我们处理那些杂七杂八的事情。
另外谈到web前端要如何学的问题，在这里简单给大家介绍一些学习Web前端时候的方法，也希望对大家有些帮助，在写css前，其实html的结构要是比较合理的，这样写css也会比较顺手。在写一个网页之前，建议先琢磨几分钟，不要上来就写。多
去看看别人是怎么写的，然后结合自己的项目，心中有一个大致规划。可以先把最外层轮廓写好，先不着急去写某一个具体的部分。
这里给大家分享一些css小技巧：
1、CSS缩写
CSS缩写简化了你的CSS代码，更重要的是，它让你的代码更加整洁易懂。
2、理解class和id
这两个选择器总是让初学者感到迷惑。在CSS中，Class和ID分别用点“.”和井号“#”来标识。简单来说id就是用来标识那些单独不重复的样式，而class是可以重复使用的。
3、实用的<li>
<li>也叫链接列表，在与<ol>或<ul>正确搭配的时候非常好用，尤其是用在导航菜单样式上。
4、少用<table>多用<div>
CSS最大的优势之一是使用<div>达到样式上的灵活多变。不同于<table>，<div>里的内容不会 被锁在单元格<td>中。可以说几乎所有的表格布局都可以在<div>和样式的正确使用下完成。当然，有大量表格内容时，还是用 <table>吧。
web前端要如何学，重要的是掌握学习前端需要方法，更需要一颗平常心，不要把前端想的多难。要想深入精通的掌握一门技术，前期还是要多跟着行业大牛学习，这样会入门更快，少走弯路。