Refresh on html.

Developer
Size
2,320 Kb
Views
6,072

How do I make an refresh on html.?

This pen recaps basic html elements, css, and using the 960 grid system. What is a refresh on html.? How do you make a refresh on html.? This script and codes were developed by Kevin Alford on 07 January 2023, Saturday.

Refresh on html. Previews

Refresh on html. - Script Codes HTML Codes

<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>Refresh on html.</title> <link rel='stylesheet prefetch' href='https://cdnjs.cloudflare.com/ajax/libs/960gs/0/960.css'> <link rel="stylesheet" href="css/style.css">
</head>
<body> <div class="container_12"> <!-- FIRST SECTION ---> <div class="grid_12"> <div class="tom_the_tomatoe"> size 12 paragraph </div> </div> <div class="clear"></div> <!-- every section of 12 should end with a clear --> <!-- SECOND SECTION --> <div class="grid_3"> <div class="tom_the_tomatoe sidebar"> size 3 paragraph </div> </div> <div class="grid_9"> <div class="tom_the_tomatoe main_content"> size 9 paragraph </div> </div> <div class="clear"></div> <!-- THIRD SECTION --> <div class="grid_4"> <div class="tom_the_tomatoe fourths"> <a href="www.google.com">click here for google</a> <ul> <li>unordered one</li> <li>unordered two</li> </ul> </div> </div> <div class="grid_4"> <div class="tom_the_tomatoe fourths"> <a href="www.youtube.com">click here for youtube</a> <ol> <li>ordered one</li> <li>ordered two</li> </ol> </div> </div> <div class="grid_4"> <div class="tom_the_tomatoe fourths"> <dl> <dt>Coffee</dt> <dd>Black hot drink</dd> <dt>Milk</dt> <dd>White cold drink</dd> </dl> </div> </div> <div class="clear"></div> <!-- FOURTH SECTION --> <div class="grid_6"> <div class="tom_the_tomatoe ponie"> <img src="https://octodex.github.com/images/twenty-percent-cooler-octocat.png" width="300px"> </div> </div> <div class="grid_6"> <div class="tom_the_tomatoe ponie"> <p> this is a paragraph of stuff and its very long and full of stuff </p> <p>this is a paragraph of stuff and its very long and full of stuff</p> <p> hello this is the third paragraph </p> <div> <span class="letter1">h</span> <span class="letter2">e</span> <span class="letter3">l</span> <span class="letter4">l</span> <span class="letter5">o</span> <span class="letter1">this</span> is a <span class="letter3">paragraph</span> </div> </div> <div class="clear"></div> <!-- END OF LAYOUT --> </div>
</div>
</body>
</html>

Refresh on html. - Script Codes CSS Codes

body { background-color: #ffeecc;
}
/* borders for the boxes */
.tom_the_tomatoe { /* box model */ padding: 10px; margin-top: 10px; border: 2px #0066FF solid; /* visuals */ background-color: #ccaacc; border-radius: 2px; box-shadow: 0 0 10px #888;
}
/* set two classes to the same rule */
.sidebar, .main_content { height: 500px;
}
/* give the 3 4-wide boxes same height */
.fourths { height: 100px;
}
/* give the image box and the one next to it equal height */
.ponie { height: 300px;
}
/* color all the letters */
.letter1 { color: red;
}
.letter2 { color: pink;
}
.letter3 { color: blue;
}
.letter4 { color: purple;
}
.letter5 { color: yellow;
}
Refresh on html. - Script Codes
Refresh on html. - Script Codes
Home Page Home
Developer Kevin Alford
Username zeroeth
Uploaded January 07, 2023
Rating 3
Size 2,320 Kb
Views 6,072
Do you need developer help for Refresh on html.?

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!

Kevin Alford (zeroeth) Script Codes
Create amazing blog posts with AI!

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!