Website #1

HTML
<!DOCTYPE html> <body> <div id="navdiv"> <!--top nav bar--> <ul id="navBar"> <li class="nav"> <a href="" class= "navtext">Home</a> </li> <li class="nav"> <a href="" class= "navtext">About</a> </li> <li class="nav"> <a href="" class= "navtext">Contact</a> </li> </ul> </div> <div id="imgdiv"> <img id="pageimg1" src="https://www.caminodesantiago.me/wp-content/uploads/medical-care.jpg"/> </div> <!--IMG div--> <div id="article1"> <!--grey translucent box--> <div id="intBoxDiv"> <p>We are amazing</p> </div> </div> </body>
CSS
#navdiv { /*Navigation bar at the top of page*/ width: 100%; height: 4.3em; background-color: #232023; padding: auto; display: block; position: fixed; opacity: 0.9; z-index: 4; } .nav { display: inline; margin-right: 10%; } #navBar { text-align: center; font-size: 1.15em; padding-top: 0.3em; } .navtext { text-decoration: none; color: #ffffff; opacity: 1; } #article1 { /*translucent box*/ width: 100%; height: 20%; background-color: #000000; z-index: 3; padding-bottom: 10em; opacity: 0.5; display: inline-block; position: absolute; margin-top: 60%; } .navtext:hover { color: #dbdbdb; } #imgdiv { margin-left: 20%; z-index: 1; padding-top: 10em; position: fixed; width: 60%; background-position: center center; margin-bottom: 10%; } #pageimg1 { width: 100%; z-index: 1; } #intBoxDiv { z-index: 5; }
JAVASCRIPT
confirm('WARNING! viruses detected! Your computer has been infected!'); var greeting = 'howdy'; var name ='pardner'; var welcome = greeting + name;
Expand for more options Login