这篇文章介绍关于css知识点的集锦
CreateTime–2016年9月29日09:43:10
Author:Marydon
1.背景色线性渐变
background-color:linear-gradient(100deg,#FFF,#111);/*由黑色向白色渐变 deg表示度数*/
UpdateTime–2016年10月25日11:37:53
UpdateTime–2016年11月23日09:53:46
2.设置表格的边框被合并为一个单一的边框
立即学习“前端免费学习笔记（深入）”；
border-collapse: collapse;/*前提：table的border=1或border="1"或border="1px"*/
UpdateTime–2016年10月29日09:04:07
3.设置p最小高度及高度自动伸展
#pHeight{height:auto;min-height:5px;width:800px; background:#bbeeeb;margin:0 auto;}
此p具有最小高度且高度可以随着内容的增高而自动伸展
此p具有最小高度且高度可以随着内容的增高而自动伸展
设置最小宽度及宽度自动伸展
width:auto;min-width:5px;height:800px;
4.禁止换行的两种方式
方式一：
通常在浏览器上显示的文档会在到达浏览器的横幅底端时自动换行，但是如果文字被包含在～标签里的话，则不会换行
使用标签
方式二：
使用CSS样式
style="white-space:nowrap;"
UpdateTime–2016年11月25日08:57:49
设置td禁止换行
UpdateTime–2016年10月31日09:44:17
5.display样式
inline 行内元素（与其它元素共占一行，不换行，不能设置宽和高）
block 块级元素（单独占一行，可以设置宽和高）
inline-block 行内块级元素（与其它元素共占一行，但是可以设置宽和高）（兼有了行内元素和块级元素的特征）
none 将该元素隐藏
document.getElementById("aa").style.display="";//表示的是：清除display样式，display将使用默认值（块元素会变成block，内联元素会变成inline）
UpdateTime–2016年11月24日11:44:31
6.ime-mode语法和text-transform语法
UpdateTime–2016年12月15日19:52:16
/*屏蔽输入法，可以用来禁止录入中文*/ ime-mode:disabled; //IE兼容，chrome不兼容 /*将输入的英文字母转全部换成大写字母*/ text-transform:uppercase; UpdateTime--2017年1月9日10:23:23/*将输入的英文字母转全部换成小写字母*/ text-transform:lowercase;
详细介绍
ime-mode语法：（该语法在google浏览器上无效，需要用js进行控制，见”input文本框输入内容控制”文件）
ime-mode : auto | active | inactive | disabled
取值：
auto : 默认值。不影响IME的状态。与不指定 ime-mode 属性时相同
active : 指定所有使用IME输入的字符。即激活本地语言输入法。用户仍可以撤销激活IME
inactive : 指定所有不使用IME输入的字符。即激活非本地语言。用户仍可以撤销激活IME
disabled : 完全禁用IME。对于有焦点的控件(如输入框)，用户不可以激活IME
text-transform语法：
text-transform : none | capitalize | uppercase | lowercase
取值：
none : 默认值。无转换发生
capitalize : 将每个单词的第一个字母转换成大写，其余无转换发生
uppercase : 转换成大写
lowercase : 转换成小写
7.设置p里的内容自动换行
当p框固定高度宽度后，显示的内容超过p的宽度，超出内容不换行的问题
设置css样式
word-wrap:break-word;
8.实现p,li里的内容超出容器宽度时，超出部分以”..”形式显示
前提：必须先确定p,li的宽度
添加属性
text-overflow:ellipsis; white-space:nowrap; overflow:hidden;
9.文本框和密码框在IE浏览器显示样式控制
/*去除IE浏览器文本框右侧出现叉号*/ #aa::-ms-clear { display:none; } /*去除IE浏览器密码框右侧出现眼睛*/ #bb::-ms-reveal { display:none; }
以上就是关于CSS知识点的集锦的详细内容，更多请关注创想鸟其它相关文章！
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。
如发现本站有涉嫌抄袭侵权/违法违规的内容， 请发送邮件至 chuangxiangniao@163.com 举报，一经查实，本站将立刻删除。
发布者：程序猿，转转请注明出处：https://www.chuangxiangniao.com/p/1607874.html
微信扫一扫 
支付宝扫一扫 
