如何创建网站第五部分：附加资源

本周我们向您展示了如何使用HTML和CSS创建网站。。。但是现在呢？这里有一些额外的资源和方法，你可以用来了解更多。...

本周我们向您展示了如何使用HTML和CSS创建网站。。。但是现在呢？这里有一些额外的资源和方法，你可以用来了解更多。

Image for article titled How to Make a Web Site Part V: Additional Resources

第一件事：如果你想要所有课程的笔记都是PDF格式的，你可以在这里下载。

接下来，您应该知道，也许学习HTML和CSS新知识的最好方法就是简单地查看其他站点上的源代码。基本上，您只需从web浏览器的“视图”菜单中选择“查看源代码”，然后浏览HTML源代码以找到所需的代码，但请查看上面的视频以获得更深入的了解。

不要犹豫，使用你选择的搜索引擎来学习更多关于各种HTML元素、CSS属性的知识，或者只是一个你知道如何描述的很酷的技巧。web开发人员通常愿意分享详细信息，解释他们是如何完成某项任务的。在搜索过程中，很可能会遇到指向学校的结果。W3Fools网站认为W3Schools是一件坏事（也许过于夸张）。不过，这并不完美，所以还是要谨慎对待。像htmldog这样的网站是一个不错的选择。

学习HTML和CSS之后的下一个逻辑步骤是学习一点JavaScript。幸运的是，我们的代码学习课程已经覆盖了您。这将教你面向对象编程的基础知识，以及如何用JavaScripts做一些基本的事情。将来我们希望用PHP和MySQL解决服务器端编程问题，但我们还没有做到。像往常一样，你可以访问Lifehacker夜校页面，查看我们一起布置的所有课程。

所有这些都说，让我们来看看你可以用来学习更多关于CSS和HTML的其他资源，并提高你的技能。

web开发人员工具

（adampash跳到这里）甚至比查看源代码（在上面的视频中描述）更好，您还需要熟悉浏览器最好的web开发工具。在一些浏览器上，比如Chrome或Safari，内置了非常好的开发工具。在Firefox等其他浏览器上，您需要安装Firebug扩展。

当你开始入侵网站时，这些web开发工具是非常宝贵的。作为一个HTML和CSS初学者，您最想熟悉的工具是elementinspector。比方说，您正在查看页面上的一个元素，并且希望看到定义它的高级表示的CSS是什么样子的。以下是它在Chrome中的工作原理：

在要检查的图元上单击鼠标右键，然后选择“检查图元”(这将在浏览器底部打开一个新的窗格，如下面的屏幕截图所示。在窗格的左侧，您将看到页面源代码，并突出显示您选择要检查的元素。在右侧，您将看到正在检查的元素的CSS。您可以检查页面上的任何其他元素，方法是右键单击该元素并再次选择“检查元素”，或者在“源”窗格中单击该元素。

最好的部分？你可以在页面上实时使用CSS，添加属性，推送像素，调整任何你想看到它如何工作，某个属性做什么，等等。在上面的截图中，你可以看到我改变了这篇文章标题的颜色，并将字体大小增加到50px。我意识到我们在附加资源的文章中隐藏了这一点，但在我看来，这是web开发人员工具包中最好的工具。不要犹豫，用它来浏览网页和玩源代码(在浏览器中，更改只是本地的；下次刷新页面时，一切都将恢复正常。）

还有其他一些基于浏览器的web开发工具可以执行更具体的任务，但这些是目前为止最重要的工具(帕什说。）

在线资源

这些在线资源包括从额外的屏幕广播到文章，再到可以用来加速开发的CSS工具。

Lynda.com-我们几乎总是提到Lynda是一个伟大的学习资源，因为它是。它会花费你大约每月25美元，但如果你只是在那里通过他们的课程之一，你可以学习你想在一个月内学习，然后暂停你的帐户，直到你想回来学习其他东西。或者你可以继续订阅，每个月学习一项新技能，因为他们的图书馆非常棒，无穷无尽。
Primary CSS-Primary是一个CSS框架，它提供了许多预先编码的布局，这些布局总是很好地工作。如果你想节省一点时间把你的布局放在一起，Primary可以帮你。
Blueprint-Blueprint是另一个CSS框架，它可能比Primary灵活一些，并且集中精力减少整个开发时间。它不仅有助于布局，还可以帮助您轻松创建按钮、选项卡和其他页面元素。
你应该学习的3种高级CSS3技术-这只是一篇文章，但它将教你3种CSS3技术，你可能想知道：高级选择器，动画和媒体查询。尤其是动画，非常酷。另外两个很实用。

书

我和adampash都是通过查看代码和实验来学习HTML和CSS的，所以我们不能亲自推荐任何书籍。但以下是朋友和Lifehacker读者的一些建议。

CSS:David Sawyer McFarland的失踪手册
CSS：Eric A的权威指南。迈耶
HTML和XHTML：Chuck Musciano和Bill Kennedy的权威指南
Eric T的Head First HTML with CSS和XHTML。弗里曼和伊丽莎白·弗里曼
Andy Harris的假人HTML

有其他学习HTML和CSS的好资源吗？在评论中分享！

你可以在Twitter和Facebook上关注这篇文章的作者adamdachis。如果你想联系他，推特是最有效的方式(function（）{var w=window，amznAsin=（w.amznAsin&amp&amp；w、 amznAsin.c***tructor===对象）？w、阿姆兹纳辛：{}；amznAsin[“0596802447”]=“0596802447”；w、 amznAsin=amznAsin；}）（）(function（）{var w=window，amznAsin=（w.amznAsin&amp&amp；w、 amznAsin.c***tructor===对象）？w、阿姆兹纳辛：{}；amznAsin[“0596527330”]=“0596527330”；w、 amznAsin=amznAsin；}）（）(function（）{var w=window，amznAsin=（w.amznAsin&amp&amp；w、 amznAsin.c***tructor===对象）？w、阿姆兹纳辛：{}；amznAsin[“0596527322”]=“0596527322”；w、 amznAsin=amznAsin；}）（）(function（）{var w=window，amznAsin=（w.amznAsin&amp&amp；w、 amznAsin.c***tructor===对象）？w、阿姆兹纳辛：{}；amznAsin[“059610197X”]=“059610197X”；w、 amznAsin=amznAsin；}）（）；

（function（）{var w=window，amznAsin=（w.amznAsin&&w.amznAsin.c***tructor==Object）？w、阿姆兹纳辛：{}；amznAsin[“0470537558”]=“0470537558”；w、 amznAsin=amznAsin；}）（）；