关于前端布局的问题，如果只是静态页面的话都好，但是涉及到后台交互就有一些讲究了，请问都有哪些？_百度知道
关于前端布局的问题，如果只是静态页面的话都好，但是涉及到后台交互就有一些讲究了，请问都有哪些？
就是要根据后台读取数据的规律来写前端，比如说一行浮动最好都是fl而不是fl+fr这是为什么呢？还有一些别的吗？。。。我觉得我问的好像不是特别清楚，能看懂吗？
我有更好的答案
因为你做前端界面的话
在从后台调用了数据之后
也许会对你的界面结构造成或多或少的填充 你的预留或许不够显示所调用的数据
采纳率：64%
为您推荐：
其他类似问题
换一换
回答问题，赢新手礼包
个人、企业类
违法有害信息,请在下方选择后提交
色情、暴力
我们会通过消息、邮箱等方式尽快将举报结果通知您。404 Not Found
The requested URL /q/7861/ was not found on this server.前端写页面需要注意的一些事情
我是个很初级的程序员，只是总结了自己最近在公司实习的一些写静态页面与后台程序怎样才能更好地配合起来的一点经验，还望各位业界大神多多指点
1.整个页面在写之前首先应该先把大的框架搭出来，在去写里面小的细节。保证大的框架没有问题，里面有问题，大不了删了重写。（给大的框架加上background测试是最直观看到大框架是否正确的方式）
2.整个页面的布局，要尽可能的灵活，因为所有的元素都是不定高的，这是由于，后台要加什么东西前台页面是不知道的，如果写的很死，那么后台在写程序的时候，就会把页面撑乱，这是不可取的。
3.清除浮动的问题，一定要记住。
4.兼容性问题，平时有时间一定要多了解各种浏览器的hack，及解决方法。
5.前端写页面，必不可少的是注释，而且注释一定要清晰明了，HTML页面和CSS样式表都要写注释，注释对自己和后台程序人员都是非常重要的。
6.命名问题，一定要有一个命名规范，因为页面不是只有一个，通常一套网站会有好几个页面去写，那么命名的规范性就显得尤为重要，例如：网页头部，命名是不能都叫head，因为他们是共用一个CSS样式表的，要有所区分，首页头部，就叫index_head，列表页头部就叫list_head，总之，命名的规范性和区别一定要注意。
7.公共部分，能共用的，一定要写成公共区域，不要重复写一些相同的代码，代码应该尽量的简洁。
还有我想说的就是，程序员一定要戒骄戒躁，平常心是最重要的，遇到不会的问题，静下心来，不要着急，按照层级关系，一级一级的往上去找。遇到问题就解决，不要逃避，有问题是好的，问题及早出现，才能避免以后的错误。所有的事情，都是经验使然。
没有更多推荐了，又一份不太合格的前端静态页面
今天的这份静态页面，是“先行成员 -- 涛”的作业。
先说第一个问题，打开目录我就皱眉，看图，
css文件为什么直接放在根目录中？
html文件为什么叫11.html？
颜色值为什么不是6位颜色代码？
整个页面都放在一个大div里？
看class的名字是:nav，但怎么把滚动轮播广告也算到nav导航里了？这页面结构划分的不对。并且这个nav并没有左右居中。
所有的li标签，css中的list-style:none，没有设置。导致到处都是li的小黑点。
页面的绝对定位，定位不准，当页面缩小的时候出现错位。
就看到这吧，这个页面没有再看下去的必要了。
涛同学，我不知道你能不能看到这篇推文，你的页面我只是扫了一眼就发现了如此多的问题。也许这是你的真实水平，也许只是你随便做做。但不管怎么说，我希望你下次提交页面的时候，能比这一次的好一些。
责任编辑：
声明：该文观点仅代表作者本人，搜狐号系信息发布平台，搜狐仅提供信息存储空间服务。
今日搜狐热点https://fisher-zh.github.io
经验总结——静态页面布局中的常见问题
作为一个web前端的初学者，在静态页面的布局中经常会遇到许多的问题，现在把自己遇到的一些问题及解决方法分享给大家，希望对大家能够有帮助，错误之处还望指正！1、用&div&包含一个&img&标签时，&img&标签里面的图片下会有一条白色的缝隙解决方法：因为&img&标签默认是底部对齐，此时只需要给&img&标签加一个display：block的属性将其转换为块状元素即可。2、使用列表制作二级导航的时候，二级列表会相对于一级列表有一定的偏差解决方法：将二级列表设为绝对定位并且清楚浮动即可3、关于电脑端页面的布局，由于现在电脑端和手机端的UI基本都是分开来制作，所以在进行电脑端页面布局的时候保证正常的分辨率的情况下显示正常即可，如果使用百分比布局所有的元素单位都要使用百分比，否则在页面大小发生变化的时候不同块会发生一定程度的偏移。4、关于布局时候的居中问题，line-height是内容的垂直居中而不是元素的垂直居中，元素的垂直居中可以利用内联元素设置vertical-align:middle来实现，在确定高度的情况下也可以通过设置margin或者padding来实现。5、关于absolute的相对位置的问题当使用absolute定位的时候，其相对位置是以上一级有position的元素的位置为基准的，上一级中没有则上上一级，依次，直至到body元素，则以body元素的位置为基准。6、同时使用vertical-align和line-height对于元素位置的影响解决方法：当文字和图片处于同一行的时候，设置vertical-align：middle和line-height：center并不能使文字和图片都处于中间从而实现文字和图片的居中对齐。
此时让上级元素的高和图片的高相同，在图片属性中设置vertical-align：top，同时设置文字的height和line-height即可居中。
7、浮动的清除方法
（1）空标签方法：使用一个空标签设置其属性为clear：both，或者直接调用clearfix类（clearfix类的写法在下面）
（2）overflow：hidden加在浮动的块的上一级属性中
（3）clearfix方法，将clearfix类直接加在浮动元素的父级元素上即可。
clearfix代码：
.clearfix:after {
content:"";
.clearfix {*zoom:1;}
8、IE浏览器中使用a标签套img标签会出现边框的问题
解决方法：设置img和a标签的border：0即可
9、z-index的使用
z-index只能在position属性值为relative或absolute或fixed的元素上有效。
z-index值只决定同一父元素中的同级子元素的堆叠顺序。父元素的z-index值（如果有）为子元素定义了堆叠顺序（css版堆叠“拼爹”）。
向上追溯找不到含有z-index值的父元素的情况下，则可以视为自由的z-index元素，它可以与父元素的同级兄弟定位元素或其他自由的定位元素来比较z-index的值，
决定其堆叠顺序。同级元素的z-index值如果相同，则堆叠顺序由元素在文档中的先后位置决定，后出现的会在上面。
所以如果当你发现一个z-index值较大的元素被值较小的元素遮挡了，请先检查它们之间的dom结点关系，多半是因为其父结点含有激活并设置了z-index值的position定位元素。
没有更多推荐了，}