布局的时候这两项怎样做才更方便呢

个回答

redrain_lin

2015-12-31 20:55:56

额。流程上应该先写完结构再写样式。这样算是统领全局吧。速度上也算快的。如果一边写结构一边写样式，没有全局意识很容易后面写的样式对前面产生干扰。而且来回的看结构与样式我觉得很浪费时间，纯粹是我的工作体会。不具代表性，你应该能在实际工作中理解才对。

0
augushong

2015-12-31 18:00:57

一般来讲在用代码做网页的时候，
首先考虑页面样式的布局（这个地方是什么内容、那个地方是什么内容，心里有个样子，）但不考虑样式的实现（不写任何代码）；（就是说心里有个数，简单从纸上画几个框框就行，一般来你的方案书里都已经有了简单的布局，我想你是问的“边开发边设计边实现”这样自己折腾着制作方式。）
然后考虑页面内容的结构（这个地方是题目、那个地方作者信息）并以<div></div>的方式表示出这些结构但不考虑<div></div>容器内的实际内容；（就是说找一堆大小不一样的瓶子——特指<div>容器，把瓶子放好，哪个小瓶子在哪个大瓶子里面，瓶子不需要填充内容，也可以稍微填一下描述性的东西，类似于：“这里是个标题”、“这里是作者信息”。现在建立html文档，在文档里放置<div>，对每个<div>元素设置类名称或id，便于知道每个容器的内容是什么，也便于用css控制。）
当你把页面内容的结构设计完成，便往每个容器里填入描述性的文字，比如：“这是一个标题”、“这是主要内容这是主要内容这是主要内容这是主要内容这是主要内容这是主要内容这是主要内容这是主要内容这是主要内容这是主要内容”。
现在另建立一个css文档并引入到该html里，两个文档同时打开，开始控制每个容器样式。
举个例子：
第一步：
一个神奇的页面布局计划书登场
1：文章标题
2：文章内容
3：作者信息
P.S.有很多框框，有很多编号，用很多对编号的解释，好吧，不多，就三个
第二步：
一堆html代码，但我省略了很多，你知道我省略了哪些
```
......
<body>
    <div id="title">
        这里是要放文章的标题的
    </div>
    <div id="main_contents">
        <div id="passage">
            这里是要放文章的内容的这里是要放文章的内容的这里是要放文章的内容的
            这里是要放文章的内容的
        </div>
        <div id="info_abot_wtr">
            这里是要放作者的信息的
        </div>
    </div>
</body>
```
注：我是先写了标签，然后写了id,然后填充的描述性内容。
可以标签和id一起写，但我个人觉得一起写很不爽，既要考虑结构，又要给每个结构起名字，不如先把东西摆好，然后再给起名，这样还可以检查一下刚刚的结构有没有不合理的地方。
有的人会发现在方案图里，只有三个框框，为什么代码用了四个<div>容器呢？是这样的，搞设计的人可能不太了解html页面内容的结构，只是把内容的位置画了出来，而在html结构里，我们认为2和3是统一级的（同一个层次），所以要把2和3在结构上放到同一级，所以在2和3外还有一个容器。
用图解释，是这样的：甲图是表示单纯的理解方案图，乙图是按照页面内容结构的表示

显然，单纯按照方案图的位置做页面内容的结构，不好，很不好。

第三步：
新建一个css文档，引入到html里面，这个就不用做了，写id名称控制就够了。

最后一步：填充内容。
1：如何追女孩
2：不要脸
坚持
坚持不要脸
3：没追到女孩子的单身贵族

好了，一般自己做小网页，自己折腾的话，可以这样做。如果认真起来写计划书什么的，按照计划书来就是了。

1
慕男婶

2015-12-31 17:02:33

这个我估计没有一个标准的答案，个人有个人的习惯跟方法论。
说说我的，我是写完所有内容，在写样式。
这样我认为会很快，且不容易出问题。写结构的时候不会被样式干扰，写样式的时候所有结构也都写好了。

0