I need some help. I decided to create a home FTP server for my family. I hit a roadblock a few hours ago. When I was creating my home page, I wanted to test it in Chrome. I linked a css file to it aswell. I expected to see the test webpage, which was a h1 with the text hello. What actually happened was the fact that it downloaded my html file, and when I opened that in Chrome, I saw my page without the css. I've tried everything to speak of on this site and I even checked page 2 of Google. Here's my code, I'm running FTP on IIS 10.
<!DOCTYPE HTML>
<html>
<head>
<title>Home</title>
<link rel="stylesheet" href="main.css">
<meta http-equiv="Content-Type" content="text/html">
</head>
<body>
<h1>Hello!</h1>
</body>
</html>
As far as I know, chrome download the html page is right. Since you use chrome to access a ftp file, it is not a http connection to the server. The chrome will not directly show it.
If you want to show the html page in the browser, you should use IIS website instead of ftp site.
More details about how to create a IIS web site, you could refer to below article.
https://support.microsoft.com/en-sg/help/323972/how-to-set-up-your-first-iis-web-site
i guess you are putting it in a wrong format
as https://www.w3schools.com/css/css_howto.asp says
<link rel="stylesheet" type="text/css" href="mystyle.css">
Related
So I've been creating a project on my localhost server for the first time using wamp (I've only coded html/css/js in repl.it before this) and for some reason, my css will not
stay on my page. When I try changing styles using my CSS file, it shows up when I refresh, but then very quickly disappears. The following pictures represent this (NOTE: I had to record and slow down the refresh just to see that it did change):
this appears right after refreshing
milliseconds later, the CSS no longer does anything
The following code is the link to the css in my html file (have some other script tags in there as well):
<html>
<head>
<title>Home Page</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="css/bootstrap.min.css" />
<script src="js/bootstrap-icons.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<link href="/PHP-Login-System/style.css" rel="stylesheet" type="text/css" />
</head>
<body>
An image of directory tree (trying to link style.css with index.php):
directory tree
As far as I know, since my styling does show up for a brief moment, I don't think the error could be in my linking between the files, but I could be wrong. Any comments are appreciated.
Everything looks good to me, I think the problem is coming from wamp server, because like you said, your css styles is showing up and disappearing.
My advice is:
Uninstall wamp total , download a fresh copy from the internet.
Restart your computer, then reinstall the new copy you downloaded
Whenever I make an index.html file and write Anything inside it then open it in browser, I see a Favicon that I have never seen before. I want to know why is that Favicon showing and is there any way to stop it?, I didn't even add a html tag for a Favicon but It's still showing.
CODE:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>This is a title</title>
</head>
<body>
<h1>TEST</h1>
</body>
</html>
Favicon
Image of Favicon
First of all try to be sure that your project do not have favicon. Try to open www.[mysite].com/favicon.ico. If there is none pass to step two.
Wrong favicon could be taken automatically from your browsers cache. Try to hard reload your page (for mac it is shift+cmnd+r)
If favicon still shows and you do not want to show any favicon just pass empty href for it inside your header tag
<link rel="shortcut icon" href="data:image/x-icon;," type="image/x-icon">
The major browsers look into the root folders after a "favicon.ico", you can find more info on it here (another Stackoverflow thread)
Sometimes, a webpage automatically makes an automatic favicon request on page load.
To prevent this add following to head of your HTML tag.
<link rel="icon" href="data:,">
I'm just transferring all my files over from xampp's htdocs to my server and now I just need to add a favicon.
I have the icon saved as 'favicon1.ico' and it is a proper icon size 16x16, but I cant get it to work.
This is the code I have for it:
<html>
<title>Server Test</title>
<head>
<h1> Hello World </h1>
<link rel="shortcut icon" href="O:\Intranet\favicon1.ico"/>
</head>
<body>
</body>
</html>
That is the correct location of the icon in the href so I dont see why this shouldn't work.
I've never added a favicon to a site before so that is where my main problem of not knowing exactly what it should look like lies.
Your Favicon path uses a windows style File path as pointed out in the comments.
Ensure the following
favicon1.ico file is present in the package that you are transferring onto the server.
Ensure that the file is accessible over http (try using a browser to navigate to it). The path should be something like http://server:port/app-uri/favicon1.ico
After that as suggested in one of the comments use a relative path such as ./favicon1.ico in the HTML source.
Also I suggest reading up on the concept of favicon http://www.w3.org/2005/10/howto-favicon
Code below should work. Try this.
<link rel="icon" type="image/png" href="http://yoursite.com/favicon1.ico">
Notice that href points to the address of your icon depending where you put the icon.
I'm trying to add a favicon to a (simple) HTML page. It has to work on Internet Explorer only, I don't care about other browsers.
<html>
<head>
<title>Test</title>
<!-- COMMENTS -->
<link rel="shortcut icon" href="favicon.ico"/>
</head>
<body>
Favicon Test
Download
</body>
</html>
It doesn't work. I tried in order: /favicon.ico, the absolute path in this format \\SERVER\...\favicon.ico, an http://randomDomain.com/favicon.ico http link, Base64 encoding of the .ico file, Base64 of png file but any solution is actually working. I'm 100% sure the .ico file is well designed. I was wondering if this problem is related to the fact that the page is actually hosted on a system where is not running an HTTP server. In fact, if i try to click on the Download link and then I look at image properties, the result is this
(source: xomf.com)
(source: xomf.com)
Is there any solution? Consider that there wouldn't be a problem using an external http link but it doesn't work.
Many thanks
I got an empty website up and running online. Basic html5 page with a style link and a script link. It looks like this:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Taco Bell at midnight</title>
<meta name="description" content="">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" type="text/css" href="css/styles.css" />
<script src="js/scripts.js" type="text/javascript"></script>
</head>
<body>
</body>
</html>
The src's are accurate, I have a folder in the same directory as the html page with the name css and js. When I try to visit them, it shows them as blank. However, when I drag the files out to the same directory as the parent, and update the href, it shows them with the content. Does anyone have an idea as to why this is happening?
It seems relevant to add I just purchased the domain today from GoDaddy, and am using x10hosting for free hosting.
UPDATE: The styles.css still appears in my home directory (in chrome, not cpanel) after being moved, and ctrl+f5'ing, and it now also appears in the folder css/styles.css as well???
UPDATE2: Now it appears as though the files are just updating really slowly? I see the changes in codeanywhere/cpanel immediately, but chrome takes like half an hour to get the changes, regardless of clearing my history/cache and ctrl+f5'ing.
x10hosting (free version, I haven't tested paid version) cache is really bad, this seems to be a server issue, sometimes it keeps showing files that you deleted hours ago, sometimes it won't show files that didn't exist beforem, you might need to wait for hours.