Guest User

Untitled

a guest
Oct 22nd, 2017
395
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 12.00 KB | None | 0 0
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8">
  5. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  6. <title>Portfolio</title>
  7. <link rel="stylesheet" href="css/mystyle.css">
  8. <link rel="stylesheet" href="css/font-awesome.css">
  9. <link rel="stylesheet" href="css/bootstrap.css">
  10. </head>
  11. <body>
  12. <!-- header-->
  13. <div class="container-fluid header full-width">
  14. <div style="position: relative; z-index: 1000 ;width: 100%;color: #ffffff" class="row full-width">
  15. <div style="position: absolute; z-index: 999; top: 0;color: #ffffff;width: 100% ">
  16.  
  17. <div class="col-sm-6 logo">
  18. portfolio
  19. </div>
  20. <div class="col-sm-6 ">
  21. <nav>
  22. <ul >
  23. <li><a href="index.html">Home</a></li>
  24. <li><a href="about.html">About</a></li>
  25. <li ><a>Skill</a></li>
  26. <li><a href="FAQ.html">FAQ</a></li>
  27. <li><a href="contact.html">Contact</a></li>
  28. </ul>
  29. </nav>
  30. </div>
  31.  
  32. </div>
  33.  
  34. </div>
  35.  
  36. <!--slider-->
  37. <div class="row full-width ">
  38.  
  39. <div id="myCarousel" class="carousel slide" data-ride="carousel">
  40. <!-- Indicators -->
  41. <ol class="carousel-indicators">
  42. <li data-target="#myCarousel" data-slide-to="0" class="active"></li>
  43. <li data-target="#myCarousel" data-slide-to="1"></li>
  44. <li data-target="#myCarousel" data-slide-to="2"></li>
  45. </ol>
  46.  
  47. <!-- Wrapper for slides -->
  48. <div class="carousel-inner">
  49. <div class="item active">
  50. <img src="img/portfolioheroimage.jpeg" alt="Los Angeles" style="width:100%;">
  51. </div>
  52.  
  53. <div class="item">
  54. <img src="img/portfolioheroimage3.jpeg" alt="Chicago" style="width:100%;">
  55. </div>
  56.  
  57. <div class="item">
  58. <img src="img/lesson8-portfolioheroimage2.jpg" alt="New york" style="width:100%;">
  59. </div>
  60.  
  61. </div>
  62. <!-- Left and right controls -->
  63. <a class="left carousel-control" href="#myCarousel" data-slide="prev">
  64. <span class="glyphicon glyphicon-chevron-left"></span>
  65. <span class="sr-only">Previous</span>
  66. </a>
  67. <a class="right carousel-control" href="#myCarousel" data-slide="next">
  68. <span class="glyphicon glyphicon-chevron-right"></span>
  69. <span class="sr-only">Next</span>
  70. </a>
  71. </div> <!-- header-->
  72. </div>
  73. <div class="container">
  74. <div class="row text-center ">
  75. <div class="col-sm-4">
  76. <h1 class="color-txt">Portfolio Concept</h1>
  77. <p>I would like to create attractive but user-friendly portfolio. Also I will be more concern about technical soundness and skills.Lastly, my portfolio should demonstrate my ability to apply accurate technical methods to modern customer needs apply accurate technical methods to modern customer needs. apply accurate technical methods to modern customer needs.</p>
  78. <input type="button" value="Read More >>" class="button ">
  79. </div>
  80. <div class="col-sm-4">
  81. <h1 class="color-txt">Project Goals</h1>
  82. <p>I am investing my full time with full efforts and targeting 40-50 hours a week. My highest priority is to learn all neccessary basic web development skills, good professional practises.I would like to develop some great portfolio projects ,that show my gained knowledge and in which I can combine my creative design skills with innovative programming.</p>
  83. <input type="button" value="Read More >>" class="button ">
  84. </div>
  85. <div class="col-sm-4 ">
  86. <h1 class="color-txt">Course Goals</h1>
  87. <p>After having studied Civil Engineering, I am declining my career to an all new branch of knowledge of Computer Science. This course is like stepping stone towords an inclusive technical training. After completion the course I would like to do a full-time job. Firstly as a entry level web developer at a company that focusses on interesting web development projects, ultimately as a innovative entrepreneur.</p>
  88. <input type="button" value="Read More >>" class="button ">
  89. </div>
  90. </div>
  91. <!--about us-->
  92. <div class="row padding-section text-center" id="about-me">
  93. <div class="col-sm-6 hidden-xs">
  94. <img src="img/about%20me.jpg" class="img-responsive img-rounded ">
  95. </div>
  96. <div class="col-sm-6">
  97. <h1 class="color-txt">About Me</h1>
  98. <img src="img/title_sepp_2.png" >
  99. <p>Lorem ipsum dolor sit amet, te has semper utroque accusata, hinc prima ei cum. Nec eu regione delectus dignissim, vero ornatus vim cu. Populo labore saperet pri ei, ut sit brute mandamus. Sed ad adhuc omnium incorrupte, consul recteque expetenda mea ex.</p>
  100. <p>Lorem ipsum dolor sit amet, te has semper utroque accusata, hinc prima ei cum. Nec eu regione delectus dignissim, vero ornatus vim cu. Populo labore saperet pri ei, ut sit brute mandamus. Sed ad adhuc omnium incorrupte, consul recteque expetenda mea ex.
  101. Lorem ipsum dolor sit amet, te has semper utroque accusata, hinc prima ei cum. Nec eu regione delectus dignissim, vero ornatus vim cu. Populo labore saperet pri ei, ut sit brute mandamus. Sed ad adhuc omnium incorrupte, consul recteque expetenda mea ex.
  102. </p>
  103. <input type="button" value="Read More >>" class="button ">
  104. </div>
  105. </div>
  106. <!--about us-->
  107. <!--work-->
  108. <div class="row text-center padding-section">
  109. <h1 class="color-txt">My skill</h1>
  110. <div style="padding: 7px"><img src="img/title_sepp_2.png" ></div>
  111. <div class="col-sm-3 ">
  112. <img src="img/work1.jpg" class="img-responsive img-rounded">
  113. <h3>business</h3>
  114. <p>Lorem ipsum dolor sit amet, te has semper utroque accusata, hinc prima ei cum. Nec eu regione delectus dignissim</p>
  115. </div>
  116. <div class="col-sm-3">
  117. <img src="img/work2.jpg" class="img-responsive img-rounded">
  118. <h3>Photography </h3>
  119. <p>Lorem ipsum dolor sit amet, te has semper utroque accusata, hinc prima ei cum. Nec eu regione delectus dignissim</p>
  120. </div>
  121. <div class="col-sm-3">
  122. <img src="img/work3.jpg" class="img-responsive img-rounded">
  123. <h3>Design</h3>
  124. <p>Lorem ipsum dolor sit amet, te has semper utroque accusata, hinc prima ei cum. Nec eu regione delectus dignissim</p>
  125. </div>
  126. <div class="col-sm-3">
  127. <img src="img/work4.jpg" class="img-responsive img-rounded">
  128. <h3>programmer</h3>
  129. </div>
  130. </div>
  131. <!--works-->
  132. <!--FAQ-->
  133. <div class="row padding-section">
  134. <div class="faq-header">Frequently Asked Questions</div>
  135. <div class="faq-c">
  136. <div class="faq-q"><span class="faq-t">+</span>What do you know about html?</div>
  137. </div>
  138. <div class="faq-c">
  139. <div class="faq-q"><span class="faq-t">+</span>What are your skills?</div>
  140. </div>
  141. <div class="faq-c ">
  142. <div class="faq-q"><span class="faq-t">+</span>Do you like to know more about web design?</div>
  143. </div>
  144. </div>
  145. <!--FAQ-->
  146. <!--Contact -->
  147. <div class="row padding text-center padding-section ">
  148. <h1>Contact Us </h1>
  149. <img src="img/title_sepp_2.png" >
  150. <p style="color: grey"> Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat<br/> nulla pariatur</p>
  151. <div class="col-sm-4 col-xs-4">
  152. <img src="img/mail%20(1).png">
  153. <h3>MAIL US</h3>
  154. <h5 style="color:#8A9191 ">Portfolio.info@mail.com </h5>
  155. </div>
  156. <div class="col-sm-4 col-xs-4">
  157. <img src="img/placeholder.png">
  158. <h3>FIND US</h3>
  159. <h5 style="color:#8A9191 ">3000 Dnbu kls, plastine, Gaza 11801, PS</h5>
  160. </div>
  161. <div class="col-sm-4 col-xs-4 " style="padding-bottom: 50px">
  162. <img src="img/phone-call.png">
  163. <h3>CALL US</h3>
  164. <h5 style="color:#8A9191 ">+38 056 23 15 7851</h5>
  165. </div>
  166. </div>
  167.  
  168. <!--Contact -->
  169. <!--about -->
  170. <div class="row text-center boxs">
  171. <h1>about us</h1>
  172. <div class="col-md-4 ">
  173. <div class=" img-border img-rounded "><img src="img/content.jpg" alt="content"></div>
  174. </div>
  175. <div class="col-md-4 ">
  176. <h1>Introduction</h1>
  177. <p>My brain has too<br/> many tabs</p>
  178. </div>
  179. <div class="col-md-4 box img-rounded list"><h3>My skils</h3>
  180. <ul >
  181. <li>Draw</li>
  182. <li>programming</li>
  183. <li>Desing</li>
  184. <li>sport</li>
  185. <li>Photography</li>
  186. </ul>
  187. </div>
  188.  
  189.  
  190. </div>
  191. </div>
  192. <!--Footer-->
  193. <div class="row text-center footer">
  194. <h1>Portfolio</h1>
  195. <p style="color: #FFFFFF"> Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et d <br/>olore magna aliqua Ut enim ad minim veniam, quis nostrud.<br/></p>
  196. <i class="fa fa-phone" aria-hidden="true" ></i><span>
  197. Tel:+38 056 23 15 7851 <br/></span>
  198. <i class="fa fa-envelope" aria-hidden="true"></i>
  199. <span>Email: Portfolio.info@mail.com<br/></span>
  200. <i class="fa fa-map-marker" aria-hidden="true"></i>
  201. <span> Address: 150 Duffy Ave<br/>
  202. Hicksville, NY 11801, USA<br/></span>
  203. <div class="text-center " >
  204. <img src="img/twitter.png" style="padding: 10px"/>
  205. <img src="img/social-facebook-circular-button.png" style="padding: 10px"/>
  206. <img src="img/google-plus-circular-button.png" style="padding: 10px"/>
  207. <br/>
  208. <p style="color: #FFFFFF"> Development by samahziad© 2017 AllRights Reserved.</p> </div>
  209. </div>
  210. </div>
  211. <!--Footer-->
  212. <script src="js/jquery-3.2.1.min.js"></script>
  213. <script src="js/bootstrap.js"></script>
  214. <script src="js/script.js"></script>
  215. </body>
  216. </html>
Add Comment
Please, Sign In to add comment