语义化HTML
Last updated
Last updated
打开浏览器，访问一个网站，看到了漂亮的网页。比如豆瓣（douban.com）是这样的：
右键“查看页面源代码”，看到了一行行的文本。是这样的：
把这些代码复制下来，保存成index.html文件，用浏览器打开，看到了和访问douban.com一样的内容。如图：
这就是HTML，写的时候是一行行的文本，用浏览器打开，就会渲染成图形化的界面。
下面开始开发一个“在线阅读网站”，可以用来当小说网站、博客、新闻网站等等。
先来规划一下产品要做哪些功能？
首页：显示文章列表，列表里显示每篇文章的标题、摘要。
详情页：显示整篇文章。
发表页：给出文本框，录入保存文章。
首页的HTML代码如下：
能看懂这些代码吗？如果看不懂，自学一下HTML语法就行了，很简单，预计需要1至2天时间。教程在这里：《梦之都HTML教程》www.dreamdu.com。
自学：2天。
注意：截图的Firefox右上角有个“0错误/0警告”，这是Firefox扩展HTML Validator，能保证你写出100%标准的HTML，特别方便，推荐安装。下载页面：http://users.skynet.be/mgueury/mozilla/。
学完HTML，知道语义化是什么意思了，会写最简洁的HTML了，那咱们继续。
刚才的代码是首页，其他还有详情页、发表页，在这里：
代码下载：https://github.com/sinkcup/php-ebook-online-reader/tree/0.1.0
下载以后，你就可以看到截图里的精彩内容，知道如何“在北京买房”、“9个月挣到70w”、“30岁退休”，当然了，为了吸引青年男女，特意放了几篇XXOO相关的文章，其中有一篇是老罗写的，很精彩又不低俗，人格担保，你懂的。
HTML
语义化：最简HTML
零基础如何学习HTML
自学《梦之都HTML教程》。
如何写出100%标准的HTML
使用Firefox扩展HTML Validator即可。
【人在北京，30 岁了，实在买不起房，对生活感到悲观，怎么办？】
胖狗同学：事实上，我是为这个被折叠的答案来写一篇回复的，我只想说，楼主在精神上没准备好买房（虽然我很不爱这么定义一个人），即使他的收入增长50%，到了30万，他还会抱怨买不起房…… http://zhi.hu/WAJ1（分享自知乎）
这些HTML代码都在电脑上存着，本地能打开，但别的电脑、手机如何访问呢？
且听下回分解。
在浏览器中打开是这样的：
