The code below modifies the CSS style on button click. Give the output of the code...
The code below modifies the CSS style on button click. Give the
output of
the code and modify the code such that background color of title
should
also be modified
.
<!DOCTYPE html>
<html lang="en">
<head>
<title>JavaScript and HTML</title>
<meta charset="utf-8"/>
<style>
h1 {
color:blue;
background-color:lightGreen;
border:12px solid green;
padding: 5px;
border-radius: 15px;
text-align: center;
}
p, h1 {
}
}
</style>
<script>
function changeTitleCSSStyle() {
var title = document.querySelector("#mainTitle");
title.style.color = 'black';
title.style.border = "5px dashed red";
}
</script>
</head>
<body>
<h1 id="mainTitle">My home page</h1>
<button onclick="changeTitleCSSStyle();">Click me to change
the CSS
colors of the title of the page</button>
</body>
</html>
Homework Answers
Output of your Program
after Clicking on Button
Changes Done in code to change background
color of Title
.
<!DOCTYPE html>
<html lang="en">
<head>
<title>JavaScript and HTML</title>
<meta charset="utf-8"/>
<style>
h1 {
color:blue;
background-color:lightGreen;
border:12px solid green;
padding: 5px;
border-radius: 15px;
text-align: center;
}
p, h1 {
}
}
</style>
<script>
function changeTitleCSSStyle()
{
var title = document.querySelector("#mainTitle");
title.style.color = 'black';
title.style.border = "5px dashed red";
title.style.backgroundColor='pink';
}
</script>
</head>
<body>
<h1 id="mainTitle">My home page</h1>
<button onclick="changeTitleCSSStyle();">Click me to change
the CSS
colors of the title of the page</button>
</body>
</html>
Note: Changes Highlighted in BOLD(Set the background color to pink)
Screen
Output after Changes:
Add Answer to:
The code below modifies the CSS style on button click. Give the
output of
the code...
Trying to understand java script.. The code provided prints out a game board of cells that...
Trying to understand java script.. The code provided prints out
a game board of cells that are 10 x 10. I currnetly
have it printed out so that it will print out pink squares. how can
i create a click even on any of the pink squares that when they are
clicked it will turn the square black... then any
square that is black when it is clicked it will change back to the
color pink
html/js code and css...
use the sample html file below with a submit button to modify the style of the...
use the sample html file below with a submit button to modify the style of the paragraph text through JavaScript code. By clicking on the button, the font, the font size, and the color of the paragraph text will be changed. <!DOCTYPE html> · <html> · <head> · <meta charset=utf-8 /> · <title>Change Paragraph Text</title> · </head> · <body> · <p id ='text'>I’m going to change this text, I hope.</p> · <div> · <button id="jschange" · onclick="js_style()">Style</button> · </div> · </body> · </html>
Look at the following illustrated output for an HTML and a css given below <!DOCTYPE html>...
Look at the following illustrated output for an HTML and
a css given below
<!DOCTYPE html>
<head>
<title>TABLE with STYLE
SHEET</title>
<meta charset="utf-8" />
<meta name="description" content="Godaddy Webpage
original" />
<link rel = "stylesheet"
href="GoDaddy_assignment_1.css">
<body>
<img src= "GoDaddy.png"/>
<p>Welcome
to:<strong>webhamster.com</strong></br>
This web page is
parked<strong>Free</strong>courtesy of
<a class="aclass1" href
="https://www.godaddy.com">GoDaddy.com</a></p>
<h1>Want to buy<span class
="span2">webmaster.com ?</span></h1>
<div class ="div1">
<a class ="aclass2"
href="https://www.godaddy.com">Learn How</a>
</div>
</hr>
<button>Search Ads</button>
</body>
</html>
“
QUESTION continued Given the corresponding css
file
.aclass1{color:purple;}...
HTML and css using notepad++ WHen you run the code, you will see a horizontal menue...
HTML and css using notepad++ WHen you run the code, you will see a horizontal menue with several options. I want a small horizontal line between each option. I also want that done using div inside a div. Thank you <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Title of the document</title> <style> body{ background-color:#FFA07A; } #h1{ color:white; text-decoration:none; padding:30px; } #h2{ color:white; text-decoration:none; padding:30px; } #navbar1{ background-color:grey; text-align:center; font-size:35px; height:100%px; border:1px solid black; position:absolute; text-decoration:none; margin-left:300px; } #h3{ color:white; text-decoration:none; padding:30px;...
HTML css When i refresh the page, the picture doesnt move at all for #i1 i...
HTML css When i refresh the page, the picture doesnt move at all for #i1 i have width and height but the pictuers doesn't move please fix it. <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Title of the document</title> <style> body{ background-color:#FFA07A; } #h1{ color:white; text-decoration:none; padding:30px; } #h2{ color:white; text-decoration:none; padding:30px; } #navbar1{ background-color:grey; text-align:center; font-size:35px; height:100%px; border:1px solid black; position:absolute; text-decoration:none; margin-left:300px; } #h3{ color:white; text-decoration:none; padding:30px; } #b1{ background-color:grey; font-size:30px; } i1{ width:10px; height:20px; } </style> <body> <div...
Hello Ive been tryting to add the CDN of jquery to my html code and I...
Hello Ive been tryting to add the CDN of jquery to my html code and I keep getting an error Need help with this : Navigate to www.code.jquery.com in your Chrome browser. On this page, you'll find different stable versions of jQuery. Select uncompressed for jQuery Core 3.3.1. Copy the <script> tag that is given to you. In store_hours.html, paste that tag directly above your body's closing tag. This is the jQuery CDN. After you paste this code into...
Given the HTML5 code below, please add embedded css snippets in the code to configure it...
Given the HTML5 code below, please add embedded css snippets in the code to configure it with the requirements below: (4%) for the entire web page, set text color as black and background color as white (3%); for text in heading 1 tags, set text font-size as 200%, text font type face as Arial, or sans-serif. (3%) You can copy the code below, paste it in answer area, and then insert your code appropriately): <!DOCTYPE html> <html lang="en"> <head> <meta...
Create a webpage in which the user is allowed to select the page's background and color...
Create a webpage in which the user is allowed to select the page's background and color whether the page uses serif or sans serif fonts. The change the body element's style attribute accordingly. If the user onclicks any of the options, the webpage will turn into that format. For example, if the user clicks "Gray background", the background color of the webpage will be Gray. If the user clicks Serif-text, the text in the web page will be in Serif...
HTML/CSS: Modify the table you created in hands-on exercise 8.1 to be centered on the page,...
HTML/CSS: Modify the table you created in hands-on exercise 8.1 to be centered on the page, use a background color of #CCCC99, and display text in arial or the browser default sans-serif font. Configure this table using CSS instead of obsolete HTML attributes. Place an e-mail link to yourself on the web page. Save the file as mytable.html. HERE IS THE CODE FOR 8.1: <!DOCTYPE html> <html lang="en"> <head> <title>Practice with Tables</title> <meta charset="utf-8"> </head> <body> <table border="1" > <caption>School...
How do i make my html show 10 results per page, and how do i make...
How do i make my html show 10 results per page, and how do i make the books clickable to show results about them? <!DOCTYPE html> <html> <head> <title>Google Books Search</title> <script src="https://code.jquery.com/jquery-2.1.4.min.js"> </script> <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.2/jquery.min.js"></script> <style> body{ background:lightblue } .wrap{ max-width:400px; margin:auto; margin-top:10px; } .pagination, pagination-last{ float:left; } a{ text-decoration:none; padding:15px 20px; border:1px solid black; border-right:none; background:#f2f2f2; font-size:18px; font-weight:bold; } .pagination-last a{ border-right:1px solid black; } a:hover { background:orange; color;white; } </style> <!-- <script src="js/main.js"></script> --> <script> function B_Search()...
Trying to understand java script.. The code provided prints out
a game board of cells that are 10 x 10. I currnetly
have it printed out so that it will print out pink squares. how can
i create a click even on any of the pink squares that when they are
clicked it will turn the square black... then any
square that is black when it is clicked it will change back to the
color pink
html/js code and css...
Look at the following illustrated output for an HTML and
a css given below
<!DOCTYPE html>
<head>
<title>TABLE with STYLE
SHEET</title>
<meta charset="utf-8" />
<meta name="description" content="Godaddy Webpage
original" />
<link rel = "stylesheet"
href="GoDaddy_assignment_1.css">
<body>
<img src= "GoDaddy.png"/>
<p>Welcome
to:<strong>webhamster.com</strong></br>
This web page is
parked<strong>Free</strong>courtesy of
<a class="aclass1" href
="https://www.godaddy.com">GoDaddy.com</a></p>
<h1>Want to buy<span class
="span2">webmaster.com ?</span></h1>
<div class ="div1">
<a class ="aclass2"
href="https://www.godaddy.com">Learn How</a>
</div>
</hr>
<button>Search Ads</button>
</body>
</html>
“
QUESTION continued Given the corresponding css
file
.aclass1{color:purple;}...
Most questions answered within 3 hours.
-
A White Dwarf star has a luminosity L = 0.01 Lo (where Lo is one
solar...
asked 3 minutes ago -
Forecast Sales Volume and Sales Budget
For 20Y6, Raphael Frame Company prepared the sales budget that...
asked 4 minutes ago -
A small pond contains 50 fish, 15 of which have been tagged.
Suppose that a fisherman’s...
asked 16 minutes ago -
dy/dx = y-x/x-y
ydx + 2(x+y) =0
y' + 2xy = x^3
(x+y)dx + xdy =0
asked 20 minutes ago -
Describe a scenario for how a eukaryotic cell might have evolved
from a prokaryotic ancestor
asked 40 minutes ago -
Suppose there are 12000.0 civilizations broadcasting radio signals
in the Milky Way Galaxy at the moment....
asked 37 minutes ago -
There are two particles (1 and 2) that are moving around in
space. The mass of...
asked 39 minutes ago -
A Young’s interference experiment is
performed with monochromatic light. The separation between the
slits is 0.500...
asked 46 minutes ago -
What is meant by true length? True size
Why is a true-length line always parallel to...
asked 47 minutes ago -
A corporation issued
8% bonds with a par value of $1,240,000, receiving a $68,000
premium. On...
asked 53 minutes ago -
Consider the following balanced equation for the combustion of
methane, a component of natural gas.
CH4(g)+2O2(g)→CO2(g)+2H2O(g)Complete...
asked 1 hour ago -
1. While exploring the ocean you find a new organism attached to
the sea floor. It...
asked 1 hour ago