my code is acting super strange, first, i cant get css to work.
randomly in my code there was lines that were grayed out like if it was a comment but there was no comments, i pressed the spacebar after each end of line and it went back to normal, pretty strange.
then whenever i tries to give css properties and classes, it wouldnt give them. i just reopened my computer and last time it worked perfectly fine.
i gave the right link to the css stylesheet in html, ive checked.
here is just one example :
home.php
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="homestyle.css"
media="screen" />
</head>
(... more code)
<h1 class="lorem">hello</h1>
stylesheet.css
body {
margin: 0px;
font-family: Arial, Helvetica, sans-serif;
}
(... more code)
.lorem{
color: white;
background-color: aqua;
}
(... more code)
Change
<link rel="stylesheet" type="text/css" href="homestyle.css"
media="screen" />
by
<link rel="stylesheet" type="text/css" href="stylesheet.css" media="screen">
because the file called stylesheet.css and you call homestyle.css, Or just rename your css file to homestyle.css .
Related
I've been trying to learn HTML and have been following a tutorial online.(https://www.w3schools.com/html/html_css.asp) the tutorial does have some misinformation, so I've been looking on here for help as well. I have reached the point where you use external CSS files rather than using the <style> function.
My code is in /HTML/[ProjectName]/project.html, while my CSS is in /HTML/[ProjectName]/CSS/styles.css. Below are both files;
body {
background-color: powderblue;
}
h1 {
color: red;
}
p1 {
font-size: 200%;
}
<!DOCTYPE html>
<html>
<title> Linked CSS </title>
<head>
<link rel="style" type="text/css" href="/CSS/styles.css">
</head>
<body>
<h1> The CSS is in a separate doc </h1>
<p1> Let's see how this works out </p1>
<a href="/CSS/Styles.css" target="_blank">
<p2> Link to CSS file </p2>
</a>
</body>
</html>
From what I've read the css is properly linked to my file, and when I open the link it opens to the css page. What am I doing wrong?
Make sure you update your code to match your correct filename.
If your CSS is stored in the /HTML/[ProjectName]/CSS/style.css, then you should it like this
<link rel="stylesheet" type="text/css" href="CSS/style.css">
Try writing <link rel="stylesheet" type="text/css" href="CSS\styles.css">and check the spelling of your CSS file because they are different in question and in your code.
It`s easy. Take it
link rel='stylesheet' type='text/css' href='CSS/style.css'
and read W3School
I am trying to learn HTML and CSS. I have tried using my CSS but it doesn't seem to be working properly.
HTML:
<head>
<link rel="stylesheet" type="text/css" src="styling.css">
<script src="../(public)/js/js.js"></script>
<meta charset="utf-8" />
<title>MyPortfolio</title>
</head>
CSS:
body
{
background : (red);
}
<link rel="stylesheet" href="./styling.css">
The folder directory of your CSS file determines how you link it.
Its best practice to link your script at the end of your web page, before the end of the body tag.
Its not "src", its "href".
<link rel="stylesheet" href="style.css">
I suggest you put that script tag on the bottom of your page.
Oh and one last thing, that css is incorrect. Here's what you should use:
body{
background:red; /* Or #ff0000 */
}
I have been using Brackets for a school image and was trying to move div tags next to each other but was experiencing no change in visuals of the code and I wanted to check if there is an issue with the external CSS so I tried to change the background colour to no successes and haven't even been able to change the background colour of a properly set up blank document.
I have been using the following to try to change the colour.
body {
background-color: green;
}
And this is the blank html for the purpose of testing
<!DOCTYPE html>
<html>
<head>
<title>Solitare</title>
<link rel="stylesheet" href="Untitled-2.css" type="tex/css">
</head>
<body>
</body>
</html>
Am I missing something blindingly obvious or is there another issue?
Thank you very much. G. Ward
probably you have a mistake at <link rel="stylesheet" href="Untitled-2.css" type="tex/css"> try this <link rel="stylesheet" href="Untitled-2.css" type="text/css">
body {
background-color: green;
}
<!DOCTYPE html>
<html>
<head>
<title>Solitare</title>
<link rel="stylesheet" href="Untitled-2.css" type="text/css">
</head>
<body>
</body>
</html>
Your code is just fine!
you are only missing 1 thing a 'text' instead of 'tex'
<link rel="stylesheet" href="Untitled-2.css" type="tex/css"
should be
<link rel="stylesheet" href="Untitled-2.css" type="text/css"
Here´s my css code:
body {
background-image: url(http://relevantfl.org/wp- content/uploads/2013/07/light_grey_3000x3000.jpg);
color: white;
font: 12px/1.4em Arial,sans-serif;
}
Here´s my html code:
<!DOCTYPE html>
<html>
<head >
<link href=”/Users/EdvinHedblom/Library/Mobile Documents/com~apple~CloudDocs/design.css” rel=”stylesheet” type="text/css" media="all" />
</head>
The problem is that when i run the code in browser it only shows my html-code and no style at all.
You have used bad quotes, use " or '.
<link href="/Users/EdvinHedblom/Library/Mobile Documents/com~apple~CloudDocs/design.css" rel="stylesheet" type="text/css" media="all" />
Then remember then you are linking file from your local machine, remote server can find it if you move your HTML to server.
Ok im trying to link my index.html to mystylesheet.css but is isn't working? It works perfectly on CodeAcademy but doesnt seem to work when I run it in chrome. I'm using Notepad++ by the way. When I say isn't working, i mean that the styles in the css aren't coming up, like the background colour for example. here it all is, is there anything im doing wrong?
index.html
<!DOCTYPE html>
<html>
<head>
<link type="text/css" rel="mystylesheet" href="mystylesheet.css"/>
<title>A$AP World</title>
</head>
<body>
<p>Please agree with the terms&conditions before entering.</p>
</body>
</html>
mystylesheet.css
body {
background-color: black;
}
p{
color:red;
}
img {
display: block;
height: 100px;
width: 300px;
margin: auto;
}
Your rel attribute should be rel="stylesheet":
<link type="text/css" rel="stylesheet" href="mystylesheet.css"/>
SitePoint explains it nicely:
The rel attribute defines the relationship that the linked resource has to the document from which it’s referenced. In most cases, this resource will simply be "stylesheet", which means, not surprisingly, “the referenced document is a style sheet.”
Change the rel attribute value, to be rel="stylesheet"
Change this line
<link type="text/css" rel="mystylesheet" href="mystylesheet.css"/>
to be
<link type="text/css" rel="stylesheet" href="mystylesheet.css"/>
Try:
<link rel="stylesheet" type="text/css" href="mystylesheet.css">
Try this:
rel="stylesheet"
instead of
rel="mystylesheet"
<link rel="stylesheet" href="mystylesheet.css" />
As you're using an HTML5 doctype, you can also leave off the type declaration.