-
css3 flex实现div内容水平垂直居中的几种方法
所属栏目:[系统] 日期:2020-03-29 热度:156
副标题#e# 一、flex-direction: (元素排列方向) ※ flex-direction:row (横向从左到右排列==左对齐) ※ flex-direction:row-reverse (与row 相反) ※ flex-direction:column (从上往下排列==顶对齐) ※ flex-direction:column-reverse (与column[详细]
-
css3媒体查询中device-width和width的区别详解
所属栏目:[系统] 日期:2020-03-29 热度:171
定义:定义输出设备的屏幕可见宽度。 不管你的网页是在safari打开还是嵌在某个webview中,device-width都只跟你的设备有关,如果是同一个设备,那么他的值就不会变。 比如iphone6的device-width*device-height为375*667,而跟他的dpr等无关。 2.width 定义[详细]
-
CSS 漂亮搜索框美化代码
所属栏目:[系统] 日期:2020-03-29 热度:66
效果图: 实现这种效果有两种方法:一是整体处理一个背景,以透明gif图的方式定位到搜索框,或者切分开,这种方法加载快,而且灵活性更高。 文中用到的图片 提示:您可以先修改部分代码再运行[详细]
-
css3 中translate和transition的使用方法
所属栏目:[系统] 日期:2020-03-29 热度:188
translate和transition一直让我觉得,很牛皮很强大,怎么也学不会,其实是自己比较抗拒去了解她,接口看了不到半个小时的文档,大概了解了下,下面是示例,可以下载下来自己运行下试试 !DOCTYPE htmlhtmlhead titletranslate和transition/title/headbodyst[详细]
-
浅析CSS3 中的 transition,transform,translate之间区别和作用
所属栏目:[系统] 日期:2020-03-29 热度:187
transform 和 translate transform指变换、变形,是css3的一个属性,和其他width,height属性一样 translate 是transform的属性值,是指元素进行2D变换,2D变换就是指,元素以当前位置(0,0)按照x轴的方向移动多少,按照y轴的方向移动多少 例如: transfo[详细]
-
手机定位的基本原理
所属栏目:[系统] 日期:2020-03-26 热度:136
目前智能手机的使用已经越来越普遍,手机定位也是手机上的一个核心基础功能。举一个常见的应用如叫车,司机需要知道你在哪里,同时打车软件也需要基于司机和乘客的位置规划一条路线,让司机更高效的行驶到用户这里。这就是典型的定位服务的应用。当然,除[详细]
-
微信最新功能体验一览!除了深色模式,语音转文字也更方便了
所属栏目:[系统] 日期:2020-03-26 热度:181
副标题#e# 这次微信更新的 iOS 新版本,亮点不只有「深色模式」。为了帮助大家更好地了解此次更新内容,我们将最新的微信 7.0.12 for iOS 与 7.0.11 版本进行了对比。 懒人目录 可跟随系统设置,切换为深色模式 微信群新增「群工具」 发送语音时上滑转文字[详细]
-
终于带了点干货!Android、iOS 又更新:这些功能都来了
所属栏目:[系统] 日期:2020-03-26 热度:71
今天,Android 和 iOS 迎来了较大的版本更新。 前者发布了 Android 11 开发者预览版的第二个版本(DP2); 后者推送了 iOS 13.4 最终测试版(GM)。 对于普通用户而言,两个新版本都不推荐使用,毕竟是测试版。 但正式版迟早都会到来,提前了解更新内容准是没有[详细]
-
探讨 | 无服务器架构的下一步是什么?
所属栏目:[系统] 日期:2020-03-21 热度:166
副标题#e# 将逻辑和数据自动分发到边缘将为用户带来更小的网络延迟,而无需开发人员进行配置和扩展。 无服务器服务无处不在。无服务器产品向新的编程方式发展的驱动力来自各种形式的产品,其中包括应用程序托管平台、无服务器数据库、内容分发网络(CDN)、安[详细]
-
看完这篇Nginx介绍,你也可以配置属于自己的网站
所属栏目:[系统] 日期:2020-03-21 热度:142
副标题#e# 最近在部署自己的网站(racsky.com)时,使用了Nginx的服务反向代理,并且记录了过程与大家分享,相信这篇文章能够帮助到你。 Nginx介绍 Nginx是一款轻量级、高性能的反向代理Web服务器,有着占有内存[详细]
-
纯CSS3实现3D旋转书本效果
所属栏目:[系统] 日期:2020-03-20 热度:95
副标题#e# 有一些前沿的电商网站已经开始使用3D模型来展示商品并支持在线定制,而其中图书的展示是最为简单的一种,无需复杂的建模过程,使用图片和CSS3的一些变换即可实现更好的展示效果,简洁而实用。 书本的3D模型是所有商品中最为简单的,因为其本质上[详细]
-
CSS设置DIV垂直居中的N种方法 兼容IE浏览器
所属栏目:[系统] 日期:2020-03-20 热度:172
副标题#e# 在说到这个问题的时候,也许有人会问CSS中不是有vertical-align属性来设置垂直居中的吗?即使是某些浏览器不支持我只需做少许的CSS Hack技术就可以啊!所以在这里我还要啰嗦两句,CSS中的确是有vertical-align属性,但是它只对(X)HTML元素中拥有v[详细]
-
CSS制作三角形广告引导文字效果
所属栏目:[系统] 日期:2020-03-20 热度:137
副标题#e# 街上经常碰到一些发各类广告传单的,有一次收到一张房地产广告的传单,顺手留下来,看着里面有些广告挺吸引人,同时也想练练自己css技术,故抽空做了一下。 原图某区域如下: 实现上图效果是需要一些想象力的,比如三角形的构成和左右两边的空白[详细]
-
利用CSS的Sass预处理器(框架)来制作居中效果
所属栏目:[系统] 日期:2020-03-20 热度:135
副标题#e# 虽然使用 CSS 创建居中效果需要耍一些花招,特别是垂直居中效果,但我认为由此生出的诋毁,对于 CSS 则是不公平的。实际上我们有太多的方式使用 CSS 创建居中效果了,而且作为一名前端开发者,你真的有必要对其中的原理了解一二。 写这篇文章的目[详细]
-
iOS13.4beta5体验分享,7P流畅性有所提升
所属栏目:[系统] 日期:2020-03-19 热度:151
【金融特辑】光大****科技部DBA女神带你从0到1揭秘MGR iOS13.4beta5体验分享 今天凌晨苹果发布了iOS13.4第五个测试版,但是依旧没有更新太多的东西。版本号:13.4(17E5255a)。 本次体验设备为:iPhone11Pro Max、iPhoneX、iPhone7Plus 本次体验分享由于我的[详细]
-
如何清洁你的 iPhone 和 AirPods ?苹果的官方教程来了
所属栏目:[系统] 日期:2020-03-19 热度:88
【金融特辑】光大****科技部DBA女神带你从0到1揭秘MGR 数码产品的清洁一直是个很大的难题。很多设备都有金属部分,需要连接电源,一些清洁剂可能不适合使用。同时数码设备又是和人们「亲密接触」最多的产品之一,不管是为了卫生还是美观,定期清洁数码设备[详细]
-
企业微信的掣肘与野望
所属栏目:[系统] 日期:2020-03-19 热度:61
【金融特辑】光大****科技部DBA女神带你从0到1揭秘MGR 企业微信的名头足够响亮,能为市场部一年能省下几千万的推广费用,可使用过且能够用的好的企业却凤毛麟角!对于企业微信,除了产品本身的交互逻辑不够清晰、应用学习成本高、生态匮乏之外,还有更大的问[详细]
-
欧美移动支付APP崛起:当“另类支付”不再另类
所属栏目:[系统] 日期:2020-03-19 热度:197
【金融特辑】光大****科技部DBA女神带你从0到1揭秘MGR 说起另类支付(alternative payments)/替代支付,在2019年之前,PayPal可能是第一个真正的另类支付选择。 这里的另类 是指,除了主要的支付方案(如Visa和MasterCard)或占主导地位的国内信用卡选项外,你[详细]
-
css解决display:inline-block;产生的缝隙(间隙)的方法
所属栏目:[系统] 日期:2020-03-19 热度:78
今天在做H5的水平滑动卡片时用到了display:inline-block;却发现处在同一水平线上的元素之间居然产生了缝隙,这很显然不是我想要的效果,所以我就换成了左浮动,这样缝隙的问题是解决了,但是需要设置父元素的宽度才能实现水平左右滚动,这样又增加了代码量[详细]
-
CSS3实现跳动的动画效果
所属栏目:[系统] 日期:2020-03-19 热度:142
这个要运用的新知识如下: 复制代码 代码如下: //css3新知识 display: flex; justify-content: center; align-items: center; animation: shadow .5s linear infinite; @keyframes shadow { 0%, 100% {transform: scaleX(1);} 50% {transform: scaleX(1.2)[详细]
-
margin 负值引起的层级(z-index)问题
所属栏目:[系统] 日期:2020-03-19 热度:126
先来看这么一段代码: 复制代码 代码如下: div div mce_style="background-color:Red;margin-top: -5px " a href="https://www.jb51.net/" mce_href="https://www.jb51.net/"脚本之家/a/div /div IE6和IE7下,内层的容器被外层覆盖,如图所示: 在IE8和ff下[详细]
-
比较全的CSS浏览器兼容问题整理总结
所属栏目:[系统] 日期:2020-03-18 热度:111
CSS对浏览器的兼容性有时让人很头疼,或许当你了解当中的技巧跟原理,就会觉得也不是难事,从网上收集了IE7,6与Fireofx的兼容性处理方法并 整理了一下.对于web2.0的过度,请尽量用xhtml格式写代码,而且DOCTYPE 影响 CSS 处理,作为W3C的标准,一定要加 DOCTYPE声[详细]
-
主流浏览器css兼容问题汇总
所属栏目:[系统] 日期:2020-03-18 热度:171
副标题#e# 现在就post一些做兼容的总结,可能不够全面,但是可以告诉大家如何避过一些坑。主要测试了chrome,firefox,ie8、9、11,360浏览器。 一、基本的css兼容: 1、可能很多人喜欢用css hack的形式去兼容ie浏览器,但是我自己用起来感觉其实不好使 。i[详细]
-
深入理解CSS选择器优先级
所属栏目:[系统] 日期:2020-03-18 热度:175
1.类的覆盖顺序和应用的时候引用的顺序没关系,覆盖顺序取决于类定义的顺序 例如: CSS Code复制内容到剪贴板 .a{ color:red } .b{ color:green } 由于b晚于a定义,所以b覆盖a,反之则a覆盖b 2.类选择器优先级大于标签选择器 例如: CSS Code复制内容到剪[详细]
-
全面总结使用CSS实现水平垂直居中效果的方法
所属栏目:[系统] 日期:2020-03-18 热度:143
副标题#e# 说起水平垂直居中大家常看到的是使用绝对定位与负margin的配合或者是inline-block配合vertical-align:middle等方法。当然还有其他一些解决方案,比如说,在水平垂直居中系列中介绍了一些制作方案。但这些方案或多或少都存在一些局限性。假设,要[详细]
