25
edits
Changes
Jump to navigation
Jump to search
Line 1:
Line 1: − <!-- Test Trial--> − − <nowiki>#</nowiki>sidebar{ − − float : right; − − width: 30%; − − background - color: #333; − − color:#fff; − − paddling: 15px; − − box-sitting: border-box; − − − <img src="/pix/samples/18m.jpg" width="100" height="121" alt="Photo of 3 cats"> − − <p>This image is resized using the 'width' and 'height' attributes of the 'img' tag.</p> − } − + − <style> − body {margin: 0;} − − ul.topnav { − list-style-type: none; − margin: 0; − padding: 0; − overflow: hidden; − background-color: #333; − } − − ul.topnav li {float: left;} − − ul.topnav li a { − display: block; − color: white; − text-align: center; − padding: 14px 16px; − text-decoration: none; − } − − ul.topnav li a:hover:not(.active) {background-color: #111;} − − ul.topnav li a.active {background-color: #4CAF50;} − − ul.topnav li.right {float: right;} − − @media screen and (max-width: 600px) { − ul.topnav li.right, − ul.topnav li {float: none;} − } − + + + + + − + − <li><a class="active" href="#home">Home</a></li>+ − <li><a href="#news">News</a></li>+ − <li><a href="#contact">Contact</a></li>+ − <li class="right"><a href="#about">About</a></li>+ − + − + − <div style="padding:0 16px;">+ − <h2>Responsive Topnav Example</h2> + − <p>This example use media queries to stack the topnav vertically when the screen size is 600px or less.</p> − <p>You will learn more about media queries and responsive web design later in our CSS Tutorial.</p> − <h4>Resize the browser window to see the effect.</h4> − </div> −
no edit summary
<!DOCTYPE html>
<!DOCTYPE html>
<html>
<html>
<head>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>New MyGCHR</title>
</style>
</head>
</head>
<body>
<body>
<a href="Myblog.html">Go to MyBlog</a>
<header>
<div class="container">
<div id ="navigation">
</header>
<ul class="topnav">
<section id="showcase">
<div class="container">
<h1>MyCCHR</h1>
<p> Better and improved HR website</p>
</div>
</ul>
</section>
<button>click here</button>
<br>
</body>
</body>
</html>
</html>
