Portfolio page
How do I make an portfolio page?
What is a portfolio page? How do you make a portfolio page? This script and codes were developed by Bhavya Jain on 25 August 2022, Thursday.
Portfolio page - Script Codes HTML Codes
<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>Portfolio page</title> <link rel='stylesheet prefetch' href='https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.0.0-alpha.6/css/bootstrap.min.css'> <link rel="stylesheet" href="css/style.css">
</head>
<body> <link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css" />
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<link href="https://fonts.googleapis.com/css?family=Oswald" rel="stylesheet">
<body class="textf">
<div> <nav clas="nav navbar fixed-top navbar-full"> <div class="nav navbar-inverse"> <ul class="nav navbar-nav sze" <li> <a href="#" class="navbar-brand navbar-left">Page Title</a></li> </ul> <ul class="nav navbar-nav navbar-right"> <li> <a href="#">Home</a> </li> <li> <a href="#">About</a> </li> <li> <a href="#">Projects</a> </li> <li> <a href="#">Contact</a> </li> </div> </nav>
</div>
<!--carousel-->
<div id="mycarousel" class="carousel slide" data-ride="carousel"> <!--wrapper for slides--> <div class="carousel-inner" role="listbox"> <div class="item active"> <img src="http://unsplash.com/photos/MsJPXmHQIs8/download?force=true" class="imgsize"> </div> <div class="item"> <img src="http://unsplash.com/photos/p0rT3VcWRvQ/download?force=true" class="imgsize"> </div> <div class="item "> <img src="http://unsplash.com/photos/boLgiM0qwkg/download?force=true" class="imgsize"> </div> <div class="item"> <img src="http://unsplash.com/photos/p0rT3VcWRvQ/download?force=true" class="imgsize"> </div> </div> <!--indicators--> <ol class="carousel-indicators"> <li data-target="#mycarousel" data-slide-to="0" class="active"></li> <li data-target="#mycarousel" data-slide-to="1"></li> <li data-target="#mycarousel" data-slide-to="2"></li> <li data-target="#mycarousel" data-slide-to="3"></li> </ol> <a class="left carousel-control" href="#mycarousel" role="button" data-slide="prev"> <span class="icon-prev" aria-hidden="true"></span> <span class="sr-only">previous</span> </a> <a class="right carousel-control" href="#mycarousel" role="button" data-slide="next"> <span class="icon-next" aria-hidden="true"></span> <span class="sr-only">next</span> </a> </div>
<br>
<section id="about" class="container"> <h2 class="text-center">About</h2> <hr> <br> <div class="row"> <div class="col-sm-6 col-sm-offset-3"> <p class="text-center">Hi,my name is Bhavya,and I am a developer from Bombay.I love crafting beautiful websites in HTML,CSS and jQuery.Want professional looking websites,<a href="#contact">contact me</a>. </div> </div>
</section> <br> <section id="projects" class="container1"> <h2 class="text-center">Projects</h2> <hr> <div class="row"> <div class="col-sm-4 text-center pr-img"> <h3>Tribute Page</h3> <a href="http://codepen.io/Bhavya_j/full/oZqVKR/"> <img src="http://i.lv3.hbo.com/assets/images/series/entourage/character/vincent-chase-1920.jpg" class="sml-img"</a></div> <div class="col-sm-4 text-center"> <h3>placeholder</h3> </div> <div class="col-sm-4 text-center"> <h3>placeholder</h3> </div> </div>
</section> <br> <section id="contact" class="container2 text-center"> <h2 class="text-center">Contact</h2> <hr> <br> <a class="h1" href="https://www.instagram.com/bhavya_j/"><i class="fa fa-instagram"></i></a> <a class="h1" href="https://twitter.com/?lang=en"><i class="fa fa-twitter"></i></a> <a class="h1"href="https://github.com/"><i class="fa fa-github"></i></a> </section> <script src='https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.0.0-alpha.6/js/bootstrap.min.js'></script>
<script src='https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js'></script>
</body>
</html>
Portfolio page - Script Codes CSS Codes
.textf{ font-family:oswald;
}
.navbar-inverse a:hover{ text-decoration:none; }
.sze a{ font-size:25px;
}
.navbar-right a{font-size:20px;}
.imgsize{ height:900px; padding:-30px;
}
.sml-img{ height:200px; width:350px; border-radius:2%;
}
.container{ height:210px; width:100%;
}
.container2{ height:300px; width:100%; background-color:#D1EEF2; padding:10px;
}
.container1{ padding:30px;
}
.h1{ margin:10px; padding:10px; font-color:white;
}
hr{ width:30%;
}
.row p{font-size:20px;}
.pr-img a:hover{
}

Developer | Bhavya Jain |
Username | Bhavya_j |
Uploaded | August 25, 2022 |
Rating | 3 |
Size | 2,804 Kb |
Views | 26,299 |
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!
Name | Size |
Portfoilio | 3,248 Kb |
A Pen by Bhavya Jain | 2,662 Kb |
Tribute to Vincent Chase | 4,625 Kb |
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!
Name | Username | Size |
Double box-shadow | Daubac402 | 1,436 Kb |
Svg animation draw | SzymonDziewonski | 5,545 Kb |
Polygon Logo in CSS | Kai | 3,412 Kb |
A Pen by Gregory Potdevin | GregoryPotdevin | 1,713 Kb |
Sticky Navbar | Phantomesse | 5,106 Kb |
TweetBox with React JS | J0zelito | 3,325 Kb |
Wikipedia Viewer | Thalpha | 4,426 Kb |
Price Comparison Table | Orrinward | 3,459 Kb |
CSS Bot Confusion | Jpod | 3,456 Kb |
IPhone5S SVG Space Grey | Onlinechris | 75,035 Kb |
Surf anonymously, prevent hackers from acquiring your IP address, send anonymous email, and encrypt your Internet connection. High speed, ultra secure, and easy to use. Instant setup. Hide Your IP Now!