一、媒体查询用法 @media 媒体查询包含一个可选的媒体类型和，满足CSS3规范的条件下，包含零个或多个表达式，这些表达式描述了媒体特征，最终会被解析为true或false。如果媒体查询中指定的媒体类型匹配展示文档所使用的设备类型，并且所有的表达式的值都是true，那么该媒体查询的结果为true. ...
分类：
其他好文 时间：
2020-07-11 10:02:43
阅读次数：
71
link属于XHTML标签，除了加载CSS外，还能定义rel连接属性等作用，而@import是CSS提供的，只能用于加载CSS。 页面被加载时，link会同时被加载，而@import引用的CSS会等页面被加载完再加载。 import是CSS 2.1提出的，只在IE5以上才能被识别，存在兼容问题，而l ...
分类：
其他好文 时间：
2020-07-08 23:24:51
阅读次数：
111
前言 在移动端web开发中，UI设计稿中设置边框为1像素，前端在开发过程中如果出现border:1px，测试会发现在retina屏机型中，1px会比较粗，即是较经典的移动端1px像素问题。 我们要对与视口、物理像素、逻辑像素、设备像素比、css像素等移动端基本概念要有一定的了解。 产生原因 设备像素 ...
分类：
移动开发 时间：
2020-07-03 19:41:31
阅读次数：
103
为什么要写自适应的页面（响应式页面）？ 众所周知，电脑、平板、手机的屏幕是差距很大的，假如在电脑上写好了一个页面，在电脑上看起来不错，但是如果放到手机上的话，那可能就会乱的一塌糊涂，这时候怎么解决呢？以前，可以再专门为手机定制一个页面，当用户访问的时候，判断设备是手机还是电脑，如果是手机就跳转到相应 ...
分类：
Web程序 时间：
2020-07-03 19:19:56
阅读次数：
214
@media screen and (min-width: 320px) { html { font-size: 8.5333px !important; } } @media screen and (min-width: 360px) { html { font-size: 9.6px !impo ...
分类：
移动开发 时间：
2020-06-28 20:31:08
阅读次数：
214
想必近几年前端的数据可视化越来越重要了，很多甲方爸爸都喜欢那种炫酷的大屏幕设计，类似如下这种： 遇到的这样的项目，二话不说，echarts或者antv，再搭配各种mvvm框架（react，vue），找二次封装过的组件，然后开始埋头开始写了，写着写着你会发现，如何适配不同屏幕呢？css媒体查询吧，用v ...
分类：
其他好文 时间：
2020-06-24 12:27:05
阅读次数：
224
pc端常用电脑屏幕 （(响应式PC端媒体查询)电脑屏幕分辨率尺寸大全） PC端************ 按屏幕宽度大小排序（主流的用橙色标明） 分辨率 比例 | 设备尺寸 1024*500 （8.9寸） 1024*768 （比例4：3 | 10.4寸、12.1寸、14.1寸、15寸; ） 1280* ...
分类：
其他好文 时间：
2020-06-08 00:46:44
阅读次数：
58
使用css3 的媒体查询功能 @media print{ .header,.left { display:none !important; } } .header,.left这些class的元素还是会在页面上，但不会出现在打印的预览里。这样调用window.print()时就可以实现局部打印了。不过 ...
媒体查询：针对不同的媒体类型定义不同的样式！ 常见的媒体类型 1.screen:用于电脑屏幕，平板电脑，智能手机 2.speech:应用于屏幕阅读器等发声设备 3.all:用于所有设备 常见的媒体功能 1.max-width:定义输出设备中网页最大的可见区域宽度 2.min-width:定义输出设备 ...
分类：
移动开发 时间：
2020-05-22 21:13:38
阅读次数：
79
“你的问题主要是读书不多而想得太多” 我就是这种不读书、没干货，遇到问题缺少实践的人~十分羡慕那些会写博客的人，就我来说，写一遍文章简直要比女人生孩子还要难受，半天憋不出一个字~哎，无奈肚子里没有墨水。罢了，直接入主题。 最近为了体验移动端开发做个了在线播放器，其实就是加了个媒体查询~，这是demo ...
分类：
Web程序 时间：
2020-05-22 09:53:44
阅读次数：
74
