匠心不改,精益求精!
[ 登陆 - 注册 ]

相关分类

欢迎 卡布 的加入!

强制不换行p { white-space:nowrap; }自动换行p { word-wrap:break-word; word-break:normal; }强制英文单词断行p { word-break:break-all; }*注意:设置强制将英文单词断行,需要将行内元素设置为块级元素。span { display

当页面刷新时,引入的css 、js 文件为相同地址时,浏览器会默认读取缓存,在开发中,我们的文件是经常修改的pc端可以在 ctrl+f5 深度刷新来解决,但手机端就不好处理了解决方法,在引入的文件地址动态加入参数,这样浏览就会认为每次刷引入的是不同文件,而不会读取已缓存文件例:原引入css <link rel="stylesheet

<style>     .father{         width:100%;         background-color:red;

<!DOCTYPE html> <html lang="en"> <head> <meta charset="gb2312"> <title>Title</title> <style> .box

Media Queries能在不同的条件下使用不同的样式,使页面在不同在终端设备下达到不同的渲染效果。前面简单的介绍了Media Queries如何引用到项目中,但Media Queries有其自己的使用规则。具体来说,Media Queries的使用方法如下。@media 媒体类型and (媒体特性){你的样式}注意:使用Media Q

一句话概括,就是根据显示屏幕宽度的大小,自动的选用对应的类的样式 1、col是column简写:列2、xs是maxsmall简写:超小, sm是small简写:小,  md是medium简写:中等, lg是large简写:大;3、-* 表示占列数,即占每行row分12列栅格系统比;4、.col-xs-* 超小屏幕如手机

有时候我们需这样的向上箭头,用图片或字体图标都不方便,其实用css就可以demo1  一个倒3角<html> <head> <meta charset="UTF-8"> <title>Document</title> <style> .j

html代码<div class="item"><img src="/tpl/oli/block/product/img/product.jpg"></div>css代码 .item{ border:1px solid #eee;

图片相对父元素垂直居中, css3属性给父级元素设置display: -webkit-box;-moz-box-align: center;-webkit-box-align: center;-moz-box-pack: center;-webkit-box-pack: center;

2009年,W3C提出了一种新的方案--Flex布局,可以简便、完整、响应式地实现各种页面布局。目前已得到所有现在浏览器的支持。 flex浏览器支持一、Flex布局是什么?Flex是Flexible Box的缩写,翻译成中文就是“弹性盒子”,用来为盒装模型提供最大的灵活性。任何一个容器都可以指定为Flex布局。.box{  &n

1 单行溢出 display: block;  text-overflow: ellipsis;  white-space: nowrap;  overflow: hidden;2 多行溢出display: -webkit-box; -web

 .list{ white-space: nowrap; overflow: auto;}当多个li宽度超出时,不换行<div class="list"> <ul> <li> <img src="{$img}"/> <h2>{$data.t

/*单行*/.text1 {      width:200px;      overflow:hidden;      text-overflow:ellipsis; &

今天遇到这个问题,做一个左边固定尺寸,右边自适应网页布局,起初我是用js来记算控制又边的尺寸的后来发现,js的加载慢一些,网页打开会抖动一下,解决这个问题我又不想用css3,怕兼容性不好后面只用了css做了一下调整解决了这个问题,发现代更简单,兼容性也很好html代码<div id="main"