I'm trying to add an image in background but I want to use internal CSS and I can't find what's wrong. The font is ok but the background doesn't appear.
Here is my code:
<!DOCTYPE html>
<html>
<head>
<style>
body:{font-family: Arial}
body:{background:url("C:\Users\Sonik379\Downloads\backPortfolio.jpg");}
</style>
</head>
<body>
<p>Hello world</p>
</body>
</html>
Try this:
<!DOCTYPE html>
<html>
<head>
<style>
body{
font-family: Arial;
background:url("C:\Users\Sonik379\Downloads\backPortfolio.jpg");
}
</style>
</head>
<body>
<p>Hello world</p>
</body>
</html>
There is an issue with the path, you can try this:
<style>body{background:url(file:///C:/Users/Sonik379/Downloads/backPortfolio.jpg);}</style>
Related
I am creating this simple html page... everything seems to work fine. But when I came to link my css to my html. Nothing happens and I made sure I save everything, nothing happens to my webpage. Can you check my code below and see if there is any problems thanks.
HTML:
<html>
<head>
<title>What if?</title>
<meta http-equiv="What if" content="text/html; charset=uft-8"/>
<img src="images/Logo.jpg" height="300" width="400"/>
<link rel="stylesheet" type="text/css" href="styles.css"/>
</head>
<body>
<header>
<h1>What if</h1>
</header>
</body>
</html>
My CSS:
body {
font-family : Verdana, Arial, sans-serif;
font-size : medium;
}
h1 {
<center></center>
background-color: #CCCCCC;
color: #000000;
}
Also Don't use <img> tag into <head> section. <img> tag should be in <body> section.
I have 3 webpages. The first is called inventorshome, second PythonTutorialHome, third HTMLTutorialHome. The second and third look the same in the browser. Notice that the code is exactly the same for the pages. They should look exactly the same by that logic. For some reason, the div is larger for inventorshome than in PythonTutorialHome and HTMLTutorialHome. I am using Google Chrome browser, and they are files on my computer.
Here is the code for inventorshome:
<!DOCTYPE html>
<head>
<title>Home</title>
<base href="file:///C:/Users/David/Documents/Website/Pages/">
<link rel="stylesheet" type="text/css" href="file:///C:/Users/David/Documents/Website/Pages/inventorshomestyles.css">
</head>
<body>
<div id="header">
</div>
</body>
</html>
Here is the code for PythonTutorialHome:
<!DOCTYPE html>
<head>
<title>Home</title>
<base href="file:///C:/Users/David/Documents/Website/Pages/">
<link rel="stylesheet" type="text/css" href="file:///C:/Users/David/Documents/Website/Pages/inventorshomestyles.css">
</head>
<body>
<div id="header">
</div>
</body>
</html>
The CSS linked to these webpages is:
#header {
position:absolute;
left:0px;
top:0px;
background-color:#8AC007;
width:100px;
height:30px;
}
When I change the width and height to percentages, they are the same across all three pages. When the dimensions to pixels, different results are yielded. What is going on here?
I can not get a simple CSS to apply to my jsp page. The page displays, but just black on white (no underline). The TOMCAT localhost_access_log shows the GET of the CSS is successful (200).
using Tomcat with directories:
web-apps/myapp
--jsp -- cat_list.jsp
--css -- main.css
--WEB-INF
main.css:
h3 {
background-color: blue;
text-decoration: underline;
}
cat_list.jsp:
<!DOCTYPE HTML>
<html>
<head>
<title>Category List</title>
<LINK rel="stylesheet" type="text/css" href="css/main.css" media="screen">
</head>
<body>
<h3> Test Text </h3>
</body>
</html>
What am I missing?
ive been watching a tutorial that has told me to change the background color of a webpage by using:
body {background-color:red;}
however when i try and load the page in google chrome the background remains white?
This is my full code:
<!doctype html>
<html> <!--Document START-->
<head> <!--Head START-->
<title>Page Title</title>
<style type="text/css"> <!--CSS START-->
body { background-color:red }
</style>
</head>
<body> <!--Body START-->
<h1>Page Title</h1>
</body>
</html>
The problem is you have an html comment within your css.
<style type="text/css"> <!--CSS START-->
Remove the <!--CSS START--> and it will work fine.
If you want to add comments within css then you can use /* */, e.g:
<style type="text/css">
/* CSS START */
This works for you.
body {
background:red;
}
Ahhh yes, the problem is you have a html comment in the css, so it will not work after: –
Should be:
body { background-color:red; }
(You forgot the ; after "red")
I am trying to set background image using background-image:url but its not working.
<!doctype html>
<html>
<head>
<title>MyTitle</title>
<style type="text/css">
body{
<!-- background-color:green; -->
background-image:url("background.jpg");
<!-- color:white; -->
}
</style>
</head>
<body>
</body>
</html>
Pls Help!!
<!-- comment -->
is not valid comment syntax within a CSS block. That is probably breaking your CSS rule.
Try
/* comment */
The tag doesn't nest into the tag.
Try
<!doctype html>
<html>
<style type="text/css">
body{
/* background-color:green; */
background-image:url("background.jpg");
/* color:white; */
}
</style>
<head>
<title>MyTitle</title>
</head>
<body>
</body>
</html>
And comments in CSS are defined like...
/*this is a comment*/