css 常用技巧
2016-01-08 13:59
886 查看
1、禁止用户选中文字
-webkit-user-select:none
2、文本溢出显示..
3、常用字体:
Arial ,arial black,verdana,georgia,courier new,comic sans ms,tahoma,
4、两端对齐
text-justify : auto; text-align:justify;
5、文字垂直居中对齐,
display:table-cell;
vertical-align:middle;
6、before after 中content用法
content:'\5B' 编码字符用法
content:"(" attr(引用标签上属性值) ")" attr(href)
content:url() 使用图片,但不可设置大小
7、webkit-transform-origin:用法:
它用来设置旋转的中心点,一般会用x y两个百分比
但如果3d视图时是可以设置z轴的值的,可以用百分比,px 等
8、去掉移动端a点击时的暗色背景
9、禁止长按a出现菜单栏
10、流畅滚动
11、文字长显示...
12、box-sizing使用
用来改变默认盒子的计算方式
content-box:默认值,标准盒子 width height 只包含内容的宽高
padding-box:width height 包含内边距
border-box:width height包含内边距和边框
-webkit-user-select:none
2、文本溢出显示..
overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
3、常用字体:
Arial ,arial black,verdana,georgia,courier new,comic sans ms,tahoma,
4、两端对齐
text-justify : auto; text-align:justify;
5、文字垂直居中对齐,
display:table-cell;
vertical-align:middle;
6、before after 中content用法
content:'\5B' 编码字符用法
content:"(" attr(引用标签上属性值) ")" attr(href)
content:url() 使用图片,但不可设置大小
7、webkit-transform-origin:用法:
它用来设置旋转的中心点,一般会用x y两个百分比
但如果3d视图时是可以设置z轴的值的,可以用百分比,px 等
8、去掉移动端a点击时的暗色背景
a,button,input,optgroup,select,textarea { -webkit-tap-highlight-color:rgba(0,0,0,0); /*去掉a、input和button点击时的蓝色外边框和灰色半透明背景*/ }
9、禁止长按a出现菜单栏
a, img { -webkit-touch-callout: none; /*禁止长按链接与图片弹出菜单*/ }
10、流畅滚动
body{ -webkit-overflow-scrolling:touch; }
11、文字长显示...
/*指定字符串的宽度*/ width:300px; overflow: hidden; /* 当字符串超过规定长度,显示省略符*/ text-overflow:ellipsis; white-space: nowrap;
12、box-sizing使用
用来改变默认盒子的计算方式
content-box:默认值,标准盒子 width height 只包含内容的宽高
padding-box:width height 包含内边距
border-box:width height包含内边距和边框
相关文章推荐
- 【CSS】文本水平对齐[CSS权威指南 学习笔记]
- div+css 怎么让一个小div在另一个大div里面 垂直居中
- CSS之网页弹窗插件
- XSSFWookbook添加单元格样式
- css初始化
- 手机网页开发问题总结(一)
- W3c html+css基础参考手册-2016-01参考
- CSS3 页面跳转的动画效果
- css字体图标浏览器兼容解决方案
- 代码:CSS——reset.css
- css3 transition effect(其它效果)
- 动态添加css样式至文件中
- CSS3:RGBA的使用方法
- 浏览器滚动条样式
- 手机web——自适应网页设计(html/css控制)
- 常用的CSS(收集)
- 获取计算后的css样式
- css中rem的认识
- CSS3实现动画效果教程详解
- 常用css