1. 父窗口宽度不定,要求内部两个子块, 第一个子块宽度固定,第二个子块宽度自适应。

  第一个子块宽度固定,定位为绝对定位 position:absolute;  第二个子块设置margin-left即可。

2. 如果内容太长,多余的部分用...代替

  

.dingdan-longmsg{
    display:block;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
  }

  

3. 设置谷歌浏览器滚动条的样式

::-webkit-scrollbar{
padding-left:1px;
font-weight:bold;">#fafafa;
overflow:visible;
width:9px;
}
::-webkit-scrollbar-thumb{
font-weight:bold;">rgba(0, 0, 0, .1);
background-clip:padding-box;
border-left-width:2px;
min-height:10px;
box-shadow:inset 1px 1px 0 rgba(0, 0, 0, .1),inset 0 -1px 0 rgba(0, 0, 0, .07);
}
::-webkit-scrollbar-thumb:vertical:hover{
font-weight:bold;">rgba(0, 0, 0, .2);
}
::-webkit-scrollbar-thumb:vertical:active{
font-weight:bold;">rgba(0, 0, 0, .2);
}
::-webkit-scrollbar-button{
height:0;
width:0;
}
::-webkit-scrollbar-track{
background-clip:padding-box;
border:solid transparent;
border-width:0 0 0 2px;
}
::-webkit-scrollbar-corner{
background:transparent;
}
::-webkit-scrollbar-track-piece{
margin: 10px 0;
-webkit-border-radius: 0;
-webkit-border-bottom-right-radius: 4px;
-webkit-border-bottom-left-radius: 4px;
}

  

4.ios 去除input框阴影
input{
-webkit-appearance: none;
}

5. 单边阴影
  
.top {
box-shadow: 0 -4px 5px -3px red;
}
.right {
box-shadow: 4px 0 5px -3px green;
}
.bottom {
box-shadow: 0 4px 5px -3px blue;
}
.left {
box-shadow: -4px 0 5px -3px orange;
}

  上面的代码调整了阴影的位移量,新增了box-shadow的扩展半径。

 

CSS 特殊样式设置集合的更多相关文章

  1. 四大伪类,css鼠标样式设置,reset操作,静止对文本操作

    07.31自我总结 一.a标签的四大伪类 a:link{样式} 未访问时的状态(鼠标点击前显示的状态) a:hover{样式} 鼠标悬停时的状态 a:visited{样式} 已访问过的状态(鼠标点击后 ...

  2. css 字体样式设置大全

    css样式大全(整理版)   字体属性:(font) 大小 {font-size: x-large;}(特大) xx-small;(极小) 一般中文用不到,只要用数值就可以,单位:PX.PD 样式 { ...

  3. css 字体样式设置

    css字体样式(Font Style),属性 时间:2014-05-08 21:49 来源:我爱学习网 | 作者:我爱学习网 | 本文已影响 68353 人   css字体样式(Font Style) ...

  4. 前端 CSS 优先级 样式设置important

    !important 的使用. !important方式来强制让样式生效,但并不推荐使用.因为如果过多的使用!important会使样式文件混乱不易维护. 万不得已可以使用!important 现在选 ...

  5. CSS滚动条样式设置

    webkit浏览器css设置滚动条 主要有下面7个属性 ::-webkit-scrollbar 滚动条整体部分,可以设置宽度啥的 ::-webkit-scrollbar-button 滚动条两端的按钮 ...

  6. 认识CSS中css背景样式设置

    前端之HTML,CSS(五) CSS CSS背景 CSS可以添加背景颜色和背景图片,也可以对图片进行设置.设置的样式有: background-color 背景颜色 background-image ...

  7. [CSS]滚动条样式设置

    概述 最近项目中需要,将一个页面嵌入在一个webbrower中,这个webrower是定高的,在页面内容超过webbrower高度时,需要以滚动条的形式展现,当时也考虑了使用webbrower的滚动条 ...

  8. css基本样式设置

    div中文字居中 如何让一个div中的文字水平和垂直居中?设置如下: 给定该div的长宽(或者二者只给出其一也可) .box{ height: 100px; width: 30%; text-alig ...

  9. css scrollbar样式设置

    参考链接:https://segmentfault.com/a/1190000012800450

随机推荐

  1. 启动mySQL安装出现1067错误

    可能几种的办法: 删除data目录下的ib_logfile0和ib_logfile1 查看my.ini文件中的dir设置 查看err文件,如果是temp出现错误文件,则添加temp文件的路径

  2. 逆波兰表达式 java

    描述  逆波兰表达式是一种把运算符前置的算术表达式,例如普通的表达式2 + 3的逆波兰表示法为+ 2 3.逆波兰表达式的优点是运算符之间不必有优先级关系, 也不必用括号改变运算次序,例如(2 + 3) ...

  3. [每日一题] OCP1z0-047 :2013-07-24 子查询――外查询与内查询的执行顺序

    一.Oracle的子查询分为两类分别是嵌套子查询和非嵌套子查询.所谓嵌套子查询是指,子查询是一个独立的查询不与外部查询相关,子查询将被先执行,而且只被执行一次,子查询执行完成后,再执行外部的查询,外部 ...

  4. 初始化JQuery方法与(function(){})(para)匿名方法介绍

    一.初始化JQuery对象 DOM加载完成时运行代码 1.$(document).ready(function(){ 全写 // 在这里写你的代码... }); 2.jQuery(function() ...

  5. Centos下删除文件名乱码文件

    centos下通过rm命令来删除文件,但是如果要删除文件名乱码的文件,就不能直接使用rm命令了,因为压根就无法输出文件名来.不过借助find命令可以实现对其删除.在linux下对于每个文件都一个对应的 ...

  6. 安装centos mini版,无法联网,用yum安装软件提示 cannot find a valid baseurl for repo:base/7/x86_64 的解决方法

    *无法联网的明显表现会有:  cannot find a valid baseurl for repo:base/7/x86_64 1.yum install出现 Error: cannot find ...

  7. 转:全志A20 GPIO 总结文档

    链接: http://blog.csdn.net/chwenj/article/details/42190745 /* * author:          chwenj@gmail.com. * A ...

  8. ionic ng-src 在网页显示,但是导出apk在android手机中运行不显示图片

    解决方法参照: http://stackoverflow.com/questions/29896158/load-image-using-ng-src-in-android-ionic-aplicat ...

  9. PHP and java

    问题补充: 为什么不选用优秀的ASP.NET,京东做的不是很成功嘛?-----------------------------------------------------------------首 ...

  10. python常用数据结构的常用操作

    作为基础练习吧.列表LIST,元组TUPLE,集合SET,字符串STRING等等,显示,增删,合并... #===========List===================== shoplist ...