html
html new<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="style.css">
<title>CALCULATOR</title>
</head>
<body>
<div class="container" >
<div class="pesrsonal-info">
<form >
Full Name:
<input type="text" placeholder="Enter Your Full Name" class="info">
Level:
<input type="text" placeholder="Enter Your Level" class="info">
Your Group:
<input type="text" placeholder="Your Group" class="info">
</form>
</div>
<div class="calcul">
<table >
<tr>
<td>Subject</td>
<td>Note</td>
<td>COF</td>
<td>Note.COF</td>
</tr>
<tr>
<td><select>
<option>Analyse</option>
<option>Algebre</option>
<option>Termochimie</option>
<option>Termo-dynamique</option>
<option>Mechanique</option>
<option>Langue</option>
<option>Electrostatique</option>
<option>Optique Geometrique</option>
<option>Algebre 2</option>
</select></td>
<td><input type="number" max="20" min="0" placeholder="10"></td>
<td><select>
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
<option>5</option>
<option>6</option>
<option>7</option>
<option>8</option>
<option>9</option>
</select></td>
<td><input type="number" placeholder="10"></td>
</tr>
<tr>
<td><select>
<option>Analyse</option>
<option>Algebre</option>
<option>Termochimie</option>
<option>Termo-dynamique</option>
<option>Mechanique</option>
<option>Langue</option>
<option>Electrostatique</option>
<option>Optique Geometrique</option>
<option>Algebre 2</option>
</select></td>
<td><input type="number" max="20" min="0" placeholder="10"></td>
<td><select>
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
<option>5</option>
<option>6</option>
<option>7</option>
<option>8</option>
<option>9</option>
</select></td>
<td><input type="number" placeholder="10"></td>
</tr>
<tr>
<td><select>
<option>Analyse</option>
<option>Algebre</option>
<option>Termochimie</option>
<option>Termo-dynamique</option>
<option>Mechanique</option>
<option>Langue</option>
<option>Electrostatique</option>
<option>Optique Geometrique</option>
<option>Algebre 2</option>
</select></td>
<td><input type="number" max="20" min="0" placeholder="10"></td>
<td><select>
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
<option>5</option>
<option>6</option>
<option>7</option>
<option>8</option>
<option>9</option>
</select></td>
<td><input type="number" placeholder="10"></td>
</tr>
<tr>
<td><select>
<option>Analyse</option>
<option>Algebre</option>
<option>Termochimie</option>
<option>Termo-dynamique</option>
<option>Mechanique</option>
<option>Langue</option>
<option>Electrostatique</option>
<option>Optique Geometrique</option>
<option>Algebre 2</option>
</select></td>
<td><input type="number" max="20" min="0" placeholder="10"></td>
<td><select>
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
<option>5</option>
<option>6</option>
<option>7</option>
<option>8</option>
<option>9</option>
</select></td>
<td><input type="number" placeholder="10"></td>
</tr>
<tr>
<td><select>
<option>Analyse</option>
<option>Algebre</option>
<option>Termochimie</option>
<option>Termo-dynamique</option>
<option>Mechanique</option>
<option>Langue</option>
<option>Electrostatique</option>
<option>Optique Geometrique</option>
<option>Algebre 2</option>
</select></td>
<td><input type="number" max="20" min="0" placeholder="10"></td>
<td><select>
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
<option>5</option>
<option>6</option>
<option>7</option>
<option>8</option>
<option>9</option>
</select></td>
<td><input type="number" placeholder="10"></td>
</tr>
<tr>
<td><select>
<option>Analyse</option>
<option>Algebre</option>
<option>Termochimie</option>
<option>Termo-dynamique</option>
<option>Mechanique</option>
<option>Langue</option>
<option>Electrostatique</option>
<option>Optique Geometrique</option>
<option>Algebre 2</option>
</select></td>
<td><input type="number" max="20" min="0" placeholder="10"></td>
<td><select>
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
<option>5</option>
<option>6</option>
<option>7</option>
<option>8</option>
<option>9</option>
</select></td>
<td><input type="number" placeholder="10"></td>
</tr>
<tr>
<td><select>
<option>Analyse</option>
<option>Algebre</option>
<option>Termochimie</option>
<option>Termo-dynamique</option>
<option>Mechanique</option>
<option>Langue</option>
<option>Electrostatique</option>
<option>Optique Geometrique</option>
<option>Algebre 2</option>
</select></td>
<td><input type="number" max="20" min="0" placeholder="10"></td>
<td><select>
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
<option>5</option>
<option>6</option>
<option>7</option>
<option>8</option>
<option>9</option>
</select></td>
<td><input type="number" placeholder="10"></td>
</tr>
<tr>
<td><select>
<option>Analyse</option>
<option>Algebre</option>
<option>Termochimie</option>
<option>Termo-dynamique</option>
<option>Mechanique</option>
<option>Langue</option>
<option>Electrostatique</option>
<option>Optique Geometrique</option>
<option>Algebre 2</option>
</select></td>
<td><input type="number" max="20" min="0" placeholder="10"></td>
<td><select>
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
<option>5</option>
<option>6</option>
<option>7</option>
<option>8</option>
<option>9</option>
</select></td>
<td><input type="number" placeholder="10"></td>
</tr>
<tr>
<td><select>
<option>Analyse</option>
<option>Algebre</option>
<option>Termochimie</option>
<option>Termo-dynamique</option>
<option>Mechanique</option>
<option>Langue</option>
<option>Electrostatique</option>
<option>Optique Geometrique</option>
<option>Algebre 2</option>
</select></td>
<td><input type="number" max="20" min="0" placeholder="10"></td>
<td><select>
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
<option>5</option>
<option>6</option>
<option>7</option>
<option>8</option>
<option>9</option>
</select></td>
<td><input type="number" placeholder="10"></td>
</tr>
<tr>
<td><select>
<option>Analyse</option>
<option>Algebre</option>
<option>Termochimie</option>
<option>Termo-dynamique</option>
<option>Mechanique</option>
<option>Langue</option>
<option>Electrostatique</option>
<option>Optique Geometrique</option>
<option>Algebre 2</option>
</select></td>
<td><input type="number" max="20" min="0" placeholder="10"></td>
<td><select>
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
<option>5</option>
<option>6</option>
<option>7</option>
<option>8</option>
<option>9</option>
</select></td>
<td><input type="number" placeholder="10"></td>
</tr>
<tr>
<td colspan="2">Total</td>
<td>12</td>
<td>100</td>
</tr>
<tr>
<td colspan="3">Moyenne</td>
<td>100</td>
</tr>
<tr>
<td colspan="3">Observation</td>
<td>Reussie</td>
</tr>
</table>
<input type="button" id="button" class="btn btn1" value="Calculat" >
<input type="button" id="button" class="btn btn2" value="Print" >
</div>
</div>
</body>
</html>