位置:七考网 > 计算机 > web前端 > web前端怎么布局网页  正文

web前端怎么布局网页

发布时间:2022-04-25 09:45:17来源:转载

Web前端开发就是创建Web页面,或者APP等前端界面呈现给用户的过程,通过HTML、CSS及JavaScript等衍生出来的各种技术、框架、解决方案,来实现互联网产品的用户界面交互。

web前端怎么布局网页?

Web前端的布局类型有这些:静态布局、流式布局、自适应布局、响应式布局;其如果只做电脑端,建议选择静态布局;如果做移动端,且设计对高度和元素间距要求不高,建议选择弹性布局。

1.静态布局:

不管浏览器尺寸具体是多少,网页布局始终按照初写代码时的布局来显示。常规的pc的网站都是静态(定宽度)布局的,也就是设置了min-width,这样的话,如果小于这个宽度就会出现滚动条,如果大于这个宽度则内容居中外加背景,这种设计常见于pc端。

2.流式布局:

布局特点是屏幕分辨率变化时,页面里元素的大小会变化而但布局不变。

3.自适应布局:

自适应布局的特点是分别为不同的屏幕分辨率定义布局,即创建多个静态布局,每个静态布局对应一个屏幕分辨率范围。

4.响应式布局:

布局特点是每个屏幕分辨率下面会有一个布局样式,即元素位置和大小都会变。

那么我们如何布局呢?通过以下几点来选择布局。

1.如果只做电脑端,好的选择是静态布局。

2.如果做移动端,且设计对高度和元素间距要求不高,那么弹性布局(rem+js)是好的选择,通过一份css+一份js调节font-size就搞定。

3.如果电脑端,移动端要兼容,而且要求很高,那么响应式布局还是好的选择。前提是设计根据不同的高宽做不同的设计,响应式根据媒体查询做不同的布局。

呼和浩特Web前端培训班简介
长沙火星时代web前端培训有什么特色?
珠海达内web前端教学质量如何?
石家庄达内web前端学费是多少?
珠海达内Web前端培训内容有哪些?
南京达内web前端培训费多少钱?

相关内容: web前端 web前端布局 web前端布局网页

同类文章