L38 Javascript Practoce set

 HTML


<!DOCTYPE html>

<html>


<head>

  <meta charset="utf-8">

  <meta name="viewport" content="width=device-width">

  <title>replit</title>

  <link href="style.css" rel="stylesheet" type="text/css" />

</head>


<body>

  <nav>

    <li>Home</li>

    <li>About</li>

    <li>Contact</li>

    </nav>


  <table>

    <tr>Hello</tr>

    <tr>Hello1</tr>

    <tr>Hello2</tr>

    <tr>Hello3</tr>

    <tr>Hello4</tr>

  </table>


  <script src="script.js"></script>


  <!--

  This script places a badge on your repl's full-browser view back to your repl's cover

  page. Try various colors for the theme: dark, light, red, orange, yellow, lime, green,

  teal, blue, blurple, magenta, pink!

  -->

  <script src="https://replit.com/public/js/replit-badge-v2.js" theme="dark" position="bottom-right"></script>

</body>


</html>


CSS


html {

  height: 100%;

  width: 100%;

}


*{

  margin: 0;

  padding: 0;

  box-sizing: border-box;

}


nav{

  display: flex;

  background-color: white;

}


nav li{

  list-style: none;

  padding: 0 23px;

}


Javascript


document.getElementsByTagName("nav")[0].firstElementChild.style.color = "red"

document.getElementsByTagName("nav")[0].firstElementChild.style.color = "green"

document.getElementsByTagName("nav")[0].lastElementChild.style.color = "green"



Array.from(document.getElementsByTagName("li")).forEach((element) => {

  element.style.background = "cyan";

})

Comments

Popular posts from this blog

Launching Page(Javascript)

AMAZON HOME PAGE CLONE PROJECT

Array in function Javascript