Design a Tribute Page using HTML and CSS

What is a Tribute page?

A tribute page is a web page where we mention our favorite person and write down their achievements. For example, here, we will create a tribute page for the cricketer Virat Kohli.

Example:

<!DOCTYPE html>
<html lang="en">
<head>
	<style>		
		body {
			background-color: #f0f5f3;
			margin: 20%;
		}
		#title {
			text-align: center;
			text-shadow: 5px 5px 10px white;
			font-size: 8vh;
		}
		img {
			display: inline-block;
			width: 100%;
		}	
		#caption {
			font-size: 19px;
			font-family:sans-serif;
			color: black;
		}
		div#tribute-data {
			background-color: rgb(46, 139, 87, 0.25);
			box-shadow: 20px 20px 20px #96c996;
			font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
			padding: 25px 25px;
			margin: 11px;
			margin-top: 50px;
		}
		h1.title-vk {
			font-size: 35px;
			color: white;
			text-align: center;
			text-shadow: 5px 6px 10px black;
		}	
	</style>
</head>
<body>
	<main id="main">
		<!-- Title of the web page tributing virat kohli -->
		<h1 id="title">
			Virat Kohli - The Run Machine
		</h1>
		<div id="img">
			<!--Image of the Virat kohli-->
			<img src="vk.jpg" id="image"
				alt="Error in the image">
			<small id="caption">
				Currently, Virat Kohli is the best batter in the world.
			</small>
		</div>
		<div id="tribute-data">
			<h1 class="title-vk">
				About the Run Machine/King Kohli
			</h1>
<p>
				☛ Virat, a 13-year-old, is selected for the Delhi Under-15 team for the Polly Umrigar Trophy in October. He ends the campaign as Delhi's leading scorer.<br><br>
				☛ Virat is chosen for the India Under-19 team for the first time after making an impression at the youth level for Delhi. He then had a fantastic tour of England, averaging over 100 in the one-day series.<br><br>
				☛ In Malaysia's Under-19 World Cup, Virat led India to win and finished the competition as one of the top three run scorers. His innate leadership abilities attracted the proper kind of attention.<br><br>
				☛ Royal Challengers Bangalore, an IPL team, signs Virat on a youngster contract for just Rs 12.5 lakhs when he is still a minor.
				<br><br> ☛ Virat received his maiden call-up to the Indian ODI team and participated in the entire five-match series against Sri Lanka on the road. In the fourth game of the series, he hit his first 50, a 54-run inning. 
				<br><br> ☛ When Virat got his first ODI century against Sri Lanka, 107 off 111, it was worth the wait for him to return to the national squad.
				<br><br> ☛ Virat participated in every game of India's victorious World Cup campaign in 2011, scoring his only century against Bangladesh in the opening match. Despite the fact that he didn't exactly light up the tournament with his bat, his final-round remark to Sachin has since become legendary in cricket: "Sachin Tendulkar has carried the weight of the nation for 21 years." Time for us to carry him on our shoulders
				<br><br> ☛ Every cricketer will answer "play Test cricket" when asked what their dream is. In 2011, Virat finally had the opportunity to play in his first Test match against the West Indies. Unfortunately for the charming lad, it was a forgettable experience as he scored just 19 runs in the two innings he played.
				<br><br> ☛ In the fourth and final test against Australia in Adelaide, Kohli achieved his first test hundred under somewhat dramatic circumstances. He just avoided being run out when batting with Ishant Sharma and nearly ran out of partners. However, he was unable to save India. 4-0 was our series loss.
				<br><br> ☛ Virat led India to the CB Series final in Australia with what is undoubtedly one of the best ODI efforts by an Indian batsman, hitting 133 not out against Sri Lanka off just 86 balls. Hobart witnessed one of the greatest batting performances in history as India, who was chasing 321, reached the score in 37 overs.
				<br><br> ☛ In place of an injured MS Dhoni, Virat was selected the stand-in ODI captain when India visited the West Indies. Earlier that year, he had also been named captain of his IPL team, the Royal Challengers Bangalore.
				<br><br> ☛ When summoned to replace an ailing MS in Australia once more, Kohli experienced his first taste of Test captaincy. In Adelaide, he celebrated by scoring centuries in both innings. In what was an exceptional
				<br><br> ☛ In addition to purchasing a share in the IPTL team UAE Royals, Kohli expanded his interest in tennis after becoming a co-owner of ISL football club FC Goa the year before.
				<br><br> ☛ He produced arguably his finest innings of his young career as India defeated Australia in Mohali to go to the ICC World T20 semifinals. As opposed to the lappa kind of cricket that is typically associated with 20 over cricket, his 82 off 51 balls was a magnificent effort, carved with timing and technique.
				<br><br> 
			</p>
		</div>
		<br>
	</main>
</body>
</html>

Output:

Design a Tribute Page using HTML and CSS

Explanation:

Here, you can see that we have created the tribute page for Virat Kohli with the help of appropriate tags and styling.

Next TopicHow to Make Smooth Bounce Animation Using CSS

← prev next →

For Videos Join Our Youtube Channel: Join Now

Feedback

Send your Feedback to [email protected]

Help Others, Please Share

Learn Latest Tutorials

Splunk

SPSS

Swagger

Transact-SQL

Tumblr

ReactJS

Regex

Reinforcement Learning

R Programming

RxJS

React Native

Python Design Patterns

Python Pillow

Python Turtle

Keras

Preparation

Aptitude

Reasoning

Verbal Ability

Interview Questions

Company Questions

Trending Technologies

Artificial Intelligence

AWS

Selenium

Cloud Computing

Hadoop

ReactJS

Data Science

Angular 7

Blockchain

Git

Machine Learning

DevOps

B.Tech / MCA

DBMS

Data Structures

DAA

Operating System

Computer Network

Compiler Design

Computer Organization

Discrete Mathematics

Ethical Hacking

Computer Graphics

Software Engineering

Web Technology

Cyber Security

Automata

C Programming

C++

Java

.Net

Python

Programs

Control System

Data Mining

Data Warehouse

Javatpoint Services

JavaTpoint offers too many high quality services. Mail us on h[email protected], to get more information about given services.

Website Designing
Website Development
Java Development
PHP Development
WordPress
Graphic Designing
Logo
Digital Marketing
On Page and Off Page SEO
PPC
Content Development
Corporate Training
Classroom and Online Training
Data Entry

Training For College Campus

JavaTpoint offers college campus training on Core Java, Advance Java, .Net, Android, Hadoop, PHP, Web Technology and Python. Please mail your requirement at [email protected].
Duration: 1 week to 2 week

^{Like/Subscribe us for latest updates or newsletter}