wordpress博客趣主题个人静态网页模板

简介: 博客趣wordpress页面模板适合个人博客,个人模板等内容分享。

  博客趣主题具有最小和清洁的设计,易于使用,并具有有趣的功能。bokequ主题简约干净的设计、在明暗风格之间进行现场切换。

  博客趣主题功能:

  1、CSS3+HTML5、扁平化、响应式设计、自定义颜色风格,轻盈的前端框架,支持现代浏览器及大部分移动浏览器

  2、适用于博客、新闻、公司、图片、小说、文档、商城、资源下载、网址导航等多种类型网站

  3、支持日志图像等多种文章形式,让排版即简洁又不失变化。包括文章置顶、文章推荐、排除分类文章、侧边栏小工具、幻灯等,适合个人博客发表日志。

 4、用图片形式展示分类文章。幻灯、横向图片滚动,小工具、首页推荐文章等。

5、主页html代码

<!doctype html><html><head><metacharset="gbk"><title>wordpress博客趣主题个人静态网页模板 - maolai博客</title><metaname="keywords"content="WordPress主题站,wordpress模板,wordpress博客主题,wordpress图片主题,maolai博客"/><metaname="description"content="maolai博客分享各种wordpress主题下载,wordpress企业主题,wordpress cms主题,wordpress中文主题,wordpress视频主题,wordpress图片主题,wordpress博客模板,wordpress音乐主题"/><metaname="viewport"content="width=device-width, initial-scale=1.0"><linkhref="css/base.css"rel="stylesheet"><linkhref="css/index.css"rel="stylesheet"><linkhref="css/m.css"rel="stylesheet"><scriptsrc="js/jquery.min.js"></script><scriptsrc="js/hc-sticky.js"></script><scriptsrc="js/comm.js"></script><!--[if lt IE 9]><script src="js/modernizr.js"></script><![endif]--></head><body><headerid="header"><divclass="navbar"><divclass="topbox"><pclass="welcome">您好,欢迎您访问maolai个人博客 - wordpress博客主题模板分享</p><divclass="searchbox"><divid="search_bar"class="search_bar"><formid="searchform"action="http://www.bokequ/wo/e/search/index.php"method="post"name="searchform"><inputclass="input"placeholder="想搜点什么呢.."type="text"name="keyboard"id="keyboard"><inputtype="hidden"name="show"value="title"/><inputtype="hidden"name="tempid"value="1"/><inputtype="hidden"name="tbname"value="news"><inputtype="hidden"name="Submit"value="搜索"/><pclass="search_ico"><span></span></p></form></div></div></div></div><divclass="header-navigation"><nav><divclass="logo"><ahref="http://www.bokequ.com">maolai个人博客</a></div><h2id="mnavh"><spanclass="navicon"></span></h2><ulid="starlist"><li><ahref="index.html">网站首页</a></li><li><ahref="http://www.bokequ.com/wo/"target="_blank">关于我</a></li><li><ahref="img.html">图片主题</a></li><li><ahref="blog.html">博客主题</a></li><liclass="menu"><ahref="http://www.bokequ.com/tag/wordpress">wordpress</a><ulclass="sub"><li><ahref="#">wordpress教程</a></li><li><ahref="#">wordpress插件</a></li></ul></li><li><ahref="table.html">table主题</a></li><li><ahref="time.html">时间轴</a></li></ul></nav></div></header><divclass="wrapper"><main><!--banner begin--><divclass="banner"><divid="banner"class="fader"><liclass="slide"><ahref="#"title="极简WordPress个人博客主题"><imgsrc="http://www.bokequ.com/blog/4/images/19.jpg"><spanclass="imginfo">极简WordPress个人博客主题</span></a></li><liclass="slide"><ahref="#"title="Module 模块化多功能WordPress企业主题"><imgsrc="http://www.bokequ.com/blog/4/images/21.jpg"><spanclass="imginfo">Module 模块化多功能WordPress企业主题</span></a></li><divclass="fader_controls"><divclass="page prev"data-target="prev">&lsaquo;</div><divclass="page next"data-target="next">&rsaquo;</div><ulclass="pager_list"></ul></div></div></div><!--banner end--><divclass="bloglist"><ul><li><iclass="blogpic"><ahref="#"><imgsrc="images/1.jpg"alt=""></a></i><dl><dt><ahref="http://www.bokequ.com/category/theme"target="_blank">WordPress个人博客简单派Ganesa主题</a></dt><dd><spanclass="bloginfo">WordPress个人博客简单派Ganesa主题。Ganesa主题是一个具有现代设计模式、新趋势的最小WordPress个人博客主题。使用WordPress实时主题定制器可轻松定制。Ganesa中的每个元素都是完全响应的,因为可以从桌面和移动设备查看内容。...</span><pclass="timeinfo"><spanclass="lanmu"><ahref="http://www.bokequ.com/category/theme"target="_blank">wordpress博客主题</a></span><spanclass="date">2018-07-03</span></p><aclass="read"href="/">阅读更多</a></dd></dl></li><li><iclass="blogpic"><ahref="#"><imgsrc="images/2.jpg"alt=""></a></i><dl><dt><ahref="#"target="_blank">WordPress个人博客主题Gutenberg/Aldo</a></dt><dd><spanclass="bloginfo">Aldo是一个清新的WordPress基于Gutenbergpage构建器的博客。它适合于客户博客,胭脂,利基博客,赠品,病毒博客,赠品,指南,个人投资组合和操作博客。此外,它适合荷马,告诉一切,商业,密码货币,专业,反向,作家和世界新闻。</span><pclass="timeinfo"><spanclass="lanmu"><ahref="#"target="_blank">wordpress博客主题</a></span><spanclass="date">2018-07-03</span></p><aclass="read"href="/">阅读更多</a></dd></dl></li><li><iclass="blogpic"><ahref="#"><imgsrc="images/3.jpg"alt=""></a></i><dl><dt><ahref="#"target="_blank">WordPress杂志博客主题Octamag</a></dt><dd><spanclass="bloginfo">Octamag是一个新的、现代的杂志和博客WordPress主题。八达马格主题有一个干净的设计,一个完全响应的框架,并给你的力量,创建一个独特的外观博客与易于使用的拖放页面构建器Visual Composer,这是完全响应,视网膜准备,搜索引擎优化。
...</span><pclass="timeinfo"><spanclass="lanmu"><ahref="#"target="_blank">wordpress博客主题</a></span><spanclass="date">2018-07-03</span></p><aclass="read"href="/">阅读更多</a></dd></dl></li><li><iclass="blogpic"><ahref="#"><imgsrc="images/4.jpg"alt=""></a></i><dl><dt><ahref="#"target="_blank">WordPress主题博客杂志Saxon</a></dt><dd><spanclass="bloginfo">Saxon是一个干净、优雅、响应性强的WordPress主题,它已经准备好,并等待被转换成您自己的个人博客或动态杂志站点...</span><pclass="timeinfo"><spanclass="lanmu"><ahref="#"target="_blank">wordpress博客主题</a></span><spanclass="date">2018-07-03</span></p><aclass="read"href="/">阅读更多</a></dd></dl></li><li><iclass="blogpic"><ahref="#"><imgsrc="images/5.jpg"alt=""></a></i><dl><dt><ahref="#"target="_blank">wordpress商店购物博客主题Sada</a></dt><dd><spanclass="bloginfo">Sada博客是博客和商店的简约时尚和现代WordPress主题。它是制定考虑到所有要求和需要设计一个风景网站。Sada主题是Gutenberg准备好了。Gutenberg是一个新的WordPress编辑器,它将是WordPress 5.0中的默认WordPress编辑器。sada所有的元素都基于Gutenberg。...</span><pclass="timeinfo"><spanclass="lanmu"><ahref="#"target="_blank">wordpress博客主题</a></span><spanclass="date">2018-07-03</span></p><aclass="read"href="/">阅读更多</a></dd></dl></li><li><iclass="blogpic"><ahref="#"><imgsrc="images/6.jpg"alt=""></a></i><dl><dt><ahref="#"target="_blank">个人主页WordPress博客主题Nimbo</a></dt><dd><spanclass="bloginfo">这是一个博客主题,具有最小和清洁的设计,易于使用,并具有有趣的功能。Nimbo主题简约干净的设计、在明暗风格之间进行现场切换。</span><pclass="timeinfo"><spanclass="lanmu"><ahref="#"target="_blank">wordpress博客主题</a></span><spanclass="date">2018-07-03</span></p><aclass="read"href="/">阅读更多</a></dd></dl></li><li><iclass="blogpic"><ahref="#"><imgsrc="images/7.jpg"alt=""></a></i><dl><dt><ahref="#"target="_blank">一个杂志元素WordPress主题Neotech</a></dt><dd><spanclass="bloginfo">Neotech是杂志、博客和发行者网站的拖放元素WordPress主题。它是用元素页面构建器构建的,因此您可以进行更改并实时查看它们。包括GDRP工具,如cookies栏、同意复选框等。与用户保持联系,Neotech已经完全集成了MailChimp表单。Neotech是一个闪电般的快速主题,它非常适合移动设备。用Neotech WordPress主题构建下一个项目...</span><pclass="timeinfo"><spanclass="lanmu"><ahref="#"target="_blank">wordpress博客主题</a></span><spanclass="date">2018-07-03</span></p><aclass="read"href="/">阅读更多</a></dd></dl></li><li><iclass="blogpic"><ahref="#"><imgsrc="images/8.jpg"alt=""></a></i><dl><dt><ahref="#"target="_blank">WordPress食物食谱博客主题无限滚动Unich</a></dt><dd><spanclass="bloginfo">Unich——无限滚动WordPress博客食物食谱主题,无论你是博客/vloggers还是公司,Unich WordPress主题都非常直观,适合于部署用于各种不同的网站和项目,但是特别适合于个人博客和vlogger..</span><pclass="timeinfo"><spanclass="lanmu"><ahref="#"target="_blank">wordpress博客主题</a></span><spanclass="date">2018-07-03</span></p><aclass="read"href="/">阅读更多</a></dd></dl></li><li><iclass="blogpic"><ahref="#"><imgsrc="images/9.jpg"alt=""></a></i><dl><dt><ahref="#"target="_blank">wordpress另类杂志主题Dinova</a></dt><dd><spanclass="bloginfo">Dinova是Gutenberg的另一个博客和杂志主题。通过大量仔细考虑的主题选项、众多的布局和帖子风格组合以及Gutenberg强大的编辑功能,您可以创建读者会喜欢的非凡内容...</span><pclass="timeinfo"><spanclass="lanmu"><ahref="#"target="_blank">wordpress博客主题</a></span><spanclass="date">2018-07-03</span></p><aclass="read"href="/">阅读更多</a></dd></dl></li><li><iclass="blogpic"><ahref="#"><imgsrc="images/10.jpg"alt=""></a></i><dl><dt><ahref="#"target="_blank">wordpress当代杂志与博客主题Insider</a></dt><dd><spanclass="bloginfo">wordpress当代杂志与博客主题Insider这个强大的博客和杂志主题是为你创造的!惊人的,快速加载的现代博客主题,个人或编辑使用。基于核心WordPress特性,这个主题是从上到下精心设计的。为下一个编辑阶段做好准备——Gutenberg,但是没有它很容易使用。使用事件日历添加事件。超快速加载。非常适合小型博客或知名杂志。</span><pclass="timeinfo"><spanclass="lanmu"><ahref="#"target="_blank">wordpress博客主题</a></span><spanclass="date">2018-07-03</span></p><aclass="read"href="/">阅读更多</a></dd></dl></li><li><iclass="blogpic"><ahref="#"><imgsrc="images/11.jpg"alt=""></a></i><dl><dt><ahref="#"target="_blank">GutenMag-杂志和博客的Gutenberg WordPress主题</a></dt><dd><spanclass="bloginfo">GutenMag基于Gutenberg页面构建器,支持所有原生Gutenberg块。非常适合写博客,对新闻、杂志、报纸、出版物或评论网站都适用。它支持来自YouTube的视频、Spotify的嵌入式音频、Soundcloud、Instagram的图片提要。古腾玛格是100%AMP和移动准备就绪。GDPR遵从性插件是捆绑在一起的。主题是超快,简单...</span><pclass="timeinfo"><spanclass="lanmu"><ahref="#"target="_blank">wordpress博客主题</a></span><spanclass="date">2018-07-03</span></p><aclass="read"href="/">阅读更多</a></dd></dl></li><li><iclass="blogpic"><ahref="#"><imgsrc="images/12.jpg"alt=""></a></i><dl><dt><ahref="#"target="_blank">WordPress营销主题Sleezy Lifestyle </a></dt><dd><spanclass="bloginfo">Sleezy是一款适用于生活方式博客、个人和市场营销博客/创新设计与清洁代码.简单/响应式的wordpress主题...</span><pclass="timeinfo"><spanclass="lanmu"><ahref="#"target="_blank">wordpress博客主题</a></span><spanclass="date">2018-07-03</span></p><aclass="read"href="/">阅读更多</a></dd></dl></li></ul></div><!--bloglist end--></main><asideclass="sidebar"><divclass="fenlei"><ulclass="flnav"><liclass="flselect"><ahref="#"title="最新文章"class="pall"></a></li><li><ahref="#"title="站长推荐"class="pgood"></a></li><li><ahref="#"title="点击排行"class="pbro"></a></li><li><ahref="#"title="头条关注"class="pfav"></a></li></ul></div><divclass="newstw"><ulclass="sidenews"><h2>最新主题</h2><li><i><imgsrc="images/1.jpg"></i><p><ahref="/">mawiss WordPress博客杂志的主题</a></p><span>2018-05-13</span></li><li><i><imgsrc="images/2.jpg"></i><p><ahref="/">vidorev视频的WordPress主题</a></p><span>2018-05-13</span></li><li><i><imgsrc="images/3.jpg"></i><p><ahref="/">gridbase -新闻和博客的WordPress主题</a></p><span>2018-05-13</span></li><li><i><imgsrc="images/4.jpg"></i><p><ahref="/">minberi报纸编辑WordPress主题</a></p><span>2018-05-13</span></li><li><i><imgsrc="images/5.jpg"></i><p><ahref="/">Penta响应博客的WordPress主题</a></p><span>2018-05-13</span></li></ul><ulclass="sidenews"><h2>主题推荐</h2><li><i><imgsrc="images/6.jpg"></i><p><ahref="/">响应博客及商店的WordPress主题blggn</a></p><span>2018-05-13</span></li><li><i><imgsrc="images/7.jpg"></i><p><ahref="/">Pepper博客/迷你杂志创意的WordPress主题</a></p><span>2018-05-13</span></li><li><i><imgsrc="images/8.jpg"></i><p><ahref="/">别让这些闹心的套路,毁了你的网页设计</a></p><span>2018-05-13</span></li><li><i><imgsrc="images/9.jpg"></i><p><ahref="/">WordPress博客和杂志的主题Linx</a></p><span>2018-05-13</span></li><li><i><imgsrc="images/10.jpg"></i><p><ahref="/">trendion |个人生活博客和杂志的WordPress主题</a></p><span>2018-05-13</span></li></ul><ulclass="sidenews"><h2>热门主题</h2><li><i><imgsrc="images/1.jpg"></i><p><ahref="/">Magneto响应WordPress杂志和博客主题</a></p><span>2018-05-13</span></li><li><i><imgsrc="images/2.jpg"></i><p><ahref="/">WordPress瀑布流主题PinThis中文版</a></p><span>2018-05-13</span></li><li><i><imgsrc="images/3.jpg"></i><p><ahref="/">WordPress音乐主题Always1.8</a></p><span>2018-05-13</span></li><li><i><imgsrc="images/4.jpg"></i><p><ahref="/">Magneto响应WordPress杂志和博客主题</a></p><span>2018-05-13</span></li><li><i><imgsrc="images/5.jpg"></i><p><ahref="/">WordPress图片主题Lovephoto2.0.2分享</a></p><span>2018-05-13</span></li></ul><ulclass="sidenews"><h2>主题收藏</h2><li><i><imgsrc="images/12.jpg"></i><p><ahref="/">wordpress个人博客主题No.7极简模板分享</a></p><span>2018-05-13</span></li><li><i><imgsrc="images/11.jpg"></i><p><ahref="/">WordPress自适应淘宝客主题MiTao4.5</a></p><span>2018-05-13</span></li><li><i><imgsrc="images/10.jpg"></i><p><ahref="/">个人博客,属于我的小世界!</a></p><span>2018-05-13</span></li><li><i><imgsrc="images/9.jpg"></i><p><ahref="/">Helen响应式wordpress博客主题</a></p><span>2018-05-13</span></li><li><i><imgsrc="images/8.jpg"></i><p><ahref="/">wordpress仿微博个人博客主题tongleer</a></p><span>2018-05-13</span></li></ul></div><divclass="ad"><imgsrc="images/7.jpg"></div><divclass="about"><h2class="hometitle">关于我</h2><ul><divclass="avatar"><imgsrc="images/me.jpg"alt=""></div><pclass="abname">bokequ | maolai</p><pclass="abtext">无折腾,不生活。一个爱折腾,爱分享的90后。 </p><li><aclass="xlwb"href="http://weibo.com/lai88520"target="_blank"></a></li><li><aclass="txqq"href="http://wpa.qq.com/msgrd?v=3&uin=2195335317&site=qq&menu=yes"target="_blank"></a></li><li><aclass="rss"href="http://mail.qq.com/cgi-bin/qm_share?t=qm_mailme&email=2195335317@qq.com"target="_blank"></a></li><liclass="wxpic"><aclass="wx"href=""></a><imgsrc="images/pay.jpg"></li></ul></div><divclass="tjlm"><h2class="hometitle">推荐栏目</h2><ul><li><ahref="">关于我</a></li><li><ahref="">模板分享</a></li><li><ahref="">博客主题</a></li><li><ahref="">cms主题</a></li><li><ahref="">动漫主题</a></li><li><ahref="http://www.bokequ.com/tag/wordpress-theme">图片主题</a></li></ul></div><divclass="tpjx"><h2class="hometitle">图片主题</h2><ul><li><ahref="#"><i><imgsrc="images/1.jpg"></i><span>个人杂志博客WordPress主题Melina</span></a></li><li><ahref="#"><i><imgsrc="images/2.jpg"></i><span>个人杂志博客WordPress主题Melina</span></a></li><li><ahref="#"><i><imgsrc="images/3.jpg"></i><span>个人杂志博客WordPress主题Melina</span></a></li><li><ahref="#"><i><imgsrc="images/4.jpg"></i><span>个人杂志博客WordPress主题Melina</span></a></li><li><ahref="#"><i><imgsrc="images/5.jpg"></i><span>个人杂志博客WordPress主题Melina</span></a></li><li><ahref="#"><i><imgsrc="images/6.jpg"></i><span>个人杂志博客WordPress主题Melina</span></a></li></ul></div><divclass="links"><h2class="hometitle">友情链接</h2><ul><li><ahref="http://www.bokequ.com/wo/">maolai博客</a></li><li><ahref="http://www.bokequ.com/category/theme">wordpress主题</a></li><li><ahref="http://www.bokequ.com/blog/1/">个人博客模板</a></li><li><ahref="#">个人博客</a></li></ul></div><divclass="ad"><imgsrc="images/8.jpg"></div></aside><!--sidebar end--></div><!--wrapper end--><footer><divclass="footer"><divclass="wxbox"><ul><li><imgsrc="images/pay.jpg"><span>我的微信</span></li><li><imgsrc="images/wx.jpg"><span>微信公众号</span></li></ul></div><divclass="bzjj"><h2>本站简介</h2><p>wordpress博客园为大家提供各种wordpress主题下载,分享最及时好看的wordpress主题,wordpress模板,wordpress企业主题等信息,找wordpress主题就来wordpress主题。</p></div><divclass="other"><h2>网站版权</h2><p>本站所有主题/文章除标明原创外,均来自网络转载,版权归原作者所有,如果有侵犯到您的权益,请联系本站删除,谢谢!</p><p>&nbsp;</p><p>备案号:粤ICP备15025043号</p></div></div></footer><ahref="#"class="cd-top">Top</a></body></html>

6、主页css样式

@charset"gb2312";
.wrapper { width: 1120px; margin: 130pxauto0; overflow: hidden }
/*banner*/.banner { width: 100%; overflow: hidden; float: left; margin-bottom: 20px }
.fader { position: relative; width: 100%; padding-top: 40%; font-family: "futura", arial; overflow: hidden; }
.fader.slide { position: absolute; width: 100%; top: 0; z-index: 1; opacity: 0; height: 100%; }
.fader.slideimg { width: 100%; height: 100%; }
.fader.prev, .fader.next { position: absolute; height: 80px; line-height: 55px; width: 50px; font-size: 100px; text-align: center; color: #fff; top: 50%; left: 50px; z-index: 4; margin-top: -25px; cursor: pointer; opacity: 0; transition: all150ms; }
.fader.next { left: auto; right: 50px; }
.fader.pager_list { position: absolute; width: 100%; height: 40px; padding: 0; line-height: 40px; bottom: 0; text-align: center; z-index: 4; }
.fader.pager_listli { display: inline-block; width: 15px; height: 15px; margin: 07px; background: #fff; opacity: .3; text-indent: -9999px; border-radius: 999px; cursor: pointer; transition: all150ms; }
.fader.pager_listli:hover, .fader.pager_listli.active { opacity: 1; }
.banner:hover.fader_controls.page.prev { opacity: 0.5; left: 0 }
.banner:hover.fader_controls.page.next { opacity: 0.5; right: 0 }
.imginfo { z-index: 9; position: absolute; font-size: 26px; color: #FFF; display: block; overflow: hidden; bottom: 12%; left: 0; right: 0; display: block; background: rgba(0,0,0,.4); padding: 040px; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; }
.bloglist { border: #ddd1pxsolid; float: left; overflow: hidden; background: #fff; margin-bottom: 15px; }
.bloglistul { padding: 20px20px020px; overflow: hidden; }
.bloglistulli { border-bottom: dashed1px#e5e5e5; overflow: hidden; padding-bottom: 20px; margin-bottom: 20px }
.blogpic { float: left; width: 38%; height: 150px; margin-right: 20px }
.blogpicimg { width: 100%; height: 150px; }
.bloglistdl { height: 150px; position: relative; overflow: hidden; text-overflow: ellipsis; -webkit-box-orient: vertical; display: -webkit-box; -webkit-line-clamp: 3; width: 58%; }
.bloglistdt { text-overflow: ellipsis; white-space: nowrap; overflow: hidden; font-size: 20px; font-weight: normal; }
.bloglistdd { color: #989898; margin: 15px0; display: block; font-size: 14px; line-height: 22px; overflow: hidden; }
.bloglist.timeinfo { font-size: 12px; position: absolute; left: 0; bottom: 0 }
.bloglist.timeinfospan:first-child {; border-right: #CCC1pxsolid; margin-right: 10px; padding-right: 10px }
.bloglist.timeinfo.lanmua { color: #0077dd; }
.bloglistulli:hoverdta { color: #0077dd; }
.bloglist.read { position: absolute; display: block; background: #444; color: #FFF; bottom: 0; right: 0; padding: 5px8px }
.sidebar { float: right; width: 28%; overflow: hidden; position: relative; z-index: 1 }
/*search*/.search { border: 1pxsolid#0077dd; background: #0077dd; position: relative; border-radius: 05px5px0; }
.searchinput.input_submit { border: 0; background: 0; color: #fff; outline: none; position: absolute; top: 10px; right: 8% }
.searchinput.input_text { border: 0; line-height: 36px; height: 36px; width: 72%; padding-left: 10px; outline: none }
/*aside*/.newstwul { display: none }
.newstwul:first-child { display: block }
.fenlei { background: #f8f8f8; height: 41px; line-height: 40px; }
.flnav { clear: both; border-right: 1pxsolid#ddd; overflow: hidden }
.fenleili { width: 25%; float: left }
.fenleilia { display: block; width: 100%; float: left; height: 40px; border-left: 1pxsolid#ddd; border-top: 1pxsolid#ddd; border-bottom: 1pxsolid#ddd; }
.fenlei.pall { background: url(http://www.bokequ.com/blog/15//images/all.png) no-repeatcentercenter; }
.fenlei.pgood { background: url(../images/good.png) no-repeatcentercenter; }
.fenlei.pbro { background: url(../images/browse.png) no-repeatcentercenter; }
.fenlei.pfav { background: url(../images/favorites.png) no-repeatcentercenter }
.fenlei.flselecta.pall { background: url(../images/allb.png) no-repeatcentercenter#fff; border-bottom: 1pxsolid#fff; }
.fenlei.flselecta.pgood { background: url(../images/goodb.png) no-repeatcentercenter#fff; border-bottom: 1pxsolid#fff; }
.fenlei.flselecta.pbro { background: url(../images/browseb.png) no-repeatcentercenter#fff; border-bottom: 1pxsolid#fff; }
.fenlei.flselecta.pfav { background: url(../images/favoritesb.png) no-repeatcentercenter#fff; border-bottom: 1pxsolid#fff; }
/*sidenews*/.sidenews { background: #fff; padding: 20px; border: 1pxsolid#ddd; margin-bottom: 15px }
.sidenewsh2 { font-size: 18px; padding-bottom: 20px; font-weight: normal }
.sidenewsli { margin: 0020px0; overflow: hidden }
.sidenewslip { line-height: 24px; color: #888; font-size: 15px; overflow: hidden; text-overflow: ellipsis; -webkit-box-orient: vertical; display: -webkit-box; -webkit-line-clamp: 2; }
.sidenewslia { color: #48494d; }
.sidenewslia:hover { color: #00A7EB; }
.sidenewsi { width: 100px; height: 75px; overflow: hidden; display: block; border: #efefef1pxsolid; float: left; margin-right: 10px }
.sidenewsimg { height: 100%; max-height: 75px; margin: auto; -moz-transition: all.5sease; -webkit-transition: all.5sease; -ms-transition: all.5sease; -o-transition: all.5sease; transition: all.5sease; transition: all0.5s; }
.sidenewsli:hoveriimg { transform: scale(1.1) }
.sidenewsspan { font-size: 12px; color: #9A9A9A; margin-top: 10px; display: block }
/*ad*/.ad { border: #ddd1pxsolid; background: #fff; padding: 5px; margin-bottom: 15px; }
.adimg { max-width: 100%; width: 100%; height: auto; display: block; }
/*about*/.about { border: #ddd1pxsolid; background: #fff; margin-bottom: 15px; }
.hometitle { background: #f8f8f8; font-size: 15px; padding-left: 20px; border-bottom: 1pxsolid#ddd; height: 38px; line-height: 38px; }
.aboutul { padding: 20px; overflow: hidden }
.avatar { width: 100px; height: 100px; float: left; margin-right: 15px }
.avatarimg { width: 100%; border: #ddd1pxsolid; }
.abname { color: #3f3f3f; font-weight: bold; font-size: 15px; margin-bottom: 5px; }
.abtext { color: #9a9a9a; line-height: 26px; border-bottom: #f5f5f51pxsolid; padding-bottom: 20px }
.aboutli { width: 25%; margin: 15px00; float: left; }
.aboutlia { color: #747F8C; width: 100%; text-align: center; padding-top: 40px; float: left; }
.about.rss { background: url(../images/ico_04.png) no-repeatcentercenter; background-size: 40px }
.about.rss:hover { color: #000; background: url(../images/ico_04_1.jpg) no-repeatcentercenter; background-size: 40px }
.about.xlwb { background: url(../images/ico_05.png) no-repeatscrollcentercenter; background-size: 40px }
.about.xlwb:hover { color: #000; background: url(../images/ico_05_1.jpg) no-repeatcentercenter; background-size: 40px }
.about.wx { background: url(../images/ico_07.png) no-repeatcentercenter; background-size: 40px }
.about.wx:hover { color: #000; background: url(../images/ico_07_1.jpg) no-repeatcentercenter; background-size: 40px }
.about.wxpic { position: relative }
.about.wxpicimg { display: none; position: absolute; bottom: 55px; right: -10px; width: 100px; }
.about.wxpic:hoverimg { display: block; border: #ddd5pxsolid }
.about.txqq { background: url(../images/ico_06.png) no-repeatcentercenter; background-size: 40px }
.about.txqq:hover { color: #000; background: url(../images/ico_06_1.jpg) no-repeatcentercenter; background-size: 40px }
/*tjlm*/.tjlm { border: #ddd1pxsolid; background: #fff; margin-bottom: 15px; }
.tjlmul { overflow: hidden; padding: 20px }
.tjlmli { float: left; width: 49.5%!important; margin: 0-3px-1px2px; line-height: 28px; text-align: center; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; }
.tjlmlia { padding: 5px0; display: block; border: 1pxsolid#ddd; }
.tjlmlia:hover { background: #07d; color: #fff!important; border: 1pxsolid#07d; transition: all.1sease-in0s; }
/*tpjx*/.tpjx { border: #ddd1pxsolid; background: #fff; margin-bottom: 15px; }
.tpjxul { padding: 10px; overflow: hidden }
.tpjxli { position: relative; float: left; width: 50%; height: 100px; overflow: hidden; }
.tpjxlii { display: block; overflow: hidden; margin: 5px2px; }
.tpjxliimg { width: 100%; min-height: 100px; -moz-transition: all.5sease; -webkit-transition: all.5sease; -ms-transition: all.5sease; -o-transition: all.5sease; transition: all.5sease; transition: all0.5s }
.tpjxlispan { display: block; position: absolute; bottom: -5px; margin: 5px2px; opacity: 0; background: rgba(0,0,0,.7); font-size: 14px; padding: 010px; -moz-transition: all.5sease; -webkit-transition: all.5sease; -ms-transition: all.5sease; -o-transition: all.5sease; transition: all.5sease; transition: all0.5s }
.tpjxli:hoverspan { opacity: 1; color: #FFF }
.tpjxli:hoverimg { transform: scale(1.1) }
/*links*/.links { border: #ddd1pxsolid; background: #fff; margin-bottom: 15px; }
.linksul { padding: 10px; overflow: hidden }
.linksli { width: 47%!important; float: left; border: 1pxsolid#ddd; line-height: 30px; text-align: center; margin: 3px }
/*about*/.aboutbox { margin-bottom: 15px; }
.place { background: url(../images/dw.png) no-repeatleft5pxcenter#FFF; font-size: 14px; font-weight: normal; border: #ddd1pxsolid; line-height: 38px; padding-left: 30px; margin-bottom: 10px }
.abinfos { background: #FFF; padding: 20px; border: #ddd1pxsolid; }
.abinfosh3 { font-size: 18px; padding: 0010px }
.abinfosp { margin: 0010px }
/*pagelist*/.pagelist { text-align: right; color: #666; width: 100%; clear: both; margin: 25px05px0; padding-top: 20px }
.pagelista { color: #666; margin: 02px10px; border: 1pxsolid#fff; padding: 5px10px; background: #FFF; display: inline-block; }
.pagelista:hover { color: #0077dd; }
.pagelist > b { border: 1pxsolid#0077dd; padding: 5px10px; background: #0077dd; color: #FFF }
a.curPage { color: #19585d; font-weight: bold; }
/*sharelist*/.sharelist { background: #fff; overflow: hidden; border: #ddd1pxsolid; clear: both; }
.sharelistul { overflow: hidden; padding: 20px10px; position: relative }
.sharelistul:before { content: ""; position: absolute; background: #fff; width: 1px; height: 100%; left: 10px }
.sharelistul:after { content: ""; position: absolute; background: #fff; width: 100%; height: 1px; bottom: 20px; left: 0; }
.sharelistli { float: left; width: 27.6%; border-bottom: #ccc1pxsolid; border-left: #ccc1pxsolid; overflow: hidden; padding: 20px; -moz-transition: all.5sease; -webkit-transition: all.5sease; transition: all.5sease; }
.sharelist.tpic { width: 100%; height: 150px; overflow: hidden; background: #CCC; }
.sharelist.tpicimg { display: inline-block; width: 100%; min-height: 100%; height: auto; vertical-align: middle; transition: all.5sease-out.1s; }
.sharelistlib { display: block; width: 100%; overflow: hidden; height: 30px; line-height: 30px; margin: 10px0; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; }
.sharelistlispan { color: #999; overflow: hidden; text-overflow: ellipsis; -webkit-box-orient: vertical; display: -webkit-box; -webkit-line-clamp: 3; font-size: 14px; height: 88px; }
.sharelista.ayulan { float: right; color: #333; }
.sharelist.readmore { margin: 10px000; color: #096; display: block; }
.sharelist.readmore:before { content: "+"; color: #063 }
.sharelistli:hover { background: #fff; box-shadow: #ccc1px1px8px; }
.sharelistli:hoverimg { transform: scale(1.1) }
/*fengm*/.fengm { background: #fff; overflow: hidden; clear: both; border: #ddd1pxsolid; margin-bottom: 15px; }
.fengmh3 { background: #f8f8f8; font-size: 15px; border-bottom: 1pxsolid#ddd; height: 38px; line-height: 38px; padding: 020px }
.fengmh3span { font-weight: normal; float: right; font-size: 14px }
.fengm.fpicbox { padding-left: 15px; clear: both; overflow: hidden }
.fengm.fpic { width: 32%; overflow: hidden; display: block; float: left; margin: 10px8px5px0; height: 150px; position: relative }
.fengm.fpici { position: absolute; font-style: normal; bottom: 0; left: 0; background: rgba(0,0,0,.7); display: block; width: 100%; color: #FFF; padding: 10px0; opacity: 0; -moz-transition: all.5sease; -webkit-transition: all.5sease; -ms-transition: all.5sease; -o-transition: all.5sease; transition: all.5sease; transition: all0.5s; }
.fengm.fpicimg { width: 100%; -moz-transition: all.5sease; -webkit-transition: all.5sease; -ms-transition: all.5sease; -o-transition: all.5sease; transition: all.5sease; transition: all0.5s; min-height: 150px }
.fengm.fpic:hoveri { opacity: 1 }
.fengm.fpic:hoverimg { transform: scale(1.1) }
.fmnews { margin: 20px; clear: both }
.fmnewsli { background: url(../images/li.png) no-repeatleftcenter; padding-left: 20px; line-height: 30px;    text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden; }
.fmnewslispan { float: right; color: #999 }
.fmnewsli:hovera { color: #00A7EB; }
/*info*/.infosbox { border: #ddd1pxsolid; overflow: hidden; background: #fff; margin-bottom: 15px }
.newsview { padding: 030px }
.intitle { line-height: 40px; height: 40px; font-size: 14px; ; border-bottom: #0002pxsolid; }
.intitlea { font-weight: normal; }
.news_title { font-size: 24px; font-weight: normal; padding: 20px0; color: #333; }
.infosbox.bloginfo { width: 100%; overflow: hidden; margin-bottom: 10px; clear: both }
.infosbox.bloginfoul { overflow: hidden }
.infosbox.bloginfoli { float: left; margin-right: 20px }
.news_about { color: #888888; border: 1pxsolid#F3F3F3; padding: 10px; margin: 20pxauto15pxauto; line-height: 23px; background: nonerepeat00#F6F6F6; }
.news_aboutstrong { color: #38485A; font-weight: 400!important; font-size: 13px; padding-right: 8px; }
.news_content { line-height: 24px; font-size: 14px; }
.news_contentp { overflow: hidden; padding-bottom: 4px; padding-top: 6px; word-wrap: break-word; }
.tagsa { background: #F4650E; padding: 3px8px; margin: 05px00; color: #fff; display: block; float: left }
.tags { width: 100%; overflow: hidden; clear: both }
.infosboximg { max-width: 620px; height: auto; }
.share { padding: 20px; }
.nextinfo { line-height: 24px; width: 100%; overflow: hidden; margin: 20px0; background: #FFF; }/*上一篇下一篇*/.nextinfop { padding: 4px10px; border-radius: 5px; }
.nextinfoa:hover { color: #000; text-decoration: underline }
/*pinglun*/.news_pl { margin: 10px020px; width: 100%; overflow: hidden; background: #FFF; }
.news_plh2 { border-bottom: #0002pxsolid; line-height: 40px; font-size: 14px; padding-left: 10px; color: #000 }
.diggit { width: 160px; margin: auto; background: #E2523A; color: #fff; box-shadow: 1px2px6px0pxrgba(0,0,0,.2); border-radius: 3px; line-height: 40px; text-align: center; }
.diggita { color: #fff; }
#diggnum { margin: 5px; }
/*otherlink*/.otherlink, .xzsm, .ffsm { width: 100%; background: #FFF; border-radius: 10px; overflow: hidden; margin: 20px0 }
.otherlinkh2 { border-bottom: #0002pxsolid; line-height: 40px; font-size: 14px; padding-left: 10px; color: #000 }
.otherlinkul { margin: 10px0 }
.otherlinkli { line-height: 24px; height: 24px; display: block; width: 45%; float: left; overflow: hidden; padding-left: 10px; }
.otherlinklia:hover { text-decoration: underline; color: #000 }
/*time*/.timebox { background: #FFF; padding: 30px }
.timeboxspan { position: relative; line-height: 32px; padding-right: 40px; color: #999 }
.timeboxspan:after { position: absolute; content: ""; width: 2px; height: 40px; background: #e0dfdf; right: 18px }
.timeboxli { text-overflow: ellipsis; white-space: nowrap; overflow: hidden; }
.timeboxlii { position: relative; font-style: normal }
.timeboxlii:before { content: " "; height: 10px; width: 10px; border: 2pxsolid#cccaca; background: #fff; position: absolute; top: 4px; left: -26px; border-radius: 50%; -webkit-transition: all.5sease; -moz-transition: all.5sease; -ms-transition: all.5sease; -o-transition: all.5sease; transition: all.5sease; }
.timeboxli:hoveri:before { background: #3690cf }


  博客趣wordpress个人博客主题静态模板演示www.bokequ.com/blog/15/

目录
相关文章
|
4月前
【wordpress教程】wordpress博客网站添加非法关键词拦截
有的网站经常被恶意搜索,站长们不胜其烦。那我们如何屏蔽恶意搜索关键词呢?下面就随小编一起来解决这个问题吧。
80 1
|
5月前
|
移动开发 前端开发 语音技术
WordPress轻拟物博客主题niRvana 4.5.3(自适应手机端)
WordPress轻拟物主题niRvana,设计上不再趋从于现有的扁平风,我认为是时候从极致的扁平稍微向拟物致敬了,因此采用了轻拟物的风格。niRvana 设计和样式更加新颖,一眼看上去就会被他吸引住,主题配色也非常舒服。而且它有两个功能特别有意思,一个是自动根据文章特色图片识别出图片的主色调,在首页、文章分类页用最美的方式显示滚动图片,另一个则是文章支持语音朗读。主题细腻有质感,手机端体验非常好。
87 2
|
4月前
|
前端开发
WordPress主题Rizhuti-V2广告位模块美化
WordPress主题Rizhuti-V2广告位模块美化
44 0
|
1月前
|
域名解析 弹性计算 程序员
想要轻松地搭建一个即开即用的WordPress博客吗?借助宝塔面板镜像+阿里云ECS,迅速拥有自己的个人博客
拥有个人博客是每位程序员的梦想,但对服务器不熟悉的初学者而言,搭建博客颇具挑战。本文介绍利用阿里云市场的宝塔面板镜像与ECS云服务器,轻松搭建WordPress博客的方法,让您快速拥有专属博客空间。通过简单的操作步骤,即使是新手也能轻松上手,实现从零到有的博客搭建过程。
163 3
|
1月前
|
弹性计算 JSON 关系型数据库
使用ROS模板基于ECS和RDS创建WordPress环境
使用ROS模板基于ECS和RDS创建WordPress环境
|
1月前
|
弹性计算 监控 安全
利用WordPress 模板建站,如果利用阿里云国际版获取网站高流量
利用WordPress 模板建站,如果利用阿里云国际版获取网站高流量
|
2月前
|
PHP SEO
WordPress博客每日定时发布 每天60秒读懂世界源码
WordPress博客每日定时发布 每天60秒读懂世界源码
56 0
WordPress博客每日定时发布 每天60秒读懂世界源码
|
4月前
|
SEO
WordPress作品设计素材图片站资讯文章教程uigreat主题
WordPress作品设计素材图片站资讯文章教程uigreat主题
42 4
WordPress作品设计素材图片站资讯文章教程uigreat主题
|
4月前
|
存储 前端开发 定位技术
关于如何用wordpress搭建付费资源网站,modown付费主题推荐
关于如何用wordpress搭建付费资源网站,modown付费主题推荐
关于如何用wordpress搭建付费资源网站,modown付费主题推荐
|
5月前
|
前端开发 数据安全/隐私保护 SEO
一款基于WordPress开发的高颜值的自适应主题Puock
支持白天与暗黑模式 全局无刷新加载 支持博客与CMS布局 内置WP优化策略 一键全站变灰 网页压缩成一行 后台防恶意登录 内置出色的SEO功能 评论Ajax加载 文章点赞、打赏 支持Twemoji集成 支持QQ登录 丰富的广告位 丰富的小工具 自动百度链接提交 众多页面模板 支持评论可见 支持密码可见 支持Dplayer播放器 简约快捷的后台配置 更多功能,等你的提议
60 2
一款基于WordPress开发的高颜值的自适应主题Puock