jquery owl实现图文列表自动滚动效果代码
代码语言:html
所属分类:其他
代码描述:jquery owl实现图文列表自动滚动效果代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8">
<!--响应式框架-->
<link type="text/css" rel="stylesheet" href="//repo.bfw.wiki/bfwrepo/css/bootstrap.4.3.1.min.css">
<!--图标库-->
<link type="text/css" rel="stylesheet" href="//repo.bfw.wiki/bfwrepo/css/font-awesome-4.7.0/css/font-awesome.min.css">
<!--插件css基本库-->
<link type="text/css" rel="stylesheet" href="//repo.bfw.wiki/bfwrepo/css/owl.carousel.css">
<style>
.post-slide{
background: #fff;
margin: 0 15px;
padding:27px 30px;
border-bottom: 1px solid #dedde1;
}
.post-slide .post-header{
margin-bottom: 10px;
}
.post-slide .subtitle{
color:#0b99bc;
font-size:14px;
display: inline-block;
margin-bottom:5px;
text-transform: uppercase;
transition: all 0.4s ease 0s;
}
.post-slide .subtitle:hover{
color:#333;
text-decoration: none;
}
.post-slide .post-title{
margin: 0;
}
.post-slide .post-title a{
color:#333;
font-size:18px;
font-weight: bold;
text-transform:capitalize;
transition: all 0.4s ease 0s;
}
.post-slide .post-title a:hover{
color:#0b99bc;
text-decoration: none;
}
.post-slide .pic{
overflow: hidden;
position: relative;
}
.post-slide .pic img{
width: 100%;
height:.........完整代码请登录后点击上方下载按钮下载查看
















网友评论0