Answers:
您应该先盖房子，然后油漆。
即使看起来很乏味，HTML文档也可以独立存在。CSS样式表不能；除了显示指令外，它什么都不能显示（除了代码）。
这是一个不同的问题，在绘画过程中，您可能希望对房子进行更改。对于真正的房子来说通常是不可行的，但是在HTML + CSS开发中，通常会注意到需要在HTML文档中添加额外的标记以简化样式。（由于功能强大的CSS3选择器，它不像以前那样普遍。）
我总是先使用笔和纸，全尺寸纸，按比例绘制图纸。
那就是如果您不解决您的设计。如果您对自己的设计有信心，我会采取平衡的方法。html是结构，css是胶水。不断建立（HTML，CSS）概念“元组”。
(HTML,CSS) + (HTML,CSS) -> (bigHTML,bigCSS)
(bigHTML,bigHTML) + (bigHTML,bigCSS) -> (biggerHTML, biggerCSS)
等等。
无论如何，我就是这样做的。
在很大程度上取决于您创建的网站/ Web应用程序的类型以及将在其中使用上下文的类型。
在大多数情况下，最好的方法是构建语义上合理的HTML，然后为符合标准的浏览器添加CSS，然后应用非侵入性的黑客和规则（例如IE的条件注释，-vendor-somethingCSS规则，javascript遵从性层等）。 ）以支持非标准浏览器并启用特定于供应商的功能。
但是，有时您有一堆共享样式表的独立Web应用程序（例如，作为房屋样式的一部分），甚至可能处于控制每个HTML输出的奢侈位置。在这种情况下，先编写CSS，然后调整HTML以使其使用可能是更好的方法。如果你这样做，要走的路是先分析你会需要什么样的页面的元素，定义这些类，然后编写使用他们的一些静态的测试文档，编写样式表，只有再开始编写使用它们的应用程序。
不过，老实说，我怀疑这种奢侈的位置非常少见，很少有公司真正意识到CSS级别统一的房屋风格的价值。实用性通常会指示设计者做出房屋风格，然后为需要遵循的每个应用程序编写独立的样式表集。造成这种情况的主要原因主要是，大多数公司至少在部分堆栈中使用了修改可能性有限的现成软件，而且通常很难更改HTML输出以适合给定的样式表（对于一些专有软件包），而不是重写CSS。另外，维护一组样式表的工作量经常被低估，并且一些小的差异和怪异也被认为是可以接受的。
尽管这是一个非常古老的问答，但我仍对此有评论的必要和责任。
是的，HTML应该在CSS之前编写，但是...
您不会在页面上编写所有HTML，然后回去编写CSS。即使在适当的间距和注释的情况下，也很难在构建时清楚地记住这些部分。
您可以分层构建网站，就像在制作多层蛋糕一样。
第一层-首先，构建基础容器div，其最小高度和宽度为CSS。
第二层-然后构建下一层，即页面的较大部分（结构的div和样式），例如行或类似于列的部分。
第三层及以上-然后您继续在部分的第二层中添加。
通过这种方式，您可以编写一些HTML，添加然后使用CSS对其样式进行结构化，冲洗和重复。以我的经验，这是一种构建网页的更有效的方法，并且我认为比所有HTML优先选择要快得多。
最后，尝试使用“ * {outline：1px dotted red} ”来获取所有元素的轮廓，当您使用样式将它们添加到页面上时，您可以看到它们的轮廓，而不必担心猜测它的外观，直到您添加背景色。对于这种特殊用例，我避免使用边框，因为边框会在元素上添加像素，轮廓是覆盖层。
试试看，谢谢！
我认为，首先使用网站结构（HTML）更有意义，因为您随后将对元素有所了解，并为网站的样式和格式命名。
您已经为学习和构建选择了一个非常糟糕的框架。
这里有两个正交的问题。
这是两个非常不同的任务，可以（而且经常）需要不同的潜在冲突方法。
如果您熟悉项目的技能，技术和要求，那么首先要讨论站点的需求，然后进行设计练习以确定需要实现的内容。这通常意味着标记和设计内容，而这些内容通常与HTML或CSS无关（尽管有些人使用HTML和CSS进行模型制作）。
如果您想学习如何构建站点，同时还要构建站点，则必须进行探索和学习，然后才能知道甚至可以构建什么。
在这里，模块化的迭代设计和构建策略变得很流行。当您不一定知道最终产品的去向时（因为您不知道可能做什么），您可以构建一小部分功能，试验其是否满足您的要求，然后将该较小的试验合并到产品中。较大的整体。
那么，这实际上意味着什么呢？建造场地就像建造房屋一样，您可以在其中草拟建筑计划（设计模型），然后开始进行工程设计，以计算房屋是否能站立起来并满足您的审美需求。但是，构建站点可以（并且通常应该）看起来更像是进行一系列小型实验，并逐步采取措施来达到符合您原始概念的产品。
实际上，几乎每个人都同时使用HTML和CSS。
这是任何软件开发项目中的常见问题，因此，您可以从使用任何概念（例如快速原型开发，DSDM）中受益。可与任何样式结合使用，例如敏捷（极端编程或功能驱动设计（我最喜欢））。坚持一开始就决定的共同原则，并坚持下去（KISS，YAGNI）。
因此对我来说，它是：-首先构建一个基本的功能“原型”，涵盖需求的一个功能块限制自己进入“这可能不错” /“除非稍后，否则我可能需要稍后再使用”这些东西。告诉自己，您将不需要它！（YAGNI）。-写下您作为“编码约定”做出的决定，并坚持执行，例如php标签：我使用简短的决定，因为对于我的场景参数..适用，而...不适用。-添加基本样式，但再次限制自己。
然后扩展代码，直到获得涵盖更多功能块的更高级别的原型。与此相符，使您的css模型增长。一旦您遇到影响到您已经做过的所有事情的决定（您会做），请仔细阅读，做出决定，并在编码约定中写下为什么左移或右移。
“圈出”您的方式，以获得更成熟和最终的产品。
不必担心您可能会面临的重大决策，因为担心这些决策可能比花费固定的时间花更多的时间。此外，也不必担心互联网社区会皱眉，最终，当您拥有一款行之有效的产品时，您已经学到了很多东西，而富有想象力的不良源代码判断将使您更加满意接下来要构建的东西（请注意此处的迭代）。
只有我的50克拉
当您将网页与房屋进行比较时：
HTML =地基/房屋CSS =墙壁/蓝图/墙纸
您如何在半空中漂浮墙壁，直到建立它们所坐的基础？在编写要应用样式的HTML标记之前，如何编写CSS来样式化页面。
每段CSS都在样式化特定的HTML标签。这些标签必须存在才能对其进行样式设置。如果您没有要样式化的HTML，那么CSS文件应该为空，因为其中的任何样式都是多余的，因为它们实际上没有样式化任何内容。