06/24/17 | Mys2010 on Codepen

Memasang kode Full Screen Background
Login ke akun blog klik tombol blog baru, buat satubuah link baru
kemudian beri nama sesuai fungsi, klik Edit HTML pada link baru tersebut,
hapus semua kode template, ganti dengan kode blank template, yang tersedia pada sumber berikut ini : Blank Template edit background warna sesuai keinginan dan klik simpan selesai

Kemudian klik entri halaman baru HTML pada link tersebut
copy kode dibawah ini, pastekan kedalam halaman baru tersebut dan klik simpan selesai

<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="//netdna.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<style class="Mys2010-styles">
@import url(https://fonts.googleapis.com/css?family=Satisfy|Pathway+Gothic+One);
body {background-image: url();color:red;height:100%;overflow:hidden;}
.ap {
position: fixed;
right: 0;
bottom: -4px;
left: 0;
height: 60px;
margin: auto;
font-family: Arial, sans-serif;
font-size: 10px;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
text-align: center; 
font-size:  11px;
background:#060;
border-top: 2px solid rgba(46, 56, 79, 0.85);
z-index: 9999;
} 
h2 {
padding:-7px; 
background: -webkit-linear-gradient(#000; 10%,#4f9bb5;50%, transparent 90%); 
background: linear-gradient(transparent 10%, #161; 50%, transparent 90%); 
} 
#M-2010, #teks, #posisi, #dibawah  {
    position: absolute;
    font-size: 11px;
    margin: 2px
}
#M-2010, #teks div {
    text-decoration: underline;
    cursor: pointer
}
#teks, #posisi {
    text-align: right;
    right:  50px;
}
#teks, #dibawah {
    text-align: left;
    left:  50px;
}
 #dibawah, #posisi {
    bottom:24px;
}/*end*/
body {
/*css for full size background image*/
  background: url(http:/Link Gambar) no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;  
  height: 100%;
  background-color: #060;
  color: #fff;
  text-align: center;
  text-shadow: 0 1px 3px rgba(0,0,0,.5); 
}
.site-wrapper {
  display: table;
  width: 100%;
  height: 100%; /* For at least Firefox */
  min-height: 100%;
  -webkit-box-shadow: inset 0 0 100px rgba(0,0,0,.5);
          box-shadow: inset 0 0 100px rgba(0,0,0,.5);
}
.site-wrapper-inner {
  display: table-cell;
  vertical-align: top;
}
.cover-container {
  margin-right: auto;
  margin-left: auto;
}
.inner {
  padding: 30px;
}
* Header*/
.masthead-brand {
  margin-top: 10px;
  margin-bottom: 10px;
}
.masthead-nav > li {
  display: inline-block;
}
.masthead-nav > li + li {
  margin-left: 20px;
}
 
@media (min-width: 992px) {
  .masthead,
  .mastfoot,
  .cover-container {
    width: 700px;
  }
}
/*text*/
h1 {
  font-family: 'Satisfy', 'cursive';
  font-size: 2.5em;
}

h2, p {
  font-family: 'Pathway Gothic One', 'sans-serif';
  font-size: 2em;
}

h1, h2, p {
  text-align: center;
  display: block;
  width: auto;
  margin: 1%;
}
.button {
    background-color: #4CAF50; /* Green */
    border: none;
    color: white;
    padding: 15px 32px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 16px;
    margin: 4px 2px;
    cursor: pointer;
}
.button1 {background-color: #808;}
.button2 {background-color: #888;} 
.button3 {background-color: #669;} 
.button4 {background-color: #777;}  
</style>

<div class="site-wrapper">
  <div class="site-wrapper-inner">
    <div class="cover-container">
      <div class="masthead clearfix">
        <div class="inner">
<div class="ap" id="ap">
<div align="center">
<div id="dibawah">
<span style="font-family:arial;font-size:12px;color:#eae;"> EDITED BY. <a href="https://Link Download"title="Download Full Code"><span style="color: #FFFF00; font-size: 14px;">&nbsp; M - 2010 </a>&nbsp; DOWNLOAD </a> 
</div>
<div id="posisi">
<span style="font-family:arial;font-size:12px;color:#eae;"> COPYRIGHT <a href="https://www.instagram.com/myscript2010/"target="_blank"title="InstanG"><span style="color: #FFFF00; font-size: 14px;">&nbsp; &copy; - 2017 </a>&nbsp; INSTAGRAM </a> 
</div>
<h2>
<div align="center">
<a href="http://sample-mys2010.blogspot.co.id/p/statis-home.html" target="_blank" title="Visit Website"><img class="expando" border="0" src="https://sites.google.com/site/code6916/file/M-2010.png" width="140"height="10"></h2>
</a></div>
</div>

<meta name="viewport"content="width=device-width,initial-scale=1.0">
<body data-spy="scrolll" data-target=".navbar" data-offset="150">
<nav class="navbar navbar-inverse navbar-fixed-top" style="background-color:#060;">
          <div class="container-fluid">
              <div class="navbar-header">                 
                 <a class="navbar-brand" href="http://sule-parallax.blogspot.co.id/2017/04/quote-share.html"target="_blank"title="Quote share"> <i class="fa fa-share-square-o"style="font-size:14px;color:#dad">&nbsp;QUOTE</a></i></li>
    <a class="navbar-brand" href="http://sample-mys2010.blogspot.co.id"target="_blank"title="Mari Belajar"> 
<i class="fa fa-chain"style="font-size:14px;color:ff0">&nbsp;VISIT</a></i></li>
<a class="navbar-brand" href="http://sule-parallax.blogspot.co.id/2017/04/don-williams-i-would-like-to-see-you.html"target="_blank"title="My Music"> 
<i class="fa fa-music"style="font-size:14px;color:#ff0;">&nbsp; MUSIC</a></i></li>
      </div>
<div class="collapse navbar-collapse" id="myNavbar">
      <ul class="nav navbar-nav navbar-right">
<!-- Tr-2010 -->
    <div class="collapse navbar-collapse" id="myNavbar">
      <ul class="nav navbar-nav navbar-right">
<a class="navbar-brand" href="https://Link Download"title="Download Full Code"> 
<i class="fa fa-download"style="font-size:14px;color:#eee"> &nbsp;GETCODE</a></i></li>
<a class="navbar-brand" href="http://sule-tema.blogspot.co.id/2017/06/ada-apa-dengan-web.html"target="_blank"title="Behind the future"> 
<i class="fa fa-user-md"style="font-size:14px;color:ff0"> &nbsp;FUTURE</a></i></li>
<a class="navbar-brand" href="http://sule-hiburan.blogspot.co.id/2017/04/connie-cover.html"target="_blank"title="Music Cover"> 
<i class="fa fa-headphones"style="font-size:14px;color:#dad"> &nbsp;COVER</a></i></li>
<a class="navbar-brand" href="#"><span class="glyphicon glyphicon-search"style="font-size:14px;color:#ff0"></span></a></li>
      </ul>
          </div>
        </div>
     </div>
 </nav>

<div class="inner cover">
<h1 class="cover-heading">Sitemap </h1>  
<h1 class="cover-heading">Full screen background </h1>
<p class="lead">Select the menu available as you like, get the code provided
<small> 
<br> 
 <br>
  <br>
    <br>
<a href="https://Link Judul"target="_blank" title="Myscript2010">
<button class="button button1">Read More </button></a> 

<a href="https://Link Judul"target="_blank" title="Myscript2010">
<button class="button button2">Read More </button></a> 

<a href="https://Link Judul"target="_blank" title="Myscript2010">
<button class="button button3">Read More </button></a> 

<a href="https://Link Judul"target="_blank" title="Myscript2010">
<button class="button button4">Read More </button></a> 
 </p>
</div>
  <div class="mastfoot">
    <div class="inner"> 
          <!-- Validation -->
<p><a href="http://Link Judul"target="_blank">
<small>M-2010</small><sup>@</sup></a></p>
  
        </div>
      </div>
    </div>
</div>
</div>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
</body>
</html>

Code by. Bootstrap/snipp
Design Code is Edited by. M-2010

DEMOSHOW

* If you want to directly copy and paste you canDownload  Full Screen Background

Category: Full Screen Background

Mys2010 on Codepen

Full Screen Background

POPULAR

Blog Archive