Tuesday, 27 August 2019

html css javascript-2


<html>
<head>
<link rel="stylesheet"  href="admission.css">
</head>
<body>

<p id="place"></p>
<script>
var x = document.getElementById("place");

function getLocation() {
  if (navigator.geolocation) {
    navigator.geolocation.getCurrentPosition(showPosition);
  } else {
    x.innerHTML = "Geolocation is not supported by this browser.";
  }
}

function showPosition(position) {
  x.innerHTML = "Latitude: " + position.coords.latitude +
  "<br>Longitude: " + position.coords.longitude;
}
</script>

<table frame="box" align="center">
<tr><td>Name</td><td><input type ="text"></td></tr>
<tr><td>F_Name</td><td><input type ="text"></td></tr>
<tr><td>Class</td><td><select>
<option>8th</option>
<option>9th</option>
<option>10th</option>
</select>

</td></tr>
<tr><td>Gender</td></tr>
<tr><td><input type="radio" name="g1">Male</td></tr>
<tr><td><input type="radio" name="g1">Female</td></tr>
<tr><td>Cources:</td></tr>
<tr><td ><input type="checkbox" name="c1" >Cricket</td></tr>
<tr><td ><input type="checkbox" name="c1" >Football</td></tr>
<tr><td>Latitued</td><td><input type="text"></td><td>Longitude</td><td><input type="text"></td></tr>
<tr><td><button onclick="getLocation()">get Location</button></td></tr>

<tr><td><input type="submit" name="submit"></td></tr>

</table>
<p id="place"></p>
</body>
</html>
Admission.css
table{
          background-color:pink;
          padding:20px;
}
table td
{
          padding:18px;
}
body
{
          background-color:red;
}
#place
{
          top:85%;
          position:absolute;
          background-color:green;
}

No comments:

Post a Comment