Im trying to style a page but in the chrome dev tools there is an scss file that i dont have anywhere local.
When I hover the style below, I get this link :
https://cdn.jsdelivr.net/npm/bootstrap#5.2.0-beta1/scss/_reboot.scss
Im trying to get it to connect to the css file but the normal
<link href="css/style.css" rel="stylesheet">
doesn't work.
Thank for your help
Let me try to help you.
From the docs that i read, to link the external resource element to our html was similar with your code.
<link href="/media/examples/link-element-example.css" rel="stylesheet">
But, i think we have to make sure that your href was correct to the css file that you need.
It was really important. Because if we didn't input the correct relative path, the css file will never be can use in the project.
Thank you
Related
This might look a bit stupid, but I cannot seem to connect my HTML to my external CSS stylesheet.
It doesn't change the color of my text. I have tried different CSS commands but nothing seems to work. Help would be greatly appreciated haha...
Your css file names is style.css not "styles.css" the mistake is in your href link
You wrote the wrong file name on your href by mistake. Just change it to style.css like this :
<link rel="stylesheet" href="style.css">
Alright so this is my first post, and I'm sorry to bother with such a stupid question but I was wondering how would I go about writing a file path to a folder with my css in to and connect it to my HTML folder.
Would it be like ./FOLDER-Name/Style.css
because I have tried that but it hasn't worked. Someone please help, Thank You.
It will be like this
<link href="FOLDER-Name/style.css" rel="stylesheet">
example taken from the docs :
<link href="/media/examples/link-element-example.css" rel="stylesheet">
You just have to replace the href string to whatever path leads to your css file. I recommend using a relative path.
I just need some clarification about linking a css file. I am looking at a html widget that has been created by someone and they seem to have a html with a query string to get the required css..
<link href="https://cdnres.willyweather.com.au/widget/cssView.1-12-8.html?id=36723" rel="stylesheet">
And this works if you click on this link
http://cdnres.willyweather.com.au/widget/loadView.html?id=36723
But when i downloaded these files onto my own web server and tried it, it didn't work
http://www.mccdepot.com.au/Test1/loadView.html
but when I update the link styles to a css and updated the file name it worked.
http://www.mccdepot.com.au/Test2/loadView.html
For the query string html do I need to enable something on the server side?
Thanks in advance
i copied that link css add it to your code its coming same as given link i have added the screen shot check it.
try this->
<link rel="stylesheet" type="text/css" href="path of the css file"/>
This is how normally we include a css file in our html page. If still getting error, please check the file path properly.
your linked css file is minified, check it once. When you minify some
css files actually it replaces some variables. Try again to download
again and link it. And js files also not included properly, when it
check it in viewsource file was not found there
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.
I'm pretty much new to all of this and for the past days I've been working on my first Website using bootstrap. Locally, this works fine, but right now, when trying to get it up online, it looks like this:
http://wearemanjaro.de
Just ugly html, no css nor any images are loading.
I made the link above link to the html which is in the /manjarowebsitebootrap/robots/index.html path. The CSS (bootstrap and custom) is in the following directory: /manjarowebsitebootstrap/css/...
The link to CSS in my html looks like the following:
<link rel="stylesheet" type="text/css" href="../css/custom.css">
<link rel="stylesheet" type="text/css" href="../css/bootstrap.min.css">
Same problem with the images in my ../img folder. It all works fine locally. I'd really love some help or advice :)
First thing you need to do is use an absolute instead of a relative path.
if your directory structure is:
-root
--docs
---doc1.php
--includes
---header.php
---footer.php
---css.css
--index.php
In your header, you link to my CSS file like so:
<link href="includes/styling.css" type="text/css" rel="stylesheet" />
you need to do like this :
<link rel="stylesheet" type="text/css" href="/root/includes/css.css" />
You also need to use developer tools on chrome that will help you to debug these things.
I saw there that the images are not uploaded so once you able to upload them you will start getting them on the Website if the path is correct.
and best of luck for the new world of web development.:)
Your file structure has changed from local to online/live. I inspected your page, placed in the CDN for Bootstrap and pow, the styling came alive.
Use the following CDN to replace your current src='' path for bootstarp in your html head to see what I mean.
https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css
The next steps you should take: make note of where all your files are living on your server, you must place all associated files on the server, as specified by your code, i.e shows that you have a CSS folder.
Also is this HTML file located at the same level as the CSS folder or does this HTML file live in a folder of its own. If not your paths do not need to include the ../ portion and you should use just css/yourFileName.css