Toggle navigation
Bootsnipp
Bootstrap
For
CSS Frameworks
Bootstrap
Foundation
Semantic UI
Materialize
Pure
Bulma
References
CSS Reference
Tools
Community
Page Builder
Form Builder
Button Builder
Icon Search
Dan's Tools
Diff / Merge
Color Picker
Keyword Tool
Web Fonts
.htaccess Generator
Favicon Generator
Site Speed Test
Snippets
Featured
Tags
By Bootstrap Version
4.1.1
4.0.0
3.3.0
3.2.0
3.1.0
3.0.3
3.0.1
3.0.0
2.3.2
Register
Login
"CV resum ready to print pdf #beta "
Bootstrap 4.0.0 Snippet by
shu3aybbadran
4.0.0
Preview
HTML
CSS
View Full Screen
Fork
Fork this
3.6K
 
1 Fav
Post to Facebook
Tweet this
<link href="//maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js"></script> <script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> <!------ Include the above in your HEAD tag ----------> <!-- AlphaD - CV maker * Version: 1.0 * Build Date : 27 3 2018 * Last Update : - [] * Author: ALPhA D * Website: www.alphadsy.com * Github: www.alphadsy.github.io --> <!DOCTYPE html> <html lang="en"> <head> <!-- meta tags --> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1"> <!-- website meta --> <!-- set website Info --> <meta name="description" content="alphad web development"> <meta name="keywords" content="alphad, web development, syria"> <meta name="author" content="ALPHA D"> <!-- set Website Title --> <title>AlphaD</title> <!-- Favicon set link to website favicon in href="" ex:href="img/icon.png" --> <link href="#" rel="icon" type="image/png"> <!-- css --> <!-- Bootstrap 4 --> <link href="vendor/css/bootstrap.css" rel="stylesheet" media="all"> <!-- font-awesome icons --> <link href="http://maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css" rel="stylesheet"> <!-- cv css --> <link href="css/cv.css" rel="stylesheet" media="all"> <!-- template css --> <link href="css/template.css" rel="stylesheet" media="all"> </head> <body> <div class="cv a4 print"> <!-- title: personal information --> <section class="title"> <h1 class="name">Jone Doe<span class="dot">.</span></h1> <p class="slogan">Web developer and Dreamer </p> </section> <!-- description: basic description --> <section class="discription"> <p>Hey! i'm<b>jone Doe</b> from <b>syria</b> <b>25</b>years old, study <b>it</b> and work for several big prjects</b></p> </section> <!-- education --> <section class="education"> <h4>Education</h4> <!-- edu#1 --> <div class="entry"> <h6><i class="fa fa-book"></i> study <b>it</b></h6> <p>in<b>University</b> from <b>2017</b>. </p> </div> <!-- edu#2 --> <div class="entry"> <h6><i class="fa fa-book"></i> study <b>it</b></h6> <p>in<b>University</b> from <b>2017</b>. </p> </div> </section> <!-- Volunteer --> <section class="Volunteer"> <h4>vlounteer work</h4> <div class="row"> <div class="left col-6"> <!-- vol#1 --> <div class="entry"> <h6><i class="fa fa-youtube"></i>volunteer work </h6> <p>lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem </p> <p>alphadsy.com</p> </div> </div> <div class="right col-6"> <!-- vol#2 --> <h6><i class="fa fa-youtube"></i>volunteer work </h6> <p>lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem lorem </p> <p>alphadsy.com</p> </div> </div> </div> </section> <!-- contact --> <section class="contact"> <h4>contact us</h4> <div class="row"> <div class="left col-6"> <ul class="list-unstyled"> <li class=""><i class="fa fa-map-marker"></i>syria - tartus</li> <li class=""><i class="fa fa-mobile"></i>0900000000</li> </ul> </div> <div class="right col-6"> <ul class="list-unstyled"> <li class=""><i class="fa fa-facebook"></i>jone doe</li> <li class=""><i class="fa fa-linkedin"></i>jone doe</li> <li class=""><i class="fa fa-envelope"></i>jone doe@yahoo</li> </ul> </div> </div> </section> </div><!-- /.a4 --> </body> </html>
/** AlphaD - CV maker * Version: 1.0 * Build Date : 27 3 2018 * Last Update : - [] * Author: ALPhA D * Website: www.alphadsy.com * Github: www.alphadsy.github.io [Layout] +cv +section [Color codes] [Typography] [content table] */ /** AlphaD - CV maker * Version: 1.0 * Build Date : 27 3 2018 * Last Update : - [] * Author: ALPhA D * Website: www.alphadsy.com * Github: www.alphadsy.github.io [Layout] +cv +size +section [Color codes] [Typography] [content table] */ body { background-color: #eee; } .cv { color: #fff; } .a4 { position: relative; max-width: 100%; max-height: 100%; background-color: #fff; border-radius: 15px; } section { padding: 2rem; text-align: center; } section h4 { padding-bottom: 1.5rem; font-weight: 600; } section .entry { padding-bottom: 2rem; } section .entry h6{ font-weight: 700; } /* ========================= print only style ======================== */ @media print { body { background-color: #fff; } .cv { margin: 0; box-shadow: none; } .a4 { position: relative; max-width: 100%; max-height: 100%; background-color: #fff; border-radius: 0; } .a4::after { visibility: hidden; } } ====== .cv { color: #fff; } .title { text-align: center; padding-bottom: 1.5rem; background: linear-gradient(to right, #443a8b, #443a8b); } .name { font-size: 2.5rem; } .dot { color:#F11712; } .slogan { margin-top: .5rem; letter-spacing: 3px; } .discription { background: linear-gradient(to right, #443a8b, #443a8b); } .education { color: #000; } .education h4{ color: #443a8b; } .Volunteer { background: linear-gradient(to right, #383075, #443a8b); } .contact { color: #000; } .contact h4{ color: #443a8b; } .left { } .right { } i { color:#F11712; padding-left: 5px; opacity: .8; }
Related:
See More
Template
Vue Paper Dashboard 2 PRO
47.9K
43
Modal for beta invite
Questions / Comments:
Post
Posting Guidelines
Formatting
- Now
×
Close
Donate
BTC: 12JxYMYi6Vt3mx3hcmP3B2oyFiCSF3FhYT
ETH: 0xCD715b2E3549c54A40e6ecAaFeB82138148a6c76