HTML＆CSS 0：写在前面

2018.07.03

星期二

我见你提及梦想时

眼里闪烁着耀眼的光芒

写在前面的前面

Chapter 1

我们现在每天都生活在网络的世界里，都在用手机、平板或是电脑在网上浏览新闻资讯、观看电影视频，享受网络带给我们的便捷和多彩。可我们是不是也想要了解一下网页所呈现出的绚丽多彩的内容是怎么设计出来的呢？我们想要自己设计一个页面又该如何来做呢？

巧在作为在学校工作的小小“青椒”一枚，今年带了一门非计算机专业的网页设计课程，于是想要整理出HTML和CSS的学习笔记，希望能给学习或想要了解网页设计的朋友或“童鞋”一些小小的帮助。

Z君，学完HTML和CSS能做点什么呢？

如果我说：「人人都应该要会 coding！ 」 你是不是会很烦！其实，面对如此简单易学的HTML和CSS，你的收获绝对大大超出你学习它的付出。

单位或部门总有一些网页版宣传海报或画册，如果我们自己能搞定，岂不是很酷。

工作中也总要在网站上发布一些新闻通知，往往网站后台自带的编辑器有点弱，我们可以在HTML页面进行调整，让我们发布的内容布局合理、整洁美观。

单位或是部门需要做一个网站，就算我们自己搞不定，那么单位里的技术人员或是开发人员也会爱死你的。你让他们觉得如此畅快的沟通是多么的爽。

能让自己的博客或是空间更加酷炫。

在单位里炫一下你coding的本领是不是也很爽。

还有…… dengdengdengdeng。

那么，该如何开始呢？

子曰“工欲善其事，必先利其器”。开始编写HTML代码前，我们该选择一款编辑工具，实际上，HTML作为标记语言，我们甚至可以直接用记事本来编写HTML代码，但记事本实在弱爆了。这里Z君推荐Dreamweaver或Visual Studio，当然，你也可以选择其它你习惯使用的编辑器，甚至可以使用在线的HTML编辑工具。

如果你不想深入或是继续学习相关的WEB开发，可以选择Dreamweaver，因为它可以用鼠标点点点，足够的简单易用，可以减少写代码的工作量。但这已是很对人反对用它的原因，用Dreamweaver做出的网页，冗余代码一大堆，因为是点鼠标配置出来的，不是我们自己编写代码实现的，所有肯定会有冗余，并且这样的代码极难维护。不过还是强烈建议自己编写代码。

相对于Dreamweaver，微软的Visual Studio（简称VS）就是个“庞然大物”。因为它集成了多种开发语言，如果你对开发感兴趣，去用一下VS，你一定会深深爱上的。

Visual Studio 2012

创建一个空网站

Chapter 2

01

打开VS，进入主界面。

02

【文件】→【新建】→【网站】

03

【Visual C#】→【ASP.NET空网站】→【浏览】选择存放的位置→【确定】

04

选中右侧“解决方案资源管理器”中的网站名称，单击右键→选中【添加】→点击【添加新项】

05

【Visual C#】→【HTML页】→自定义网页名称→【添加】

06

OK, 进入网页代码编辑界面

END

请看下节

如果您看完觉得有一点点的收获

请别忘了分享和转发，感谢您的支持

左手程序Z右手诗

关注一下 | 分享技术