从网上找了东西，发现都不适合自己的要求，也有纯css实现的，懒得看，大部分是基于js的，当然我的理念是能不用js就不用（这这是个个人怪癖，其实js也没什么，毕竟现在99%以上的浏览器都支持js了）。于是放慢了自己的脚步，自己研究一下吧。当然这里不是最完美的，至于哪里不完美，最后会给出。这里先给出代码。
<!doctype html>
<html>
<h
转载
2023-12-03 07:10:34
76阅读
思考1. 我们适配的目标是什么？ 2. 怎么去达到这个目标的？ 3. 在实际的开发当中使用？答案1. 让一些不能等比自适应的元素，达到当设备尺寸发生改变的时候，等比例适配当前设备。2. 使用媒体查询根据不同设备按比例设置html的字体大小，然后 页面元素使用rem做尺寸单位，当html字体大小变化元素尺寸 也会发生变化，从而达到等比缩放的适配。rem 实际开发适配方案① 按照设计稿与设备宽度的比例
转载
2024-07-20 19:24:59
37阅读
# Android 高度适配指导
在Android开发中，高度适配是一个重要的任务，确保应用在不同设备上能够拥有良好的用户体验。今天，我将指导你如何实现Android高度适配。整个流程可以分为以下几个步骤：
| 步骤 | 描述 |
|--------------|--------------------------
原创
2024-09-29 03:57:22
58阅读
响应式布局
Media Query 的使用方法
在上例中， 我们使用Media Queries来根据3种不同尺寸的窗口使用3种不同的样式。通过不同的媒体类型和条件定义样式表规则，媒体查询让CSS可以更精确作用于不同的媒体类型和同一媒体的不同条件。媒体查询的大部分媒体特性都接受min和max用于表达”大于或等于”和”小与或等于”。如：width会有min-width和max-widt
转载
2023-10-08 20:40:24
373阅读
一、PC端 和 移动端适配分析： 1、PC端的适配，只是分辨率的不同引起的适配问题。这种适配好解决，这里就不讲了。 2、移动端的适配，移动端的适配主要是： 屏幕视口的分辨率和像素分辨率是不统一；不同手机的视口 分辨率也是不一样的。二、（移动端）屏幕相关概念：（下面的概念只是按照个人的理解来写的，只是为了解决前端适配的而写的。其它的概念不用知道的那么清楚）
转载
2023-07-21 17:24:35
396阅读
css中添加屏幕自适应方法(rem)只需要在公共css文件中添加下面代码：设计稿以750px，基础字体为20px为例，兼容性高，使用过程中px转化为rem即可/*竖屏*/
@media screen and (max-aspect-ratio: /){
html {font-size:calc(100vw / * );}
@media screen and (min-width: 750px) {
转载
2024-05-07 18:32:22
109阅读
1、通过link方法 link方法引入媒体类型其实就是在标签引用样式的时候，通过link标签中的media属性来指定不同的媒体类型。这种方式引入媒体类型时常跟着引用的样式文件
原创
2021-07-22 18:01:41
213阅读
方法一通过JQuery，获取窗体的高度，设置给对应的div。代码如下：ht = $(document.body).height();
$("#mDiv").height(ht - 170);缺点：由于浏览器是先解析css，后执行JS，导致页面在加载时，mDiv先呈现其原始高度，再变为其全屏效果，div在页面中有一个闪烁。 方法二通过css的calc()函数实现，其中，1vh = one
转载
2023-06-08 11:02:40
1325阅读
CSS教程基础一、CSS 高度_cssheightDIV CSS高度基础知识这里的CSS高度是指通过CSS来控制设置对象的高度。使用CSS属性单词height。单位可以使用PX，em等常用使用PX（像素）为单位。实例：.yangshi{height:300px;}即设置了yangshi选择器对象高度为300px。CSS高度单词：height CSS 最大高度：max-height (IE7及以上
转载
2024-05-26 20:59:52
96阅读
关于css中的单位大家都知道在css中的单位，一般都包括有px,%,em等单位，另外css3新增加一个单位rem。其中px，%等单位平时在传统布局当中使用的比较频繁，大家也比较熟悉，不过px单位在进行自适应布局的过程当中则会有些力不从心，大部分的解决方案是使用%为单位配合@media媒介查询来进行自适应布局。不过还有另外一个css3新添加的单位也同样可以拿来进行自适应布局，在我看来这种方法也更加方
这段时间公司在做一个秀场直播类的APP，公司人手有限，把我这个做后端的叫去支援他们移动端，让我用这渣渣技术帮他们做几个H5界面，原生嵌入进去！害！！！这不是抢人家饭碗么，还是被后端抢的！刚开始我还觉得是没什么问题，毕竟也是做web出身的html、css、js底子还是有的，而且还能耍的一手VUE、Uniapp，自然没把这10来个H5界面放在眼里，不知道哪来的技术自信（哈哈）刚开始准备用VUE写的，之前用VUE写过一个棋牌游戏，但是前段时间刚好用Uniapp写过一个独立项目，觉得坑挺多的，但是写几个屌界面还是
原创
2022-12-01 17:22:57
594阅读
Unity2D入门—Pixel Adventure 1第二章 Unity窗口介绍及创建地形 文章目录Unity2D入门—Pixel Adventure 1前言一、Unity窗口1、窗口1—主控窗口（Hierarchy Window）2、窗口2—场景/游戏展示窗口（Scene/Game View）1 场景展示窗口2 游戏展示窗口3、窗口3—查看窗口（Inspector Window）4、窗口4—工程
PS：最近在做项目的时候，使用了NavigationController，遇到很多坑，今天在看了大部分的资料后总结出来的一些内容，还没进行实践，部分纯猜测，晚上回去再码Demo！
先上图： 官方文档说明： 看这里 （个人认为实际情况custom view的位置应该是在window之前和tabbar之后，最上层就还有状态栏。） 起因：由于设计师的对需求的严（jian）格（zhi）把（zu
转载
2024-08-11 10:13:43
140阅读
1.权重适配<span style="font-size:18px;">通过android提供的(权重)剩余空间分配，以达到适配的效果
注意：这是控件的宽或者高的尺寸要设置为0dp 权重值越大所占比例越大
<span style="font-family:'Times New Roman';font-size:14px;color:#000000;border-collapse:
转载
2023-09-15 17:22:05
68阅读
界面适配前言讲真的，在项目开发中，界面适配是非常重要的，在Android上面有俩个很火的界面适配库：AndroidAutoLayout和AndroidAutoSize，AndroidAutoLayou用起来感觉还是略有点麻烦；AndroidAutoSize我之前，在刚开始一个项目里面引入了，可是这个库的侵性太强，按照头条的适配原理去实现的，改变了：density 的值，这个值是个很重要的值：px
转载
2023-06-23 14:34:13
0阅读
viewpointcss3提供了一些与当前viewpoint相关的元素，vw，vh，vim等。“viewpoint” = window sizevw = 1% of viewport width
1vh = 1% of viewport height
1vmin = 1vw or 1vh, 最小
1vmax = 1vw or 1vh, 最大兼容性：chrome 20+/ safari 6+/ IE
转载
2024-01-15 00:40:05
79阅读
参考：http://www.25xt.com/appsizeiphone：===========*************APP图标：20px，29px，40px，60px／（@2x,@3x） 1024pxtablviewcell的默认高度------44p'x； statuebar:20，x以上44 --------navigationbar:44----tab
层叠样式表的优点更多排版和页面布局控制
可控制字号、行间距、字间距、缩进、编剧以及定位样式和结构分离
页面使用的文本格式和颜色可独立于网页主体（body区域）进行配置和存储样式可以存储
允许将样式存储到单独文档并将其与网页关联样式变得更小网站维护更容易配置层叠样式表内联样式
将代码直接写入网页的主体区域嵌入样式
在网页页头区域（<head></head>之间)定义外部样式
转载
2023-11-21 22:10:23
44阅读
# CSS 适配 iOS 的详细指南
作为一名开发者，确保你的网站在不同设备和操作系统上显示效果良好是非常重要的。特别是在 iOS 设备上，由于其独特的浏览器和渲染引擎，开发者需要一些特别的技巧来保证网页的兼容性。本文将引导你完成 CSS 适配 iOS 的全流程，并提供必要的代码示例。
## 流程概览
我们将整个适配过程分为以下几步：
| 步骤 | 描述
一、viewpoint缩放方案原理：在写CSS时完全按照设计稿来（如750px设计稿），页面开发好后在head标签内加上：<meta name="viewport" content="width={设计稿宽度}, initial-scale={屏幕逻辑像素宽度/设计稿宽度}" >代码：<script>
const width = 750
const adap
转载
2024-01-30 03:43:02
233阅读
