basic html and css practice 1st day code repo
basic HTML and CSS for respective files💪💪💪💪💪💪📮📮📮
HTML CODE
<!DOCTYPE html>
<html>
<head>
<img class="logo1" id="logo1" src="logo.jpg" alt="logo" >
<link rel="stylesheet" href="styles.css">
<meta name="viewport" contents="width = device-width,initial-scale=1.0">
</head>
<body>
<div class="bd1">
The body text or body copy is the text forming the main content of a book,
magazine, web page, or any other printed or digital work. This is as a contrast to both
additional components such as headings, images, charts, footnotes etc.
on each page, and also the pages of front matter that form the introduction to a book.
The body text or body copy is the text forming the main content of a book, magazine, web page,
or any other printed or digital work. This is as a contrast to both additional components such as
headings, images, charts, footnotes etc. on each page, and also the pages of front matter that form the introduction to a book
<br></hr >
.The body text or body copy is the text forming the main content of a book, magazine, web page, or
any other printed or digital work. This is as a contrast to both additional components such as headings, images, charts, footnotes etc. on each page, and also the pages of front matter that form the introduction to a book.The body text or body copy is the text forming the main content of a book, magazine, web page, or any other printed or digital work. This is as a contrast to both additional components such as headings, images, charts, footnotes etc. on each page, and also the pages of front matter that form the introduction to a book.The body text or body copy is the text forming the main content of a book, magazine, web page, or any other printed or digital work. This is as a contrast to both additional components such as headings, images, charts, footnotes etc. on each page, and also the pages of front matter that form the introduction to a book.The body text or body copy is the text forming the main content of a book, magazine, web page, or any other printed or digital work. This is as a contrast to both additional components such as headings, images, charts, footnotes etc. on each page, and also the pages of front matter that form the introduction to a book.The body text or body copy is the text forming the main content of a book, magazine, web page, or any other printed or digital work. This is as a contrast to both additional components such as headings, images, charts, footnotes etc. on each page, and also the pages of front matter that form the introduction to a book.The body text or body copy is the text forming the main content of a book, magazine, web page, or any other printed or digital work. This is as a contrast to both additional components such as headings, images, charts, footnotes etc. on each page, and also the pages of front matter that form the introduction to a book.The body text or body copy is the text forming the main content of a book, magazine, web page, or any other printed or digital work. This is as a contrast to both additional components such as headings, images, charts, footnotes etc. on each page, and also the pages of front matter that form the introduction to a book.The body text or body copy is the text forming the main content of a book, magazine, web page, or any other printed or digital work. This is as a contrast to both additional components such as headings, images, charts, footnotes etc. on each page, and also the pages of front matter that form the introduction to a book.The body text or body copy is the text forming the main content of a book, magazine, web page, or any other printed or digital work. This is as a contrast to both additional components such as headings, images, charts, footnotes etc. on each page, and also the pages of front matter that form the introduction to a book.
</div>
</body>
</html>
CSS code for it
body{
margin: 0;
padding : 2px;
box-sizing: border-box;
background: linear-gradient(to right, rgba(255,0,0,0), rgb(0, 195, 255));
}
section{
witdth : 90%;
height : 90%
}
head{
font-family: 'Yatra One';
font-size: xx-large;
font-stretch: semi-condensed;
text-align: justify;
}
.bd1{
padding: 20px;
text-transform: inherit;
text-align: center;
background: lightskyblue;
position: absolute;
top: 15%;
left: 10%;
right: 10%;
}
.logo1{
margin: 10px;
float: left;
width: 180px;
}
logo1:hover{
transform: translateX(20px);
transition: 3s;
}
#div1.2{
padding: 30px;
background: blue;
}
Comments
Post a Comment