Bonjour,
Merci a vous d'avoir pris le temps de me répondre
voici ce que j'ai pour l'instant en html, ce n'est pas parfait étant une débutante j'en ai conscience mais cela ressemble un peu a ce que je voulais
sauf pour la partie javascript je ne vois pas par ou commencer, je suppose qu'on devra appliquer un Hinnerhtml a un moment mais j'ai un peu de mal avec cette notion...
Merci encore pour votre aide, cordialement Maurine
<html>
<head>
<style type="text/css">
.gaz {
color:grey;
background-color:white;
width:37px;
}
.solide {
color:red;
background-color:white;
width:37px;
}
.liquide {
color:blue;
background-color:white;
width:37px;
}
.other {
color:yellow;
background-color:white;
width:37px;
}
</style>
<script type="text/javascript" language="javascript">
</script>
</head>
<body>
<center>
<table>
<td><input class="gaz" type="button" id="1" value="H"></td><td></td><td></td><td></td><td></td><td></td><td><input class="gaz" type="button" id="2" value="He"></td>
<tr><td><input class="solide" type="button" id="3" value="Li"> <input class="solide" type="button" id="4" value="Be"></td><td><input class="solide" type="button" id="5" value="B"></td><td><input class="solide" type="button" id="6" value="C"></td><td><input class="gaz" type="button" id="7" value="N"></td><td><input class="gaz" type="button" id="8" value="O"></td><td><input class="gaz" type="button" id="9" value="F"></td><td><input class="gaz" type="button" id="10" value="Ne"></td>
<tr><td><input class="solide" type="button" id="11" value="Na"> <input class="solide" type="button" id="12" value="Mg"></td><td><input class="solide" type="button" id="13" value="Al"></td><td><input class="solide" type="button" id="14" value="Si"></td><td><input class="solide" type="button" id="15" value="P"></td><td><input class="solide" type="button" id="16" value="S"></td><td><input class="gaz" type="button" id="17" value="Ci"></td><td><input class="gaz" type="button" id="18" value="Ar"></td>
<tr><td><input class="solide" type="button" id="19" value="K"> <input class="solide" type="button" id="20" value="Ca"> <input class="solide" type="button" id="21" value="Sc"> <input class="solide" type="button" id="22" value="Ti"> <input class="solide" type="button" id="23" value="V"> <input class="solide" type="button" id="24" value="Cr"> <input class="solide" type="button" id="25" value="Mn"> <input class="solide" type="button" id="26" value="Fe"> <input class="solide" type="button" id="27" value="Co"> <input class="solide" type="button" id="28" value="Ni"> <input class="solide" type="button" id="29" value="Cu"> <input class="solide" type="button" id="30" value="Zn"></td><td> <input class="solide" type="button" id="31" value="Ga"></td><td> <input class="solide" type="button" id="32" value="Ge"></td><td> <input class="solide" type="button" id="33" value="As"></td><td> <input class="solide" type="button" id="34" value="Se"></td><td> <input class="solide" type="button" id="35" value="Br"></td><td><input class="gaz" type="button" id="36" value="Kr"></td>
<tr><td><input class="solide" type="button" id="37" value="Rb"> <input class="solide" type="button" id="38" value="Sr"> <input class="solide" type="button" id="39" value="Y"> <input class="solide" type="button" id="40" value="Zr"> <input class="solide" type="button" id="41" value="Nb"> <input class="solide" type="button" id="42" value="Mo"> <input class="solide" type="button" id="43" value="Tc"> <input class="solide" type="button" id="44" value="Ru"> <input class="solide" type="button" id="45" value="Rh"> <input class="solide" type="button" id="46" value="Pd"> <input class="solide" type="button" id="47" value="Ag"> <input class="solide" type="button" id="48" value="Cd"></td><td> <input class="solide" type="button" id="49" value="In"></td><td> <input class="solide" type="button" id="50" value="Sn"></td><td> <input class="solide" type="button" id="51" value="Sb"></td><td> <input class="solide" type="button" id="52" value="Te"></td><td> <input class="solide" type="button" id="53" value="I"></td><td><input class="gaz" type="button" id="54" value="Xe"></td>
<tr><td><input class="solide" type="button" id="55" value="Cs"> <input class="solide" type="button" id="56" value="Ba"> <input class="solide" type="button" id="57" value="La"> <input class="solide" type="button" id="72" value="Hf"> <input class="solide" type="button" id="73" value="Ta"> <input class="solide" type="button" id="74" value="W"> <input class="solide" type="button" id="75" value="Re"> <input class="solide" type="button" id="76" value="Os"> <input class="solide" type="button" id="77" value="Ir"> <input class="solide" type="button" id="78" value="Pt"> <input class="solide" type="button" id="79" value="Au"> <input class="liquide" type="button" id="80" value="Hg"></td><td> <input class="solide" type="button" id="81" value="Ti"></td><td> <input class="solide" type="button" id="82" value="Pb"></td><td> <input class="solide" type="button" id="83" value="Bi"></td><td> <input class="solide" type="button" id="84" value="Po"></td><td> <input class="solide" type="button" id="85" value="At"></td><td><input class="gaz" type="button" id="86" value="Rn"></td>
<tr><td><input class="solide" type="button" id="87" value="Fr"> <input class="solide" type="button" id="88" value="Ra"> <input class="solide" type="button" id="89" value="Ac"> <input class="other" type="button" id="104" value="Rf"> <input class="other" type="button" id="105" value="Db"> <input class="other" type="button" id="106" value="Sg"> <input class="other" type="button" id="107" value="Bh"> <input class="other" type="button" id="108" value="Hs"> <input class="other" type="button" id="109" value="Mt"> <input class="other" type="button" id="110" value="Ds"> <input class="other" type="button" id="111" value="Rg"> <input class="gaz" type="button" id="112" value="Cn"></td><td> <input class="other" type="button" id="113" value="Uut"></td><td> <input class="other" type="button" id="114" value="Uuq"></td><td><input class="other" type="button" id="115" value="Uup"></td><td> <input class="other" type="button" id="116" value="Uuh"></td><td> <input class="other" type="button" id="117" value="Uus"></td><td><input class="other" type="button" id="118" value="Uuo"></td>
<table>
<tr><td><td><td><td><td><td><td><td><td><td><td><td><td><td><td><td><td><td><td><td><td><td><td><td><td><td><td><td><td><td><td><td><input class="solide" type="button" id="57" value="La"> <input class="solide" type="button" id="58" value="Ce"> <input class="solide" type="button" id="59" value="Pr"> <input class="solide" type="button" id="60" value="Nd"> <input class="solide" type="button" id="61" value="Pm"> <input class="solide" type="button" id="62" value="Sm"> <input class="solide" type="button" id="63" value="Eu"> <input class="solide" type="button" id="64" value="Gd"> <input class="solide" type="button" id="65" value="Tb"> <input class="solide" type="button" id="66" value="Dy"> <input class="solide" type="button" id="67" value="Ho"> <input class="solide" type="button" id="68" value="Er"> <input class="solide" type="button" id="69" value="Tm"> <input class="solide" type="button" id="70" value="Yb"> <input class="solide" type="button" id="71" value="Lu"></td></td></td></td></td></td></td></td></td></td></td></td></td></td></td></td></td></td></td></td></td></td></td></td></td></td></td></td></td></td></td></td></td>
<tr><td><td><td><td><td><td><td><td><td><td><td><td><td><td><td><td><td><td><td><td><td><td><td><td><td><td><td><td><td><td><td><td><input class="solide" type="button" id="89" value="Ac"> <input class="solide" type="button" id="90" value="Th"> <input class="solide" type="button" id="91" value="Pa"> <input class="solide" type="button" id="92" value="U"> <input class="gaz" type="button" id="93" value="Np"> <input class="solide" type="button" id="94" value="Pu"> <input class="other" type="button" id="95" value="Am"> <input class="other" type="button" id="96" value="Cm"> <input class="other" type="button" id="97" value="Bk"> <input class="other" type="button" id="98" value="Cf"> <input class="other" type="button" id="99" value="Es"> <input class="other" type="button" id="100" value="Fm"> <input class="other" type="button" id="101" value="Md"> <input class="other" type="button" id="102" value="No"> <input class="other" type="button" id="103" value="Lr"></td></td></td></td></td></td></td></td></td></td></td></td></td></td></td></td></td></td></td></td></td></td></td></td></td></td></td></td></td></td></td></td></td>
</table>
</table>
</center>
</body>
</html>
