ljw_Josie的博客

bug表现目前发现iPhoneX， iPhone11 pro， iPhone12 pro 等个别机型对强制不换行的样式失效。解决方案（亲测）使用CSS box-orient 属性/* Firefox */display:-moz-box;-moz-box-orient:horizontal;/* Safari、Opera 以及 Chrome */display:-webkit-box;-webkit-box-orient:horizontal;/* 这句别漏了，毕竟大部分场景适用

现象：文本超出隐藏，省略号发生了遮挡和错位解决办法:删除text-align: justify;当初是为了文本两端对齐视觉上好看些才加的，没想到这行css会在文本超出隐藏的时候出现这样的错位。去除样式后恢复正常...

先来看一下效果图：简单粗暴上代码：html： less: .dialog-box { position: relative; span {

原文： Quick Tip: The Best Way To Make Sticky Footers问题：在布局网页的时候时常遇到页面内容太少，网页撑不开导致footer浮上去。非常不美观，网上各种说法，说是position:absolute;或者position:fixed；都不能满足我的需求（body内容少的时候），也许是我方法不对吧（自嘲ing···）解决办法：最好方法是采用

如上图，我们要实现中间的三角箭头，我这里总结了三种实现方式：第一种：你可以将非矩形的地方切成图片来处理，放在div里，这样上面的图形会有5个并列的div，可以采用浮动来实现效果第二种：我们将这个进度条（我也不知道叫啥）分成一个一个的div，最外面用bootstrap的栅格col-md-6，col-md-3，col-md-3来包裹，分别对应上图中的三个最外层的div（红色）；

经常会遇到字体图标比文字小，但是要居中显示。或者是图片要和文字居中的问题，当浮动，line-height，margin,padding都失效的时候，不妨试试这个方法，99%的成功率哦~对要居中的对象本身设置：position:relative;这个属性，他会相对原来的自己进行位置改动，然后你再使用top，left值来改变它的位置就好啦。还有一种如下午，就是常见的浮动之后，再根据margin

用img标签来设置背景图片，无论你怎么给border加样式都会发现一条摆脱不掉的边框，这是浏览器为了识别img标签自带的一个类似于“占位符”的标记，就是为了告诉这里有张图片。没啥作用。怎么消除这条边框呢？最佳解决办法：你换个标签呗，不就是显示一张背景图么？干嘛非要用img标签？或者加一句css，使他没有src的时候透明度为0就可以了。 img[src=""]{ ...