1. 伪类选择器
为了确保生效,请按照LVHA的顺序来声明: :link-:visited-:hover-:active.
a:link 未访问 a:visited 访问过得 a:hover 鼠标经过 a:active 选择鼠标按下没有弹起的状态
2.focus伪类选择器
:focus伪类选择器用于选取获得焦点的表单元素
焦点就是光标,一般情况<input>类表单元素才能获取,因此这个选择器只针对与表单元素来说。
input:focus{
background-color:yellow
}
3.背景图像固定(背景附着)
background-attachment:scroll | fixed
scroll 背景图像是随对象内容滚动 fixed 背景图像固定
background: 复合属性
background:black url(images/sdsd) no-repeat fixed center top;
空格隔开
4. 表格细线边框合并
合并相邻的边框
border-collapse:collapse; 将两个1px的边框合并成一个1px的边框
5. a链接加下划线
text-decoration:underline;
6. 盒子阴影
h-shadow 水平阴影的位置,可以负值。 v-shadow 垂直阴影的位置,允许负值。
blur 可选,模糊距离,像素越大他越实在,越小越虚。 spread 阴影的尺寸。
color 颜色 1. inset改为内部阴影,默认的是外阴影(outset),但是不可以写这个单词,否则导致阴影无效。 2.盒子阴影不占用空间,不影响其他盒子排列。
box-shadow:10px 10px 10px -4px rgba(0,0,0,0.3)
文字阴影
text-shadow: h-shadow v-shadow blur color
6.visibility 可见性
visibility属性用于指定一个元素应可见还是隐藏。
visibility :visible,元素可视,如果隐藏元素想要原来的位置,就用这个
visibility :hidden 元素隐藏
display : none (用处更多,重点) 如果隐藏元素不想要原来的位置,就用这个
overflow:scroll 溢出的部分显示滚动条,不溢出也显示滚动条
overflow:auto 不溢出不显示滚动条,溢出显示滚动条
7.CSS用户界面样式
1.鼠标样式cursor (cursor:pointer)小手
default 小白默认 pointer 小手 move 移动 text 文本 not-allowed 禁止
2.取消表单轮廓和防止拖拽文本域
取消表单轮廓 outline:none 防止拖拽文本域 resize:none
<textarea> </textarea> 中间不要换行和空格否则,文本域内容会有间隙
3.vertical-clign 实现行内块和文字对齐
可以用来解决图片底部默认空白间隙问题
顶线(top) 中线(middle)对齐 基线(base) 底线(bottom)默认
4.单行文字溢出省略号显示
一、先强制-行内显示文本
white-space:nowrap;
二、超出的部分隐藏
overflow:hidden
三、文字用省略号替代超出的部分
text-overflow:ellipsis;