1.根据屏幕大小改变背景颜色 <style type="text/css"> /* 媒体查询可以根据不同的屏幕尺寸改变不同的样式 */ /* 屏幕最大宽度就是800像素 */ @media screen and (max-width: 399px) { body { background: pink ...
分类：
其他好文 时间：
2020-12-16 12:28:25
阅读次数：
3
一。通过CSS检测本机设备屏幕大小分配样式 1、最小尺寸分辨率1024*768（传统17寸显示器），则可以采用940px、960px、或者常用的980px作为最小宽度。 在可视区域的宽度小于 600px 的时候被应用。@media screen and (max-width: 600px) {.cl ...
分类：
移动开发 时间：
2020-10-31 01:25:31
阅读次数：
36
一:屏幕尺寸的区别 .col-xs- 超小屏幕 手机 (<768px) .col-sm- 小屏幕 平板 (≥768px) .col-md- 中等屏幕 桌面显示器 (≥992px) .col-lg- 大屏幕 大桌面显示器 (≥1200px) 一个栅格代表1，总共十二个。以上四个类分别表示当屏幕的宽度为 ...
分类：
其他好文 时间：
2020-09-18 02:33:05
阅读次数：
31
网页可见区域宽：document.body.clientWidth网页可见区域高：document.body.clientHeight网页可见区域宽：document.body.offsetWidth (包括边线的宽)网页可见区域高：document.body.offsetHeight (包括边线的 ...
分类：
其他好文 时间：
2020-08-04 18:18:07
阅读次数：
125
BootStrap有两种容器，.container和.container-fluid,一般情况下，如果内容比较多占据满屏直接用.container-fluid，不需要解决居中问题； .container根据不同屏幕大小宽度不同，内容居中显示，如果内容能占据整个.container的宽度也不需要解决居 ...
分类：
其他好文 时间：
2020-07-17 13:56:40
阅读次数：
61
<meta>标签 开发移动端项目需要使用视口标签<meta>来禁止缩放，页面显示时文字就不会变小了： 这是移动端屏幕适配问题解决过程中会遇到的一环（布局便是另一环）： 1、谷歌浏览器使用手机模式调试时，手机型号旁边是独立像素，各种手机屏幕大小看起来差不多，但像素分辨率区别很大，因为使用设备独立像素作 ...
分类：
移动开发 时间：
2020-06-20 16:07:53
阅读次数：
82
适配方面的问题: 1.测试问题：在大屏幕电脑上字体显示正常，小屏幕电脑字体显示太小。需求是不管设备屏幕大小，页面字体固定不变，始终是16px。 原因： pc端使用了rem布局，字体也使用了rem为单位，所以字体会随设备屏幕大小而变大或变小。 解决方法： pc端使用rem布局时，如果需求是页面字体固定 ...
分类：
Web程序 时间：
2020-06-12 11:09:24
阅读次数：
137
###对于一个页面来说，要怎么设计最主要是看你是用于什么的类型 ####如果是后台管理系统 一般都是一个屏幕显示，占据整个页面，有的时候要有一个页脚在屏幕最下面 这个时候可以给中间盒子设置绝对定位,页脚绝对定位，整个页面就全部填充 如果是超过一个屏幕大小的，可以用相对定位，或者不用定位，直接居中 # ...
分类：
Web程序 时间：
2020-06-08 12:41:55
阅读次数：
94
# 3.栅格系统 介绍的是 4.5.x版本 一行最多放12列 - class类介绍 最外层容器： 1.container-fluid：宽度100%,和body的宽度一样 2.container：宽度是一个具体数值，但是会根据用户屏幕大小来改变 行类 1.row：分行 列类： 5个响应层 后面的*表示 ...
分类：
其他好文 时间：
2020-05-28 23:13:20
阅读次数：
69
常见的布局方式 静态布局 常见于PC端，一般采用居中布局，以px作为单位给各元素设定固定的width，最外层div采用min-width限定最小宽度，当浏览器窗口小于min-width时会出现滚动条，移动端需要重新建新的页面。 优点：简单且没有兼容性问题 缺点：无法根据用户屏幕大小做出不同处理，目前 ...
分类：
其他好文 时间：
2020-05-24 16:40:19
阅读次数：
84
