00000211-Solution Des Exercices

Télécharger au format pdf ou txt
Télécharger au format pdf ou txt
Vous êtes sur la page 1sur 3

Solution des exercices

Exercice 1
<!DOCTYPE html>
<html>
<head>
<title></title>
<style type="text/css">
p{
border: 1px solid;
padding: 20px;
margin: 20px;
}
</style>
</head>
<body>
<h1>Le premier titre</h1>
<h1>Le deuxième titre</h1>
<h2>Le premier sous titre</h2>
<h2>Le deuxième sous titre</h2>
<p></p>
<p></p>
<p></p>
<p></p>
<p></p>
<script type="text/javascript">
let titres=document.getElementsByTagName('h1');
let texte=titres[0].innerHTML;
titres[0].innerHTML=titres[1].innerHTML;
titres[1].innerHTML=texte;

let titres2=document.getElementsByTagName('h2');
titres2[0].style.color="#FFF";
titres2[0].style.backgroundColor="#00F";
titres2[1].style.color="#FFF";
titres2[1].style.backgroundColor="#00F";

let paragraphes=document.getElementsByTagName('p');
for(let i=0;i<paragraphes.length;++i){
paragraphes[i].innerHTML="Bon courage";
paragraphes[i].style.width="50%";
paragraphes[i].style.height="10vh";
}

</script>
</body>
</html>

Exercice 3
<!DOCTYPE html>
<html>
<head>
<title></title>
<style type="text/css">
#main{
height: 60px;
background-color: #F00;
font-size: 45px;
padding: 20px;
}
#nav{
height: 150px;
background-color: #0F0;
display: none;
}
#main:hover{
cursor: pointer;
}
</style>
</head>
<body>
<div id="main" onclick="afficher()">
Afficher le menu
</div>
<div id="nav">

</div>
<script type="text/javascript">
function afficher(){
if(main.innerHTML.trim()=="Afficher le menu"){
main.innerHTML="Cacher le menu";
nav.style.display="block";
}else{
main.innerHTML="Afficher le menu";
nav.style.display="none";
}
}
</script>
</body>
</html>

Vous aimerez peut-être aussi