1.以下就是三角形的书写代码
div {
width: 0;
height: 0;
border-style: solid;
border-width: 10px;
border-color: transparent transparent transparent red;
font-size: 0;
line-height: 0;
}
border-color: 上 右 下 左;不显示的区域透明,需要显示区域设置颜色,箭头的方向和方位英文相反;
上箭头:border-color:transparent transparent red transparent;
右箭头:border-color:transparent transparent transparent red;
下箭头:border-color:red transparent transparent transparent;
左箭头:border-color:transparent red transparent transparent;
2.如何实现固定定位的盒子跟随版心移动
将固定定位的盒子left:50%; 然后设置margin-left的值=版心的一半+定位盒子的宽度+任意值;
3、用户界面-鼠标样式
•鼠标样式:cursor
•小白(默认) cursor:default;
•小手: cursor:pointer; 提示用户可以点击下一步
•移动: cursor:move;
•文本: cursor:text;
•禁止: cursor:not-allowed;
4 •Textarea 文本域默认有轮廓线也可以统统outline:none;取消,同时还存在右下角拖拽放大,我们一般不允许,需要设置不能拖拽,可以通过resize:none;进行设置;
5、vertical-align实现图片和文字垂直对齐
•常用的取值:top(顶线对齐)bottom(底线对齐)middle(中线对齐)
•vertical-align:middle; 让行内元素、行内块元素垂直居中;
6、溢出的文字省略号显示(一定会用)
•white-space:normal; 默认处理,文字一行显示不下就折行显示;
•white-space:nowrap; 强制一行显示,文字一行显示不小就强制显示,要配合overflow:hidden; 使用,然后想要出现省略好配合下面属性:
•text-overflow:clip; 不显示省略号,直接裁剪;
•text-overflow:ellipsis; 隐藏的内容以省略号显示;
|
|