前言:刚刚接触css3的盒模型,感觉对于解决水平垂直居中、固定宽度/高度和可变宽度/高度同时存在这样的问题很有效。但是最近在看一个腾讯手机端框架(Frozen UI )的时候发现一个很神奇的多行文字截断的样式,感觉:我靠,怎么那么神奇,如下图

框了一下它的css,如下图:

我一看这貌似是盒模型的用法吧,但是不是说现在最新版本的都用display:flex吗,为啥还有display:-webkit-box的用法呢,而且之前也见ionic里面也是老的用法,那么问题来了,
1.盒模型现在用的多不,兼容性好不,还是说以后写css要尽量避开使用?
2.有么有什么通用的解决电脑网页的兼容的方法,有么有什么通用的解决手机端网页的兼容的方法?
3.由于好奇顺便问一下,多行文字截断css方面怎么解决?
以上,问完,收工~

css的盒模型手机端兼容写法应该是啥样的呢?的更多相关文章

  1. 利用Div+CSS(嵌套+盒模型)布局页面完整实例流程

    Div+CSS(嵌套+盒模型)布局页面完整实例流程: <!DOCTYPE html><html> <head>  <meta charset="UT ...

  2. CSS中盒模型的理解

    今天突然看到一篇关于CSS中盒模型的文章,忽然觉得自己竟然遗忘了很多小的地方,所以写一篇文章来记忆一下 (摘抄于千与千寻写的CSS盒子模型理解,并在自己基础上添加了一些东西,希望更完善,对大家有帮助) ...

  3. 前端设计的常用属性,CSS的盒模型,页面布局的利器

    在CSS和HTML结合布局页面的过程中,有一组被人们称为“盒属性”的CSS样式,被广泛的使用到.相信经常布局写页面的朋友们对盒属性一定不陌生.在CSS技术的发展过程中,盒属性也有了许多次改进,今天小编 ...

  4. 深入理解CSS弹性盒模型flex

    × 目录 [1]版本更迭 [2]display [3]基本概念[4]伸缩容器[5]伸缩项目 前面的话 CSS3引入了一种新的布局模型——flex布局.flex是flexible box的缩写,一般称之 ...

  5. css之盒模型

    盒模型由内容(content).填充(padding).边框(border).边界(margin)组成,一个盒子中主要的属性就5个:width.height.padding.border.margin ...

  6. CSS弹性盒模型flex在布局中的应用

    × 目录 [1]元素居中 [2]两端对齐 [3]底端对齐[4]输入框按钮[5]等分布局[6]自适应布局[7]悬挂布局[8]全屏布局 前面的话 前面已经详细介绍过flex弹性盒模型的基本语法和兼容写法, ...

  7. CSS 2. 盒模型|浮动

    1.盒模型 盒模型: 在网页中 基本上都会显示一些方方正正的盒子,这种盒子就被我们称为盒模型.重要的属性: width,height,padding,border, margin 盒子模型通过四个边界 ...

  8. CSS弹性盒模型flex概念

    盒模型分为:标准w3c盒模型.IE盒模型.以及css中的伸缩盒模型. 先说CSS的伸缩盒模型:flex模型是CSS3引入的新的布局模型,是flexible box的缩写,一般称之为弹性盒模型.和CSS ...

  9. css 06-CSS盒模型详解

    06-CSS盒模型详解 #盒子模型 #前言 盒子模型,英文即box model.无论是div.span.还是a都是盒子. 但是,图片.表单元素一律看作是文本,它们并不是盒子.这个很好理解,比如说,一张 ...

随机推荐

  1. matlab for 运算的提速

    [1]主要思想:matlab是按列存储,定义s(nums,1)比定义s(1,nums)要快哦                       需要重复query的元素看看能不能再for之前就定义好 经典案 ...

  2. Idea(三)常用插件以及快捷键总结

    idea常用插件以及快捷键 现在开发中和日常自己开发都统一换成了idea进行开发了.现在针对自己常用到的插件和快捷键进行总结记录下. 插件 Alibaba Java Coding Guidelines ...

  3. Jquery 中 $.getJSON的用法

    之前类似的方法用过 $.post, $.get,$.ajax,还是第一次用这个 $.getJSON. 前三个都是用作异步请求的,那么最后一个呢?其实也是异步请求的,和 $.get 最类似,因为他也是将 ...

  4. js小功能记录

    个人日常中遇到的js小功能记录,方便查看. /** * 判断是否包含字符串某字符串 * @param {[type]} str [被检测的字符串] * @param {[type]} substr [ ...

  5. QComboBox 树形视图选择

    QComboBox 控件支持树形图显示. A.  void QComboBox::setModel(QAbstractItemModel *model): B.  void QComboBox::se ...

  6. bzoj 3853 : GCD Array

    搬运题解Claris:1 n d v相当于给$a[x]+=v[\gcd(x,n)=d]$ $\begin{eqnarray*}&&v[\gcd(x,n)=d]\\&=& ...

  7. bzoj4784【zjoi2017】仙人掌

    题目描述 如果一个无自环无重边无向连通图的任意一条边最多属于一个简单环,我们就称之为仙人掌.所谓简单环即不经过 重复的结点的环. 现在九条可怜手上有一张无自环无重边的无向连通图,但是她觉得这张图中的边 ...

  8. Python之旅:集合

    Python数据类型 #作用:去重,关系运算, #定义: 知识点回顾 可变类型是不可hash类型 不可变类型是可hash类型 #定义集合: 集合:可以包含多个元素,用逗号分割, 集合的元素遵循三个原则 ...

  9. ECharts.js 简单示例

    ECharts.js学习(一) 简单入门 EChart.js 简单入门 最近有一个统计的项目要做,在前端的数据需要用图表的形式展示.网上搜索了一下,发现有几种统计图库. MSChart   这个是Vi ...

  10. RF parameter

    There are primarily 3 features which can be tuned to improve the predictive power of the model : 说明: ...