布局主题的文章列表，还有布局的技术要点_第7页

[css]flex布局

flex-direction 决定元素的排列方向flex-wrap 决定元素如何换行（排列不下时）flex-flowflex-direction和flex-wrap的简写justify-content &n...

代码星球 ·2021-01-09

flex布局space-between(around)最后一行左对齐

<ulclass="flexfwrapspace-between"><liv-for="(item,index)incourse":key="index">//todo</li><liv-show="course.length%4!=0"v-for="(item1,index1...

代码星球 ·2021-01-09

弹性布局之定宽剩下填满

<!DOCTYPEhtml><html><head><metacharset="utf-8"><title></title><styletype="text/css">#container{display:flex;width:500p...

代码星球 ·2021-01-09

rem自适应手机端布局

通过js根据屏幕设备尺寸的大小，改变根元素的值：<script>varhtml=document.querySelector("html");varrem=html.offsetWidth/7.5;html.style.fontSize=rem+"px";</script> 最简单的适...

代码星球 ·2021-01-02

弹性布局flex

flex有12个属性布局　　Flex是它可以简单、完整、响应式的实现各种网页布局，目前已经得到了大多数主流浏览器的支持，有关于它的兼容性可以在CanIuse中的查询到任何一个容器都可以指定为Flex布局文章中的内容主要借鉴自Flex布局教程by阮一峰学习地址为：http:...

代码星球 ·2021-01-02

Android软键盘弹出时把布局顶上去的解决方法

链接：http://blog.sina.com.cn/s/blog_9564cb6e0101g2eb.html决方法，在mainfest.xml中，对那个Activity加：<activityandroid:name=".activity.HomeActivity"Android:windowSoftInputM...

代码星球 ·2020-12-30

rem布局，根据不用设备分辨率更改跟字体大小

(function(win,doc){　　change();　　functionchange(){　　　　doc.documentElement.style.fontSize=doc.documentElement.clientWidth*20/320+'px';　　}　　win.addEventListener('r...

代码星球 ·2020-12-30

弹窗多内容，灵活布局计算方式总结

之前的礼物弹窗内容个数少，因此老代码的frame只能针对两页，判断条件也是常量，因此无法灵活增加，不支持更多页的扩展。最近的需求是扩充礼物数量，在修改时发现了当时的问题，意识到这种可能灵活变更的内容未来会有更多调整。所以这次直接将所有常量变更为表达式方式，做成支持N多页面的灵活布局方式。问题本不复杂，在计算...

代码星球 ·2020-12-30

移动端自适应：flexible.js可伸缩布局使用

http://caibaojian.com/flexible-js.html 阿里团队开源的一个库。flexible.js，主要是实现在各种不同的移动端界面实现一稿搞定所有的设备兼容自适应问题。实现方法：通过JS来调整html的字体大小，而在页面中的制作稿则统一使用rem这个单位来制作。关键代码如下：;(fu...

代码星球 ·2020-12-30

rem自适应布局的回顾总结

使用rem实现自适应布局，应该算是当前移动前端的一大趋势，有些人对此还有点迷惑，搞不懂rem是如何实现自适应布局，如何根据设计稿来调整rem的值？rem布局如何用雪碧背景图片？rem一定要加载JS吗？rem的根htmlfont-size设置为多少合适？看看这篇文章，也许能帮到你。这些问题整理来自之前发表过的文章，细心的...

代码星球 ·2020-12-30

rem是如何实现自适应布局的？

http://caibaojian.com/web-app-rem.html 使用rem然后根据媒体查询实现自适应。跟使用JS来自适应适配也是同个道理，不过是js更精确一点。使用媒体查询：html{font-size:62.5%}@mediaonlyscreenand(min-width:481px){htm...

代码星球 ·2020-12-30

浅谈前端移动端页面开发（布局篇）

http://www.xiaoxiangzi.com/Programme/CSS/4298.html 前言的一些碎碎念：最近一直在写移动端的页面，不过一直是用的别人造好的轮子，很多时候并没有想那是为什么，那是怎么样要那么写，就跟着别人的文档去了。本以为自己对移动端的那一丢丢理解，结果很多东西都特么有问题，所以...

代码星球 ·2020-12-30

CSS布局奇淫技巧之--各种居中

居中是我们使用css来布局时常遇到的情况。使用css来进行居中时，有时一个属性就能搞定，有时则需要一定的技巧才能兼容到所有浏览器，本文就居中的一些常用方法做个简单的介绍。注：本文所讲方法除了特别说明外，都是兼容IE6+、谷歌、火狐等主流浏览器的。先来说几种简单的、人畜无害的居中方法1.把margin设为auto具体来说...

代码星球 ·2020-12-30

页面布局

1、页面布局题目：假设高度已知，请写出三栏布局，其中左栏，右栏宽度各位300px，中间自适应。方法1：浮动<stylemedia="screen">html*{padding:0;margin:0;}.layoutarticlediv{min-height:100px;}&...

代码星球 ·2020-12-29

网页的排版布局和原则

一.网页排版布局的步骤：1.构思,并且有多个草稿进行粗略布局2.将粗略布局精细化，具体化3.修改二.网页排版布局的原则 1.平衡性　　(1)文字、图像等要素的空间占用上分布均匀　　(2)色彩的平衡，要给人一种协调的感觉。 2.对称性　　对称是一种美，我们生活中有许多事物都是对...

代码星球 ·2020-12-26