How to link external CSS stylesheets on a Chromebook - html

I'm developing a website and I need to use external CSS stylesheets.
The only drawback is I'm using a new Chromebook after migrating from Windows.
I'm using CDE, so how should I link an external stylesheet to an HTML file?
To be more specific, how do I find the full file path of a CSS file on a Chromebook?

For all of the noobs out there, I figured it out.
You have to link an external stylesheet (if on a Chromebook) using relative linking, so what you will want to do is this:
<link rel="stylesheet" type="text/css" href="name_of_stylesheet_in_same_folder_as_html.css">
Basically, keep your CSS file in the same folder as your HTML or Javascript file and it will most likely work when there is no standard full file path.

Can you view the css directly in the browser? If so, whatever url you're using should work. If not, perhaps something else is going on. Chromebook should be no different from any other browser.

Related

Why does my CSS file does not load? Electron js

Here is the error I get:
Everything works perfect without electron js and the path I entered was provided by VS code itself.
I'm using Electron js v16 and have to put my css files inside app folder.
You're using absolute paths to reference your CSS files from your HTML. By doing this, it is attempting to get those CSS files from the root directory (e.g. "C:/"). Try using relative paths. As an example for your case:
<link rel="stylesheet" href="../css/all.min.css">
Make sure you have a folder in your root called css. If you don't, remove the /css/ part. Also, make sure the spelling is correct. Note that files are case-sensitive, so check that as well.
Try using ./css/etc. instead of /css/etc

Why are my CSS changes not being displayed on my website?

I am in the process of creating a portfolio website for a web design course I am taking. I have created a style sheet for my website but I am having trouble getting the changes to show up on my site. All of the changes appear when I view it locally through Chrome, but when I upload my website the changes don't show up. I have checked my code and even tried validator.nu to see if their are any problems but it appears that their are none.
Here are my html and css files:
https://gist.github.com/J-Conley/94255b04292287b58892b75fdc5e35c0
and my website:
http://cook-camel-58438.bitballoon.com/.
If it helps I have a folder called cf_template-1.1.1 and in that folder I have a folders named html, css, and img. Any help would be appreciated.
There are errors in the console, make sure to fix these and try again if it persist.
the image urls behaves differently in localhost and live, make sure to upload those images properly using your website builder whatever it is and not use static urls.
I see you used bootstrap here. When overriding styles make sure you use the exact same selector whatever library did used you are trying to modify i.e. .md-content .md-container .md-input .md-label span you can use inspect element / web developer tools to find this and use the exact same selector to override the default style given by the library, make sure the last thing you import is your custom style sheet.
You made wrong with css file path.
<!-- Custom styles for this template go here -->
<link rel="stylesheet" type="text/css" href="css/styles.css">
Replace With
<!-- Custom styles for this template go here -->
<link rel="stylesheet" type="text/css" href="styles.css">
all your images are not found. Check the path / upload them again and make sure it's right. Maybe try the absolute path;
http://d33wubrfki0l68.cloudfront.net/bundles/adc83b19e793491b1c6ea0fd8b46cd9f32e592fc.js is not a style sheet. Please remove the style tag of it
You should upgrade your Jquery from version 1.11.3 to 3x.
That will help because version 1.11.3 is not compatible with Bootstrap 3.3.5.
Also you should try to press the "disable cache" button in Chrome Dev Tools->Network->Disable Cache. Usually, cache is the culprit of not updating CSS.

Reference .css and .js files for google chrome in Asp.Net projects

Is there any problem if I reference .css and .js with "~/file.ext" for chrome? Because I get some layout errors when I do it this way. Does chrome want it like "../" instead of "~/"? I am developing with Asp.Net Core and I just drag and drop the files from the Solution to the Html to create the references.
Typically when using the standard HTML, CSS, JS if a file that you want to point/reference to is outside of the folder where you're typing in your code then yes, "../" is generally the way to do so.
Try pointing to images or make an external .css and try referencing to it to test it out.

ASP and External CSS

I'm new to ASP, ASP not ASP.NET. I've programmed before, had experience in PHP. I have many experience with HTML and CSS. I like to organise my files. I know (in php file) I only have to link the external css in the tags to style my webpages. I assume it's the same for ASP. It does, but not for me.
Whenever I tried to edit the style of my asp program and run it in the server it doesn't work. I created other pages as well and same thing happened. Whenever I used Google Chrome to see the elements, I could see my code, but when I click on the style sheet in the 'INSPECT ELEMENT' tool, it opens at the side with nothing there. I did script the css, and tried to make the background color black. The styling works only when I do an internal styling within the asp file between the tags.
Does anyone know how I may solve this issue? I hate using internal css as external ones are faster and more organised.
Check the following common issues:
Make sure your stylesheet file has a file extension of .css
Check if you have a MimeType setup for .css files as text/css in your IIS.
If you're returning CSS code from a .asp page file extension, make sure you first call Response.ContentType = "text/css" at the top of the page.
When including it in your html document make sure you're using something along the lines of the following syntax:
.
<link rel="stylesheet" type="text/css" href="mystylesheet.css">

adding same style sheet to many html files

I have created a very small personal website with three different pages and one CSS file. I know to embed a CSS file into an html page is the following:
<link rel="stylesheet" type="text/css" href="mystyle.css"/>
but form some reason the CSS file only work in one page. Any advice please
Did you checked your folders structure? You may have other html file in different folders.
I suggest to use an absolute path for your stylesheet. something like:
<link rel="stylesheet" type="text/css" href="/css/mystyle.css"/>
first / in href parameter is what I mean.
Edit: You may use a windows machine and upload your files into a Linux machine. Windows do not care about lowercase or uppercase, but it is important on Linux. rename all your filenames to lowercase every where and use it exactly the same in your code (check your link tags again). this may fix your problem
Sharing the link of the site would be helpful. Make sure that the line of CSS aboves goes on each page. For example, if you have 3 pages with 3 different files: index.htm, bio.htm and contact.htm (I'm having to guess since I have not gotten this info from you). Then make sure the link to the CSS above appears on each of those pages.