I'm coding in Windows Notepad the following:
It only display the background in Light Gray, but without showing the heading and the pareagraph!
<!doctype html>
<html>
<head>
<style>
body {background-color:lightgray}
h1 {color:blue}
p {color:green}
</style> //style tag not end correctly check it
</head>
<body>
<h1>dfgdfd</h1>
<p>hjsdfkj</p>
</body>
</html>
Related
This is my html file
<!DOCTYPE html>
<html>
<head>
<title>CSS cheat sheet</title>
<link rel="stylesheet" type="text/css" href="csscheatsheet/style.css">
</head>
<body>
<h1> Hello World</h1>
</body>
</html>
This is my css file
h1 {
color: green;}
You can see what I am trying to achieve at 10:44 mark. Just changing the h1 by changing the color, but it is not working. I have the same file names as the guy in the Youtube video. (https://www.youtube.com/watch?v=yfoY53QXEnI)
So I'm basically wondering if the code I wrote is supposed to just pop up a page with "This web page uses an external style sheet", in blue font. I've been trying for hours to get my CSS to link to my HTML code and finally I did but all it was, was blue font. P.S I'm supposed to turn this in tonight so need to be sure!
What it looks like
<!DOCTYPE html>
<html lang="en">
<head>
<title>External Styles</title>
<meta charset="utf-8">
<link rel="stylesheet" href="color.css">
</head>
<body>
<p>This web page uses an external style sheet.</p>
</body>
</html>
css:
body { backround-color: #0000FF;
color: #FFFFFF;
}
No it is not. It suppose to show with White Color font with a light background.
This is some other css or browser plugin's impact.
You can try on the fiddle first to verify what it can look like at a clean state.
https://jsfiddle.net/
First of all you have wrongly typed background-color.
The code you provided is giving you the Blue background with white text.
HTML Code
<!DOCTYPE html>
<html>
<head>
<title>Fiddle</title>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<div id="txtPopup">
<p>This web page uses an external style sheet</p>
</div>
</body>
</html>
CSS Code
body {
color: #FFFFFF;
background-color: #0000FF
}
Very new to web design, sorry for the obvious Q, but I am breaking my head here.
I can't understanding why can I not get the text color from my CSS file..
I tried:
<p style = "color:red">bla1</p>
<div class ="colorRed">bla2</div>
bla1 is red, but bla2 isn't.
My .css:
.colorRed
{
color : red;
}
Your css code is correct. Check that you have linked css file in your html code or not.
<link rel="stylesheet" type="text/css" href="style.css"/>
or put your css directly into style tag as follow
<html>
<head>
<style>
.colorRed
{
color : red;
}
</style>
</head>
<body>
<div class ="colorRed">bla2</div>
</body>
</html>
Demo: http://jsfiddle.net/hsakapandit/2bAKd/
<div class ="colorRed">bla2</div> should work. Check the path to your css file is correct.
For some odd reason when I try styling this html page with a backround in css nothing appears.
Any Ideas on how to fix
-Thanks
<html>
<body>
<title>Test</title>
<b><font color="#F91212"><center>Test</center></font></b>
<br><b><center><font color="#FF0000">Have Fun!</font></center></b></br>
<br><b><font color="#FF0000"><center>Join now for free by clicking here </center></font></b></br>
<br><center><img src="test.jpg"></img></center></br>
<style>
body {background-color:#b0c4de;}
</style>
</body>
</html>
It should look something like this (notice I moved the style tag within the head tag):
<head>
<style>
body{
background-color:#color;
}
</style>
<head>
Why is your style tag in your <body> tag? It should be in the <head> tag:
<html>
<head>
<style type="text/css">body { background-color: red; }</style>
</head>
<body>
</body>
</html>
Or even better, put your css in a separate .css file.
First of all that's not how css works or how html works. You should put your style tags in html head section. And you should determine html element where you want to set background-color.
<html>
<head>
<style>
body {
background-color:#b0c4de;
}
</style>
</head>
<body>
<title>Test</title>
<b><font color="#F91212"><center>Test</center></font></b>
<br><b><center><font color="#FF0000">Have Fun!</font></center></b></br>
<br><b><font color="#FF0000"><center>Join now for free by clicking here </center></font></b></br>
<br><center><img src="test.jpg"></img></center></br>
</body>
</html>
Usually the syntax is like so:
<html>
<head>
<style>
body { background: #121212; }
</style>
</head>
</html>
With the style tag in the head tag.
You will want to move your <style> tag inside of your <head> tag.
Try this code:
CODE
<style>
body {
background-color:#b0c4de;
}
</style>
<body>
<b><font color="#F91212"><center>Test</center></font></b>
<br><b><center><font color="#FF0000">Have Fun!</font></center></b></br>
<br><b><font color="#FF0000"><center>Join now for free by clicking here </center></font></b></br>
<br><center><img src="test.jpg"></img></center></br>
</body>
SAMPLE
http://jsfiddle.net/Uy2Zb/
Am able to set the background-color attribute for HTML body in an inline <style> command
but not when the identical command is moved to an external stylesheet. A specific example
is given below.
In test1.html, background-color is set to "blue: in the HTML. File test2.html is identical to test1.html except the <style> command is commented out. File style.css contains a spec for background-color and also for the <H1> element (to test that the browser really is
reading the stylesheet).
First test produces orange text against a blue background. Second test produces orange
text, but against a white background. I've tried this on Firefox 21, Chrome 19, and
IE 9; all give the same results.
What's going on? Any help would be appreciated.
Here are the three sample files:
test1.html:
<HTML>
<head> <link type="text/css" rel="stylesheet" href="style.css">
<style type="text/css">
body {background-color: blue}
</style>
</head>
<body> <h1>This is a test.</h1> </body> </html>
test2.html:
<HTML>
<head> <link type="text/css" rel="stylesheet" href="style.css">
<!-- <style type="text/css">
body {background-color: blue}
</style> -->
</head>
<body> <h1>This is a test.</h1> </body> </html>
style.css:
<style type="text/css">
body {background-color: green;}
h1 {color: orange; }
</style>
Thank you!
don't use <style type="text/css"></style> in style.css
<style type="text/css"></style>
is html tags, and you shouldnt have them in your .css file,
replace the code within style.css with this. Just copy and paste.
body {background-color: green;}
h1 {color: orange; }