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.
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
<html>
<head>
<title> HELLO </title>
<link rel="stylesheet" type="text/css" href="back.css"/>
</head>
<body>
<h1> WELCOME TO THE NEW WORLD </h1>
<p> This is the world of Oppurtunities </p>
</body>
</html>
the css file is below.
body{
background-color: darkslategrey;
color: azure;
}
h1{
color: coral;
}
You question is pretty vague but your path to the CSS is probably off.
Without more info on your dev environment this is my best suggestion.
Change your CSS link to...
<link rel="stylesheet" type="text/css" href="../back.css"/> Notice the ./back.css
This may not be the correct path to the file but your issue lies in your relative path. It all depends on your file structure.
Basic Examples
<link rel="stylesheet" type="text/css" href="/back.css"/>
<link rel="stylesheet" type="text/css" href="../back.css"/>
<link rel="stylesheet" type="text/css" href="/someFolder/back.css"/>
Perhaps putting the css file into a folder might work out.
<link rel="stylesheet" type="text/css" href="styles/back.css"/>
That usually does the trick, let us know ;)!
My problem is that my website that I'm attempting to host with Github pages will not read the CSS that I have linked to it.
My HTML looks like this:
<!DOCTYPE html>
<link rel="stylesheet" type="text/css" href="https://github.com/legoman8304/legoman8304.github.io/blob/master/style.css">
<html>
<body>
<h1>Hello World</h1>
<p>I'm under construction!</p>
<h6>Copyright MIT Licence 2018</h6>
</body>
</html>
My CSS looks like this:
body {
background-color: lightblue;
}
h6 {
color: navy;
margin-left: 20px;
}
Link repository: legoman8304.github.io
I'm guessing I linked the CSS wrong because when I using inspect element on the site itself it does show style.css but when opened it's empty. Any help?
You need to link your HTML to the github page rendered style.css and not the file itself in the repo.
Change this:
<link rel="stylesheet" type="text/css" href="https://github.com/legoman8304/legoman8304.github.io/blob/master/style.css">
To this:
<link rel="stylesheet" type="text/css" href="https://legoman8304.github.io/style.css">
And move that stylesheet reference inside your <head> tag.
You can use some way:
Recommend: <link type="text/css" rel="stylesheet" href="style.css" />
Use from raw your css with href: https://raw.githubusercontent.com/legoman8304/legoman8304.github.io/master/style.css
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 .
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"