<!DOCTYPE html>
<!-- NOTE!!! This template use custom bootstrap.js file do not remove or change them -->
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta charset="utf-8">
<title>Base page</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="">
<meta name="author" content="">
<!-- Le styles -->
<!-- Le styles -->
<!-- Latest compiled and minified CSS BS 3.0. RC1-->
<link href="css/theme.css" rel="stylesheet">
<link href="assets/css/jquery.mCustomScrollbar.css" rel="stylesheet">
<!-- GOOGLE FONT-->
<link href='http://fonts.googleapis.com/css?family=Roboto:400,300,700italic,700,500&subset=latin,latin-ext' rel='stylesheet' type='text/css'>
<!-- /GOOGLE FONT-->
<style type="text/css">
body {
padding-top: 0px;
padding-bottom: 40px;
padding-top: 0px;
padding-bottom: 0px;
font-family: 'Roboto', sans-serif;
}
h1,h2,h3,h4,h5,h6{
font-weight:200;
}
.navbar-inverse .navbar-inner{
-webkit-border-radius: 0px;
-moz-border-radius: 0px;
border-radius: 0px;
background:#282828;
border:none;
}
.page-header{
border:none;
padding: 10px 0px 0px;
margin: 0px 0 0px;
}
.brand{
margin-left:20px;
font-weight:700;
}
.thumbnail{
border:none;
padding:0px;
-webkit-border-radius: 0px;
-moz-border-radius: 0px;
border-radius: 0px;
-webkit-box-shadow: none;
-moz-box-shadow: none;
box-shadow: none;
margin-bottom:20px;
}
.thumbnail img{
min-width:100%;
height:auto;
}
.well {
min-height: 20px;
padding: 19px;
margin-bottom: 20px;
-webkit-border-radius: 0px;
-moz-border-radius: 0px;
border-radius: 0px;
-webkit-box-shadow: none;
-moz-box-shadow: none;
box-shadow: none;
}
.tab-content .tab-pane{
max-height:600px;
position:relative;
overflow:auto;
}
.fixed-top{
position:fixed;
top:0px;
bottom:0px;
display:inline-block;
max-width:360px;
z-index:1030;
}
footer{
padding-top:40px;
margin-top:40px;
border-top:1px solid #dedede;
}
.related-projects{
padding-top:40px;
margin-top:40px;
}
/*************** @media ******************/
@media (max-width: 940px){
.brand {
display:block;
text-align:center;
font-size:26px;
}
}
@media (max-width: 1200px) and (min-width: 940px){
.fixed-top{
max-width:300px;
}
}
@media (max-width: 940px) and (min-width: 768px){
.fixed-top{
max-width:225px;
}
}
</style>
<link href="assets/css/font-awesome.min.css" rel="stylesheet">
<!-- USE PREFIX fa- e.g (<i class="fa-icon-home"></i> -->
<!--[if lt IE 7]>
<link href="assets/css/font-awesome-ie7.min.css" rel="stylesheet">
<![endif]-->
<!-- Fav and touch icons -->
<!-- Le HTML5 shim, for IE6-8 support of HTML5 elements -->
<!--[if lt IE 9]>
<script src="http://html5shim.googlecode.com/svn/trunk/html5.js" type="text/javascript"></script>
<![endif]-->
<!-- Le fav and touch icons -->
<link rel="shortcut icon" href="assets/ico/favicon.ico">
<link rel="apple-touch-icon-precomposed" sizes="144x144" href="assets/ico/apple-touch-icon-144-precomposed.png">
<link rel="apple-touch-icon-precomposed" sizes="114x114" href="assets/ico/apple-touch-icon-114-precomposed.png">
<link rel="apple-touch-icon-precomposed" sizes="72x72" href="assets/ico/apple-touch-icon-72-precomposed.png">
<link rel="apple-touch-icon-precomposed" href="assets/ico/apple-touch-icon-57-precomposed.png">
<body>
<div class="container">
<!-- NAVBAR-->
<!-- Fixed navbar -->
<div class="navbar navbar-inverse">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#">Project name</a>
</div>
<div class="collapse navbar-collapse">
<ul class="nav navbar-nav">
<li class="active"><a href="#">Home</a></li>
<li><a href="#about">About</a></li>
<li><a href="#contact">Contact</a></li>
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown <b class="caret"></b></a>
<ul class="dropdown-menu">
<li><a href="#">Action</a></li>
<li><a href="#">Another action</a></li>
<li><a href="#">Something else here</a></li>
<li class="divider"></li>
<li class="dropdown-header">Nav header</li>
<li><a href="#">Separated link</a></li>
<li><a href="#">One more separated link</a></li>
</ul>
</li>
</ul>
</div><!--/.nav-collapse -->
</div>
</div>
</div>
<div class="page-header">
<div class="container">
<div class="row">
<div class="col-sm-4 col-lg-4">
<a class="brand" href="#">YOURBRAND.COM</a>
</div>
<div class="col-sm-8 col-lg-8">
<div class="well text-center">
<a href="#">#</a> ADDS HERE
</div>
</div>
</div>
<div class="row">
<div class="col-sm-12 col-lg-12">
<p class="alert alert-success" style="text-transform:uppercase; display:inline-block; box-sizing:border-box; -moz-box-sizing:border-box;width:100%;"><span class="label label-important">Announcement:</span> Here goes your news and infos lorem ipsum Here goes your news and infos lorem ipsum
</p>
</div>
</div>
</div>
<!-- PAGE-HEADER-->
</div>
<div class="container">
<!-- Example row of columns -->
<div class="row">
<!-- left SIDE-->
<div class="visible-md visible-lg col-sm-4 col-lg-4">
<div id="left-side-menu">
<div class="well">
<div class="tabbable">
<ul class="nav nav-tabs">
<li class="active"><a href="#1" data-toggle="tab">Popular</a></li>
<li><a href="#2" data-toggle="tab">Latest</a></li>
</ul>
<div class="tab-content">
<div class="tab-pane active" id="1">
<!-- ITEM-->
<div class="row">
<div class="col-sm-8 col-lg-8">
<p>PANE#1 Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.</p>
</div>
<div class="col-sm-4 col-lg-4">
<div class="thumbnail">
<img class="img-responsive" src="images/thumb.png" alt="post image">
</div>
</div>
</div>
<!-- / ITEM-->
<hr>
<!-- ITEM-->
<div class="row">
<div class="col-sm-8 col-lg-8">
<p>Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.</p>
</div>
<div class="col-sm-4 col-lg-4">
<div class="thumbnail">
<img class="img-responsive" src="images/thumb.png" alt="post image">
</div>
</div>
</div>
<!-- / ITEM-->
<hr>
<!-- ITEM-->
<div class="row">
<div class="col-sm-8 col-lg-8">
<p>Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.</p>
</div>
<div class="col-sm-4 col-lg-4">
<div class="thumbnail">
<img class="img-responsive" src="images/thumb.png" alt="post image">
</div>
</div>
</div>
<!-- /
蓝绿色漂亮UI设计博客bootstrap模板_蓝绿
版权申诉
46 浏览量
2021-11-06
12:50:22
上传
评论
收藏 225KB RAR 举报
蓝绿色漂亮UI设计博客bootstrap模板_蓝绿 蓝绿色 绿色 漂亮 设计 博客 blog bootstrap 手机 响应式 个人主页 个人 ui 设计师.rar （11个子文件） 
蓝绿色漂亮UI设计博客bootstrap模板_蓝绿 蓝绿色 绿色 漂亮 设计 博客 blog bootstrap 手机 响应式 个人主页 个人 ui 设计师 btts_8_sk assets js 
bootstrap_mode_blogalt.js 56KB jquery.js 90KB jquery.mCustomScrollbar.js 44KB jquery.localscroll-1.2.7-min.js 2KB css bootstrap.min.css 90KB jquery.mCustomScrollbar.css 13KB css theme.css 129KB
index.html 25KB images 
thumb.png 37KB
thumb1.jpg 38KB responsive-template-for-woman-blog.jpg 76KB资源评论
