owl.theme实现自适应聚焦左右拖动图标文字轮播图幻灯片效果代码
代码语言:html
所属分类:幻灯片
代码描述:owl.theme实现自适应聚焦左右拖动图标文字轮播图幻灯片效果代码,不拖动就会自动滚动,中间的聚焦突出显示,左右的缩小减淡显示。
代码标签: owl.theme 自适应 左右 拖动 图标 文字 轮播图 幻灯片
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<link type="text/css" rel="stylesheet" href="//repo.bfw.wiki/bfwrepo/css/normalize.css">
<link type="text/css" rel="stylesheet" href="//repo.bfw.wiki/bfwrepo/css/bootstrap.3.3.4.css">
<link type="text/css" rel="stylesheet" href="//repo.bfw.wiki/bfwrepo/css/owl.carousel.2.1.1..css">
<link type="text/css" rel="stylesheet" href="//repo.bfw.wiki/bfwrepo/css/owl.theme.default.min.css">
<style>
.shadow-effect {
background: #fff;
padding: 20px;
border-radius: 4px;
text-align: center;
border:1px solid #ECECEC;
box-shadow: 0 19px 38px rgba(0,0,0,0.10), 0 15px 12px rgba(0,0,0,0.02);
}
#customers-testimonials .shadow-effect p {
font-family: inherit;
font-size: 17px;
line-height: 1.5;
margin: 0 0 17px 0;
font-weight: 300;
}
.testimonial-name {
margin: -17px auto 0;
display: table;
width: auto;
background: #3190E7;
padding: 9px 35px;
border-radius: 12px;
text-align: center;
color: #fff;
box-shadow: 0 9px 18px rgba(0,0,0,0.12), 0 5px 7px rgba(0,0,0,0.05);
.........完整代码请登录后点击上方下载按钮下载查看
















网友评论0