发表于: 2019-09-22 20:33:57

1 746


今天改昨天没改完的

background属性的一些应用

通过background:url()背景图片插入

background-size:;调节背景图片大小

background-position:;调节背景图片的位置定位

通过上面的属性可以直接把文字背景图片通过padding进行调节推向前面,不用在重新mg在插入图片直接一行代码搞定文字和图片效果如下

代码如下

注意事项:一定要写on-repeat;意思是不让图片进行重复填满容器。

通过解决昨天顶部图片换颜色了解到。

hover 选择器

选择鼠标指针浮动在其上的元素,并设置其样式:

a:hover { background-color:yellow; }

效果如下

代码如下

.header1:hover{
background-color:white;
bordersolid #ffffff;
font-size13px;color:#55a8b3;


解决昨天CSS画大于号

知道了DIV旋转元素

transform: rotate()

效果如下

代码如下

.zhong {
width10px;
height10px;
border-top2px solid #55a8b3;
border-right2px solid #55a8b3;
transformrotate(45deg);
}


修改文本被挤压的状态

了解到text-overflow属性

规定文本属性溢出包含元素时候发生的事情

ctip修剪文本

ellipsis 用省略号代替被修剪的文本

 overflow:属性

属性规定当内容溢出元素框时发生的事情

效果如下

代码如下


white-spacenowrap;
text-overflowellipsis;
outline-stylenone;
overflow:hidden;


注意如果你没有写 overflow:hidden的话你收缩它们是不会出现上面的效果的。

中间那个下拉框还没解决 实现不了PS那种效果明天继续。



返回列表 返回列表
评论

    分享到