Fake-book

Developer
Mike Otis
Size
4,014 Kb
Views
2,024
  1. Fake-book Previews
  2. Fake-book HTML Codes
  3. Fake-book CSS Codes

How do I make an fake-book?

What is a fake-book? How do you make a fake-book? This script and codes were developed by Mike Otis on 30 January 2023, Monday.

Fake-book Previews
IQ Test

Fake-book - Script Codes HTML Codes

<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>Fake-book</title> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/5.0.0/normalize.min.css"> <link rel='stylesheet prefetch' href='https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/css/bootstrap.min.css'> <link rel="stylesheet" href="css/style.css">
</head>
<body> <body> <nav class="navbar" <div class="container-fluid"> <div class="navbar-header col-xs-4 logo"> <i class="logo">fakebook</i> </div> <div class="collapse navbar-collapse col-xs-5" id="bs-example-navbar-collapse-1"> <form class="navbar-form navbar-right"> <div class="form-group email"> <label>Email or Phone</label> <input type="text" class="form-control email folder" placeholder=""> </div> <div class="form-group email"> <label>Password</label> <input type="text" class="form-control phone folder" placeholder=""> </div> <button type="submit" class="btn btn-danger login-button"><i class="login">Login</i></button> </form> </div> <!-- /.navbar-collapse --> </div> <!-- /.container-fluid --> </nav> <!-- Columns are always 50% wide, on mobile and desktop --> <div class="row"> <div class="col-xs-6 fake-book-img"><img src="https://res.cloudinary.com/mikeotis/image/upload/v1478777673/fakebook_mbcxcv.png" /> <h3>Thanks for stopping by!</h3> <h4> We hope to see you again soon. </h4> </div> <div class="col-xs-6"> <h1 id="sign-up">Sign up</h1> <p> It's free and always will be. </p> <form> <div class="form-group name"> <input type="text" class="form-control signup firstname" placeholder="First Name"> </div> <div class="form-group signup name"> <input type="lastName" class="form-control signup lastname" id="exampleInputPassword1" placeholder="Last name"> </div> <div class="form-group signup"> <input type="email" class="form-control signup exampleInputEmail1" placeholder="Mobile number or email"> </div> <div class="form-group signup"> <input type="email" class="form-control signup exampleInputEmail1" placeholder="Re-enter mobile number or email"> </div> <div class="form-group signup"> <input type="email" class="form-control signup exampleInputEmail1" placeholder="New password"> </div> </form> <p> Birthday </p> <div class="dropdown"> <button class="btn btn-primary dropdown-toggle" type="button" data-toggle="dropdown">Month <span class="caret"></span></button> <ul class="dropdown-menu"> <li><a href="#">Jan</a></li> <li><a href="#">Feb</a></li> <li><a href="#">Mar</a></li> <li><a href="#">Apr</a></li> <li><a href="#">May</a></li> <li><a href="#">Jun</a></li> <li><a href="#">Jul</a></li> <li><a href="#">Aug</a></li> <li><a href="#">Sep</a></li> <li><a href="#">Oct</a></li> <li><a href="#">Nov</a></li> <li><a href="#">Dec</a></li> </ul> </div> <div class="dropdown"> <button class="btn btn-primary dropdown-toggle" type="button" data-toggle="dropdown">Day <span class="caret"></span></button> <ul class="dropdown-menu"> <li><a href="#">1</a></li> <li><a href="#">2</a></li> <li><a href="#">3</a></li> <li><a href="#">4</a></li> <li><a href="#">5</a></li> <li><a href="#">6</a></li> <li><a href="#">7</a></li> <li><a href="#">8</a></li> <li><a href="#">9</a></li> <li><a href="#">10</a></li> <li><a href="#">11</a></li> <li><a href="#">12</a></li> <li><a href="#">13</a></li> <li><a href="#">14</a></li> <li><a href="#">15</a></li> <li><a href="#">16</a></li> <li><a href="#">17</a></li> <li><a href="#">18</a></li> <li><a href="#">19</a></li> <li><a href="#">20</a></li> <li><a href="#">21</a></li> <li><a href="#">22</a></li> <li><a href="#">23</a></li> <li><a href="#">24</a></li> <li><a href="#">25</a></li> <li><a href="#">26</a></li> <li><a href="#">27</a></li> <li><a href="#">28</a></li> <li><a href="#">29</a></li> <li><a href="#">30</a></li> <li><a href="#">31</a></li> </ul> </div> <div class="dropdown"> <button class="btn btn-primary dropdown-toggle" type="button" data-toggle="dropdown">Year <span class="caret"></span></button> <ul class="dropdown-menu"> <li><a href="#">2016</a></li> <li><a href="#">2015</a></li> <li><a href="#">2014</a></li> <li><a href="#">2013</a></li> <li><a href="#">2012</a></li> <li><a href="#">2011</a></li> <li><a href="#">2010</a></li> <li><a href="#">2009</a></li> <li><a href="#">2008</a></li> <li><a href="#">2007</a></li> <li><a href="#">2006</a></li> <li><a href="#">2005</a></li> <li><a href="#">2004</a></li> <li><a href="#">2003</a></li> <li><a href="#">2002</a></li> <li><a href="#">2001</a></li> <li><a href="#">2000</a></li> <li><a href="#">1999</a></li> <li><a href="#">1998</a></li> <li><a href="#">1997</a></li> <li><a href="#">1996</a></li> <li><a href="#">1995</a></li> <li><a href="#">1994</a></li> <li><a href="#">1993</a></li> <li><a href="#">1992</a></li> <li><a href="#">1991</a></li> <li><a href="#">1990</a></li> <li><a href="#">1989</a></li> <li><a href="#">1987</a></li> <li><a href="#">1986</a></li> <li><a href="#">1985</a></li> <li><a href="#">1</a></li> <li><a href="#">2</a></li> <li><a href="#">3</a></li> <li><a href="#">4</a></li> <li><a href="#">5</a></li> <li><a href="#">6</a></li> <li><a href="#">7</a></li> <li><a href="#">8</a></li> <li><a href="#">9</a></li> <li><a href="#">10</a></li> <li><a href="#">11</a></li> <li><a href="#">12</a></li> <li><a href="#">13</a></li> <li><a href="#">14</a></li> <li><a href="#">15</a></li> <li><a href="#">16</a></li> <li><a href="#">17</a></li> <li><a href="#">18</a></li> <li><a href="#">19</a></li> <li><a href="#">20</a></li> <li><a href="#">21</a></li> <li><a href="#">22</a></li> <li><a href="#">23</a></li> <li><a href="#">24</a></li> <li><a href="#">25</a></li> <li><a href="#">26</a></li> <li><a href="#">27</a></li> <li><a href="#">28</a></li> <li><a href="#">29</a></li> <li><a href="#">30</a></li> <li><a href="#">31</a></li> </ul> </div> <a href="#">Why do I need to provide my birthday?</a> <div group> <div class="checkbox"> <label> <input type="checkbox" id="checkboxError" value="option1"> Female </label> </div> <div class="checkbox"> <label> <input type="checkbox" id="checkboxmale" value="option1"> Male </label> </div> </div> <p class="clicking"> By clicking Sign Up, you agree to our <a href="#">Terms</a> and that you have <br />read our <a href="#">Data Policy,</a> including our <a>Cookie Use.</a> </p> <!-- Indicates a successful or positive action --> <button type="button" class="btn btn-success">Sign Up</button> <p class="create"> <a>Create a Page</a> for a celebrity,band or business. </p> </div> </div> <footer> <div class="languages"> <span class="lang-sm lang-lbl" lang="en"></span> <span class="lang-sm lang-lbl" lang="en"></span> &nbsp; <span class="lang-sm lang-lbl" lang="ja"></span>&nbsp; <span class="lang-sm lang-lbl" lang="ar"></span> <span class="lang-sm lang-lbl-full" lang="pt"></span> <span class="lang-sm lang-lbl-full" lang="it"></span> <span class="lang-sm lang-lbl-full" lang="ko"></span> <span class="lang-sm lang-lbl-full" lang="nl"></span> <span class="lang-sm lang-lbl-full" lang="hi"></span> </div> <div> <a>Sign Up</a> <a>Login</a> <a>Messengar</a> <a>Fakebook Lite</a> <a>Mobile</a> <a>Find Friends</a> <a>banner</a> <a>user</a> <a>Fakebook Page</a> <a>spot</a> <a>games</a> </div> <div> <a>locations</a> <a>Celebrity</a> <a>group</a> <a>Moments</a> <a>About Facebook</a> <a>Create and add</a> <a>Create a page</a> <a>Developer</a> <a>Careers</a> <a>privacy</a> <a>Cookies</a> </div> <a>Ad Choice</a> <a>Terms</a> <a>Help</a> <div> <a>Fake book 2016</a> </div> </footer> <!-- jQuery (necessary for Bootstrap's JavaScript plugins) --> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> <!-- Include all compiled plugins (below), or include individual files as needed --> <script src="js/bootstrap.min.js"></script>
</body>
</html>
</body>
</html>

Fake-book - Script Codes CSS Codes

#sign-up{ font-weight: bold;
}
.col-xs-6 { width: 45%;
}
.fake-book-img{
margin-left: 10%;
margin-top: 2%;
}
.logo{ font-size: 40px; color: white; font-style: italic; font-weight: 900;
margin-top:1.5%;
margin-left:66px;
}
.navbar{
background-color: #365899;
height: 78px;
}
.form-control{ width: 194px; height: 39px;
}
.email{ width: 194px; height: 23px; display: inline;
}
.folder{ background-color: rgb(250, 255, 189);
}
.phone{ width: 194px; height: 23px; display: inline;
}
.login-button{
margin-bottom: -50px;
background-color: #29487d; border-color: #365899;
}
.login{ display:flex; justify-content:center; align-items:center; height:11px;
}
body { background: url('https://res.cloudinary.com/mikeotis/image/upload/v1478777704/color_phswjg.png')
}
.row { background: url('https://res.cloudinary.com/mikeotis/image/upload/v1478777704/color_phswjg.png')
}
footer{
background: white;
width: 100%;
margin: 0 auto;
padding: 0;
}
.exampleInputEmail1{ width: 399px;
}
.dropdown{ display: inline-block;
}
.checkbox{ display: inline-block; width: 15%;
}
.group{ width: 100%;
}
.name{ width: 30%; display: inline-block;
}
.lastname{ margin-left: 3em;
}
.create{ padding-top:15px; padding-bottom: 30px;
}
.btn-success{ width:194px; height: 39px;
}
footer{
width: 100%; margin-left: auto; margin-right: auto; text-align: center;
}
footer a{ padding-left:10px; padding-right; font-size:12px; text-align: left;
}
#bs-example-navbar-collapse-1{ margin-left: 215px;
}
label{ color:white;
}
/*This is the button*/
.btn-primary { background-color: #bdc7d8;
}
.btn-primary:focus,
.btn-primary.focus {
}
.btn-default{ width: 36px; height: 18px;
}
.btn-default i{ font-size: 12px; font-weight: bold;
}
.btn-primary:hover {
}
.btn-primary:active,
.btn-primary.active,
.open > .dropdown-toggle.btn-primary { color: background-color: border-color:
}
.btn-primary:active:hover,
.btn-primary.active:hover,
.open > .dropdown-toggle.btn-primary:hover,
.btn-primary:active:focus,
.btn-primary.active:focus,
.open > .dropdown-toggle.btn-primary:focus,
.btn-primary:active.focus,
.btn-primary.active.focus,
.open > .dropdown-toggle.btn-primary.focus { color: background-color: border-color:
}
Fake-book - Script Codes
Fake-book - Script Codes
Home Page Home
Developer Mike Otis
Username mikeotis
Uploaded January 30, 2023
Rating 3
Size 4,014 Kb
Views 2,024
Do you need developer help for Fake-book?

Find the perfect freelance services for your business! Fiverr's mission is to change how the world works together. Fiverr connects businesses with freelancers offering digital services in 500+ categories. Find Developer!

Mike Otis (mikeotis) Script Codes
Name
3 pages in One Website
Codeconquest fake website.
This is the Full Stack Conf build a website with bootstrap course by treehouse
A simple button using hover.
A simple face-book button
A share button
Pro hack advertisement
The HTML version of my website
The Google Home page
A slider web page. Pages are in the slider.
Create amazing sales emails with AI!

Jasper is the AI Content Generator that helps you and your team break through creative blocks to create amazing, original content 10X faster. Discover all the ways the Jasper AI Content Platform can help streamline your creative workflows. Start For Free!