Homework 8 Re-write this code using a style sheet not in-line styles <html> <head><title>position</title> </head> <body>...

Question

Question

1. Create an HTML file that uses an alert dialog box to display the message Hi There! when the page loads 2. Create an HTML

Homework 8 Re-write this code using a style sheet not in-line styles

<html> <head><title>position</title>

</head>

<body>

<img src="nagano_1.jpg" Style = "position: absolute; top:70px;

left: 150px; z-index:2">

this is a test of position</h1>

</body></html>

engineering Computer-Science

Add a comment Improve this question Transcribed image text

Answer 1

Answer #1

1)HTML page displaying the message 'Hi There!' at loading:

1 2 3 4 5 6 7 8 9 10 first.html x <!DOCTYPE html> <html> <head> <title>position</title> <script> alert(Hi There!); </script Output:

first.html х + → X File | C:/Xampp/htdocs/test/first.html This page says Hi There! OK

3 position X + File | C:/xampp/htdocs/test/first.html ulls is test of position

SOURCE CODE:

<!DOCTYPE html>
<html>
<head>
   <title>position</title>
<script>
   alert("Hi There!");
</script>
</head>
<body>
   <img src= "snow.jpg" style="positon: absolute; top:0px; left: 0px; z-index: 1">

<h1 style= "position: fixed; top:50px; left: 50px; color:2338ee; z-index:3";>this is a test of position</h1>
</body>
</html>

2) HTML page displaying grades and score

X 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 first.html <!DOCTYPE html> <html> <head> <title>position</ti

position Х + x File | C:/xampp/htdocs/test/first.html This page says Please enter test score OK Cancel

C position X + File | C:/xampp/htdocs/test/first.html This page says Please enter test score 89 ОК Cancel

position X + File | C:/xampp/htdocs/test/first.html This page says Grade: B OK

3 position X + File | C:/xampp/htdocs/test/first.html ulls is test of position

SOURCE CODE:

<!DOCTYPE html>
<html>
<head>
   <title>position</title>
<script>
   var TestScore = prompt("Please enter test score", " ");
   var testScoreGrade;
if(TestScore >= 90 && TestScore <= 100)
   testScoreGrade = 'A';
else if(TestScore >= 80 && TestScore <= 89)
   testScoreGrade = 'B';
else if(TestScore >= 70 && TestScore <= 79)
   testScoreGrade = 'C';
else if(TestScore >= 60 && TestScore <= 69)
   testScoreGrade = 'D';
else if(TestScore < 60)
   testScoreGrade = 'F';

alert("Grade: "+testScoreGrade);

</script>
</head>
<body>
<img src= "snow.jpg" style="positon: absolute; top:0px; left: 0px; z-index: 1">

<h1 style= "position: fixed; top:50px; left: 50px; color:2338ee; z-index:3";>this is a test of position</h1>
</body>
</html>

EXPLANATION:

Generally,in HTML with the help of javascript we can popup the message using global functions like - alert(), prompt() and confirm().

alert() - With 'OK' button displays a popup message on the screen.

confirm() - With 'OK' and 'Cancel' buttons popup a message and takes the user confirmation for proceeding.

prompt() - Takes the input message and displays the output through popping up the message.

Please note that I have taken some samples from internet and I'm displaying those as per the requirement here.

Add a comment

Answer 2

Homework 8 Re-write this code using a style sheet not in-line styles <html> <head><title>position</title> </head> <body>...

Homework Answers

Add Answer to:
Homework 8 Re-write this code using a style sheet not in-line styles <html> <head><title>position</title> </head> <body>...

Post as a guest

Earn Coins

6. (HTML) Given the following HTML document: <html> <head> <title>Grandma Cafe</title> </head> <body> <h1>Menu</h1> <ol> <li>Café...

<!DOCTYPE html>  <html lang="en"> <!-- head...

<!DOCTYPE html>  <html lang="en"> <!-- head...

As part of this assignment we are using the base Gallery HTML and writing JavaScript code...

Look at the following illustrated output for an HTML and a css given below <!DOCTYPE html>...

Javascript to edit a HTML file. Where to begin? <!doctype html> <html> <head> <meta charset="utf-8"> <title>TODO:...

HTML and css using notepad++ WHen you run the code, you will see a horizontal menue...

<!DOCTYPE html> <html> <head> <title>Products</title> <style> .heading { text-align: center; font-size: 40px; } #menu { text-align:...

I'm having trouble to link the .js file to the html so changes for the html...

<!DOCTYPE HTML> <html lang="en"> <head> <meta charset="utf-8"> <title>Plaid Scarf Selector</title> <link rel="stylesheet" href="a3.css" />...

Homework 8 Re-write this code using a style sheet not in-line styles <html> <head><title>position</title> </head> <body>...

Homework Answers

Add Answer to: Homework 8 Re-write this code using a style sheet not in-line styles <html> <head><title>position</title> </head> <body>...

Post as a guest

Earn Coins

Add Answer to:
Homework 8 Re-write this code using a style sheet not in-line styles <html> <head><title>position</title> </head> <body>...