博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
自适应网页制作总结
阅读量:6701 次
发布时间:2019-06-25

本文共 324 字,大约阅读时间需要 1 分钟。

1.百分比设置宽高,内外边距

2.宽和margin的百分比,依据父元素的宽度定标准
3.图片百分比定宽高,依据图片原来的宽高比,进行自适应。
4.使用固定宽高比的透明图片,可以方便实现子元素定宽高布局
5.使用字体大小vw单位,另加窗口变化的z-index:1来实现重绘
6.由于当前浏览器对于vw的控制不好,对于字体,还是弄成px单位定高,宽度自适应。字体自适应,得用js依据比例控制。

7.绝对定位以百分比,依据父元素的宽高。

总结,父元素定宽高,子元素有参考,文本定高宽度自适应。

如果想对未知宽高比图片进行统一宽高比,请用固定宽高比透明图片。

转载于:https://www.cnblogs.com/samwu/p/3393968.html

你可能感兴趣的文章
信号处理过程中的几种常见傅里叶相关的变换
查看>>
http请求
查看>>
客户资料查询传递数据格式
查看>>
C#开发之反射的简单使用
查看>>
[原创] Win7全自动精简批处理_绝对原创,绝对给力_感谢无忧给了我一年的潜水...
查看>>
2017 年热门编程语言排行榜,你的语言上榜没?
查看>>
poi 合并单元格、设置边框
查看>>
Hibernate延迟加载与opensessioninviewFilter
查看>>
Atitit 图像处理 调用opencv 通过java api attilax总结
查看>>
服务管理--systemctl命令
查看>>
SQLServer 维护脚本分享(09)相关文件读取
查看>>
去掉字段中多个带区号电话号码前面的区号
查看>>
Winscp开源的SSH|SFTP
查看>>
linux(centos 6)下记录所有用户的操作以及ip、时间
查看>>
Redis Pubsub命令用法
查看>>
用备份控制文件做不完全恢复下的完全恢复(全备<老>--备份控制文件<次新>--删除表空间andy--日志文件<新>)...
查看>>
闪回之 回收站、Flashback Drop (table、index、trigger等)
查看>>
V-rep学习笔记:碰撞检测与距离计算
查看>>
H264--1--编码原理以及I帧B帧P帧[4]
查看>>
关于Android中设置闹钟的相对比较完善的解决方案
查看>>