实用css特殊属性
来源:互联网 发布:h3c交换机查看mac地址 编辑:程序博客网 时间:2024/06/02 20:46
1. 文本两端对齐
一般情况下文本排版都是左对齐、右对齐、居中对齐,但受制于很多因素,包括标点符号会带走最后一个字、英文单词插在中文中超出一行就会将整个单词换行等影响美观的情况,有些时候需要用到两端对齐,尤其是在移动端页面中,两端对齐在小屏上看起来会比较整齐。
text-align: justify; //只对英文有效果text-justify: inter-ideograph;//中文两端对齐//其他text-align-last: justify;//生效的前提是先设置 text-align:justify;text-justify:distribute-all-lines;justify-content:space-between;
2. 文字超出盒子用省略号
此效果可以实现的前提是该盒子的宽度一定,哪怕是继承来的宽度也行,自适应宽度时不适用。
white-space: nowrap;text-overflow: ellipsis;-o-text-overflow: ellipsis;overflow: hidden;
3. 调整字间距
顾名思义,字与字之间的距离。
letter-spacing:15px;
4. 点透(禁用鼠标点击)
所谓点透就是可以透过表面的元素点到被蒙在下面的元素,触发下面元素的点击事件。也就是说要禁用该表面元素的鼠标点击动作。
pointer-events: none;
5. img 置为黑白
此属性可以将彩色的图片变成黑白,且可调整灰度值。
filter: gray;filter: grayscale(100%);
6. 文本转换
首字母大写、全部字母大写、全部字母小写。该属性可以省去修改文本,直接用css控制大小写。
text-transform: none; //默认,定义带有小写字母和大写字母的标准的文本text-transform: capitalize; //文本中的每个单词以大写字母开头text-transform: uppercase; //定义仅有大写字母text-transform: lowercase; //定义无大写字母,仅有小写字母text-transform: inherit; //规定应该从父元素继承 text-transform 属性的值
(其他css特殊属性用到时会及时更新到本文中,欢迎各位补充~~)
阅读全文
0 0
- 实用css特殊属性
- 前端css特殊属性
- css的某些特殊属性
- css特殊的几个属性
- CSS 中 Display 的一些特殊属性
- CSS 特殊属性介绍之 pointer-events
- 总结--15个实用CSS属性
- JS操作css的float属性的特殊写法
- css网页中导入特殊字体@font-face属性详解
- border-image属性实现css边框特殊需求
- 5个简单,但很实用的 css属性
- css的一些重要而实用的属性
- 5个简单,但很实用的css属性
- CSS-- 实用CSS样式
- CSS中存在一些比较特殊的属性,伪类,伪元素
- 在CSS中通过@font-face属性来实现网页中嵌入特殊字体
- 基本属性与特殊属性
- Css特殊字体
- Python 入门实践
- pi64之raspi-config问题
- 关于android 使用MINA还是RMI框架的问题
- Tech Insight携阿里云Link物联网平台助力实现“IoT全栈开发”
- oracle-dbms_random随机函数
- 实用css特殊属性
- 不容易系列之(4)——考新郎(hdu2049)(错排)
- Java关键字final、static使用总结(转)
- <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
- 判断是否有包含指定的class
- 2017年全小数考试时间及各年级重难点考试题型
- 新增一条数据后,如何获取刚刚新增数据的ID
- Git 的 4 个阶段的撤销更改
- 向表里新增/删除一条字段