stylesheet does not work after publishing - html

<link type ="text/css" href="../../Content/jquery.treeview.css" rel="Stylesheet" />
<link type ="text/css" href="../../Content/screen.css" rel="Stylesheet" />
<script src="/../../js/jquery.js" type="text/javascript"></script>
<script src="/../../js/jquery.cookie.js" type="text/javascript"></script>
<script src="/../../js/jquery.treeview.js" type="text/javascript"></script>
i am working with mvc. i have these css and js links in my view. it works perfectly when i work on localhost. but after publishing, it seems like these css or js files does not work. i checked authorization settings of these files and there is nothing wrong.

Try using
<link type="text/css" href="#Url.Content("~/content/jquery.treeview.css")" rel="Stylesheet"/>

Instead of giving path like this. i think you should provide the full path. After giving the full path, it will work everywhere.
<link type ="text/css" href="http://www.domain.com/Content/jquery.treeview.css" rel="Stylesheet" />
<link type ="text/css" href="http://www.domain.com/Content/screen.css" rel="Stylesheet" />
<script src="http://www.domain.com/js/jquery.js" type="text/javascript"></script>
<script src="http://www.domain.com/js/jquery.cookie.js" type="text/javascript"></script>
<script src="http://www.domain.com/js/jquery.treeview.js" type="text/javascript"></script>

Can you post the URL where you are having the problem? It sounds like an issue with your relative
paths.
Here is what you can do:
Open up the site in Chrome
View page source
Up in the header, right click on the link to your CSS file and select Open Link in New Window
My guess is that you will get a Not Found error. Look at the URL to the non-existent CSS file
and see if it matches up to where you think it is.
Best,
Cynthia

The recommended way to insert URLs of contents in your MVC web application is by using Url helper.
E.g.
Css:
<link type="text/css" href="#Url.Content("~/Content/jquery.treeview.css")" rel="Stylesheet" />
Scripts:
<script src="#Url.Content("~/js/jquery.js")" type="text/javascript"></script>

Related

How to use bootstrap without CDN?

I want to use bootstrap on my website. First, I put CDN in the head, and everything is fine. Then I don't want to apply bootstrap by CDN, so I download the bootstrap file, and put the CSS part in the <style>, and put the js part in the <script>. But it didn't work, why?
This is the CDN code:
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.0/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js">
Follow this step:
Go to https://getbootstrap.com/ and then click a big "Download" button.
Scroll down to "Compiled CSS and JS" section, click "Download" button.
You'll have a file named like bootstrap-4.0.0-beta-dist.zip downloaded (according to current version).
Extract it. It'll have 2 folders inside: css & js.
Include them on your web project directory e.g. in assets/bootstrap.
Include them inside your html <head> script:
<link rel="stylesheet" href="assets/bootstrap/css/bootstrap.min.css">
<script src='assets/bootstrap/js/bootstrap.min.js'></script>
Good luck & keep learning!
In your <head> section you can Link your CSS stylesheet
<head>
<link rel="stylesheet" href="css/bootstrap.min.css">
</head>
And Link Js files on
<body>
<!-- html code -->
<script src="js/jquery.min.js"></script>
<script src="js/bootstrap.min.js">
</body>

Which file-path to use with localhost after moving site from static environment

I have a static website that is locally stored in the C drive: C:\site
I've now created a new site within IIS and pointed it to that location.
When I type 'localhost' in the browser, it pulls up the sites index.html
The issue is I've lost all CSS / JS / etc. and I assume this is because my paths aren't pointing to the right source. I have the same issue for links (hrefs).
Before connecting to IIS, my paths were as follows:
<link rel="stylesheet" type="text/css" href="C:/Site/css/MyFontsWebfontsKit.css" />
<link rel="stylesheet" type="text/css" href="C:/Site/css/bootstrap.min.css" />
<link rel="stylesheet" type="text/css" href="C:/Site/css/style.css" />
<script type="text/javascript" src="C:/Site/scripts/jquery-1.12.3.min.js" ></script>
<script type="text/javascript" src="C:/Site/scripts/bootstrap.min.js" ></script>
I've tried looking around for answers, as well as trying some things such as:
<link rel="stylesheet" type="text/css" href="localhost/Site/css/style.css" />
OR:
<link rel="stylesheet" type="text/css" href="http://localhost/Site/css/style.css" />
But still no luck in seeing my CSS, JS, etc.
As for the links, they were working before IIS and looked like this:
About Us
I assume once I can achieve the correct paths for my CSS & JS I'll be able to figure out the links. Any help would be appreciated. Thanks!
If your folder structure is this:
css
style.css
index.html
Then the path css/style.css will always work from index.html, regardless of where it's hosted. You're hard-coding root paths in the references, so when the root path changes in any way it's going to break all the references.
Try:
<link rel="stylesheet" type="text/css" href="css/style.css" />
(With the same change applied to other references.)
You can always reference files relative to each other, but referencing them relative to the root requires a consistent root.

A href tag not working

I am creating download links to PDFs of Chinese articles I have written, but for some reason, the links are not working. I stopped at the first li because I could not figure it out. Even when I change it to a simple a href to my home page, it still does not work.
<link href="http://s3.amazonaws.com/codecademy-content/courses/ltp/css/shift.css" rel="stylesheet">
<link rel="stylesheet" href="http://s3.amazonaws.com/codecademy-content/courses/ltp/css/bootstrap.css">
<link rel="stylesheet" href="Chinese.css">
<link rel="stylesheet" type="text/css" href="stylesheet.css"/>
<link rel="stylesheet" type="text/css" href="//fonts.googleapis.com/css?family=Yellowtail" />
<link rel="stylesheet" href="animate.css">
<script type="text/javascript" src="home.js"></script>
<script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>
<script src="jquery-2.1.1.min.js"></script>
<script>window.jQuery || document.write('<script src="jquery-2.1.1.min.js"><\/script>')</script>
<script src="Chinese.js"></script>
<div class="samples">
<li><a href="XiJinPing.pdf" download>習近平反貪</a></li>
<li>伊波拉與伊斯蘭國:世界末日的徵兆</li>
<li>人類是否應探索太空?</li>
<li>社會的價值觀與同性戀</li>
<li>兩岸的未來</li>
</div>
Originally I thought you meant the links to the files were not working. (Which is why I suggested the following)
The download attribute is not supported in IE or Safari. Which browser are you using? Do you get an error message? Make sure your XiJinPing.pdf file is in the same directory as the HTML file.
Is the source actually being served or just opened in the browser?
http://www.w3schools.com/tags/att_a_download.asp
Now that I have re-read the question it appears that you mean the link tags are not working.
The first CSS (shift.css) only adds a font-face to know if it works you will need to add that font-face to an item through a style.
div {
font-family: Shift;
}
jsFiddle
The second thing you need to do is add the javascript for bootstrap.
Also if you run into Cross Scripting errors, you may need to use HTTPS versions of the links to your css files or vice versa. Chrome blocks traffic automatically but a shield will show up in the address bar and you can select it to allow the traffic anyway.
You should also close the link tags.

ASP.NET 5 - Getting a 404 error, but when I dig in with the console on chrome, I see it is looking in an old directory

I'm referencing these files in my index.html:
<link href="wwwroot/lib/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet" />
<link href="wwwroot/lib/font-awesome/css/font-awesome.min.css" rel="stylesheet" />
<script src="wwwroot/lib/jquery/dist/jquery.min.js"></script>
<script src="wwwroot/lib/bootstrap/dist/js/bootstrap.min.js"></script>
<script src="wwwroot/lib/angular/angular.min.js"></script>
<script src="wwwroot/lib/angular-ui-router/release/angular-ui-router.min.js"></script>
<script src="wwwroot/app/app.js"></script>
<script src="wwwroot/app/controllers/home.controller.js"></script>
But when I build the project with IIS Express in visual studio, I get a 404 error for each one. When I look at the console and resources tabs in Chrome to see where it's trying to pull the files from, I see that the directory is an old one from a previous, similar project.
I've tried clearing my cache in several different ways and deleting the old project altogether, but nothing is working...
wwwroot is the root WWW directory. You should remove these path prefixes from your script's and css's links.
<link href="~/lib/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet" />
<link href="~/lib/font-awesome/css/font-awesome.min.css" rel="stylesheet" />
<script src="~/lib/jquery/dist/jquery.min.js"></script>
<script src="~/lib/bootstrap/dist/js/bootstrap.min.js"></script>
<script src="~/lib/angular/angular.min.js"></script>
<script src="~/lib/angular-ui-router/release/angular-ui-router.min.js"></script>
<script src="~/app/app.js"></script>
<script src="~/app/controllers/home.controller.js"></script>

Jquery UI script tag error

<head>
<title>Mary</title>
<link href="http://localhost/stylesheet.css" type="text/css" rel="stylesheet">
<link href="http://localhost/mary/jquery-ui-1.10.3.custom.min.css" type="text/css" rel="stylesheet">
<script type="text/javascript" src='http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js'></script>
<script type="text/javascript" src="http://localhost/jscript.js"></script>
<script type="text/javascript" src="http://localhost/jquery-ui-1.10.3.custom.min.js"/>
</head>
I just got done learning about jquery ui and am trying to include it in my very first webpage, but it's not working. I checked all of the links on my server, and they link up to the documentation, but the only way the content shows up when I check the webpage on my server is if I comment out the last script tag. But if I do that, I can't access the jquery ui, right? I'm so confused. I'm so excited to try all of this stuff out, but I can't figure out how to make it work :( Any help is greatly appreciated.
karthikr's answer is most likely the problem, but if that doesn't work try referencing the URL hosted by jquery itself.
<script type="text/javascript" src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
Assuming all the static files are properly referenced,
<script type="text/javascript" src="http://localhost/jquery-ui-1.10.3.custom.min.js"/>
should be
<script type="text/javascript" src="http://localhost/jquery-ui-1.10.3.custom.min.js"></script>
Note the end of the script tag /> should be ></script>