今天看到一个网站图片浮动起来,感觉挺好看的,就想在自己网站也加上,网上搜了下,主要代码如下。
[CSS] 纯文本查看 复制代码
.rec-book-item {transition: all 0.4s;}//浮动的时间
.rec-book-item:hover {
box-shadow: 0 8px 8px 0 grey;
transform: translate(0, -4px);//向上浮动的距离
order-radius: 10px;
}
以上代码,初步实现了浮动,但是我现在要给图片下面的文字加个白色背景以及内边距,但是新的问题来了,内边距第一行生效,第二行不生效。
问了大佬,需要在文字样式部分,加上以下代码。
[CSS] 纯文本查看 复制代码 display: block;
意思是将文字样式改为块元素,但是这样还是显示一行,而后设置了高元素为height: 65px,显示也2行了。
|