Index.html file not loading css [closed] - html

Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 8 years ago.
Improve this question
I've downloaded a website using wget. When I open the index.html file the css does not load. I noticed that the URL has the website name embedded in it when I open it on my local disk. For example:
file:///Users/admin/Desktop/HickEx/www.hickory.com.au/index.html
However the css folder is located in:
file:///Users/admin/Desktop/HickEx/css but is probably looking for
file:///Users/admin/Desktop/HickEx/www.hickory.com.au/css
How can I rectify this issue?
OK problem solved. Very dumb mistake by me.

Make the paths relative.
So change something from file://Users to /css/
OLD:
file://Users/SomePath/AnotherPath/MyCss/somefile.css
NEW:
../MyCss/somefile.css
A "/" will tell the file to start from the base directory, this could be your base C: depending on what is reading the path.
A "../" will tell it to go up one folder.. so "Users/Folder/../" actually hits the Users folder.
OR DO YOU MEAN
That you have plenty of files and you want to correct this in every page, not just the index. As in how to have wget not do this or a simple batch process that will do it for every file?
SECOND EDIT:
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>Hickory Group</title>
<link rel="stylesheet" href="css/style.css" />
<link rel="stylesheet" href="js/jquery-plugins/jquery.fancybox-1.3.4/jquery.fancybox-1.3.4.css" />
<link rel="shortcut icon" href="favicon.ico">
<script src="js/modernizr-2.5.3.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script>window.jQuery || document.write('<script src="js/libs/jquery-1.7.min.js"><\/script>')</script>
Folder Layout:
C:\SomeBasicFolder\index.html
C:\SomeBasicFolder\favicon.ico
C:\SomeBasicFolder\css\style.css
C:\SomeBasicFolder\js\jquery-plugins\jquery.fancybox-1.3.4\jquery.fancybox-1.3.4.css
C:\SomeBasicFolder\js\libs\jquery-1.7.min.js
C:\SomeBasicFolder\js\modernizr-2.5.3.min.js

Related

How do I add an image to the header? is there a code? [closed]

Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 4 months ago.
Improve this question
şimdiden teşekür ederim.
how do i add a picture here?
How can I install a thumbnail there?
is there a shortcode.
It's called a favicon.
You need to generate a .ico-File and put them into your project directory. Here is a simple generator: https://www.icoconverter.com
Then you can add the following code into your <head> element, next to your <title>
<link rel="icon" type="image/x-icon" href="favicon.ico">
<link rel="shortcut icon" href="favicon.ico" type="image/x-icon">
Make sure you name the generated file favicon.ico.
This way most browsers will support it!

My html file can't connect to my css file? [closed]

Closed. This question is not reproducible or was caused by typos. It is not currently accepting answers.
This question was caused by a typo or a problem that can no longer be reproduced. While similar questions may be on-topic here, this one was resolved in a way less likely to help future readers.
Closed 1 year ago.
Improve this question
I have been trying to connect my html and css together but I just can't seem to.
this is what my looks like:
<head>
<meta charset="UTF-8" />
<title>Angels Site</title>
<link rel="stylesheet" type="text/css" href="./Users/angel/Desktop/webdevangela/css/styles.css">
</head>
and I am 100% sure that the path is correct and my file with HTML docs and my file with css documents are in the same hierarchy so I should not have an issue I believe.
I assume your file structure is like this based on what you said.
/webdevangela
/css
style.css
/html
*.html
So your link needs to go out of your html folder by using ../ and then into the css folder.
<link rel="stylesheet" type="text/css" href="../css/styles.css">

Html file won't update when i save and refresh [closed]

Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 2 years ago.
Improve this question
I've written a code for some reason it won't refresh. I've tried a lot of things, comparing it with an example html page from w3 schools (that one does update when something is changed), tried to clear cache and use different browsers. Currently i am not using a server but just doing the front end first.
Here is the code.
<!DOCTYPE html>
<html lang = "en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" type="text/css" href="home.css">
<title>Vjeran Bach</title>
</head>
<body>
<div class = "content">
<h1>Vjeran Bach Services</h1>
<p>Web and graphic design</p>
</div>
</body>
</html>
Thanks
Edit: The problem is that atom is not saving anything.
Are you sure you have saved the updates to the file? If it is not saved, the browser will only serve the previously saved version of the file.
Another thing you could try (provided it is a .html file): find the file in your file system (Finder/My Computer) and drag it to your browser window, then you should see the updated version.

html and css wont link once placed in folder [closed]

Closed. This question needs debugging details. It is not currently accepting answers.
Edit the question to include desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem. This will help others answer the question.
Closed 4 years ago.
Improve this question
my css and html linked just fine when they were just all on my desktop but once I placed them in folders for proper file structure all the images broke and the css no longer links I made sure all the href's were proper just none of the images or the css are working anymore.
<!DOCTYPE HTML5>
<meta charset="utf-8">
<head>
<title >Space Cube</title>
<meta charset="utf-8">
<link href="mart145final/css/index.css" rel="stylesheet" type="text/css">
</head>
<body>
<header>
<img src="mart145final/images/space-cube.png" style="width:200px;height:100px;">
</header>
Try having the css folder and images folder inside the same location as the html file. Then, remove the "mart145final/" prefix from your link and image strings.
(Your html is currently saying "to find this image, go to the folder this html file is in, then go to mart145final and look for the css and images folder. I suspect the html file is inside your mart145final folder. In that case, just change the html references.)

How to add only those script and css files necessary to views with partial views [closed]

Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 8 years ago.
Improve this question
There are some views that I create which use the _layout partial view, but I don't want to include every single css or script bundle. What is the best way to include the script or css file in the view?
<head>
<link href="Content/style.css" .../>
<script src="Scripts/myscript.js" ...></script>
</head>
How can I get the view to render something similar to this? There is no head tag in a View that uses a partial view.
With Razor layouts, you can use Sections to define what scripts/CSS files you wish to load in your master layout file in your partials rather than in your master.
You can read more about Sections here, on Scott Guthrie's blog
In your shared _Layout.cshtml file, you could add
<head>
<meta charset="utf-8" />
<title>#ViewBag.Title</title>
#RenderSection("css")
#RenderSection("scripts")
</head>
And in a particular View...
<div> lol some content </div>
#section css {
<link rel="stylesheet" type="text/css" href="homeTheme.css">
}
#section scripts {
<script src="../../Scripts/home.js"></script>
}
You can load the css & scripts files common to the project in the Master page. And, only load the ones that are needed in the partial view by adding a link or script tag at the end of the rest of the markup in the partial view.