Regroup all CSS link in one line

Question

In my HYML page I have the following CSS Link

myPage.html

<link href="https://fonts.googleapis.com/css?family=Roboto:300,300i,400,400i,500,500i,700,700i"
rel="stylesheet">
<link href="https://fonts.googleapis.com/icon?family=Material+Icons"
rel="stylesheet">
<link
href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css"
rel="stylesheet"
integrity="sha384-WskhaSGFgHYWDcbwN70/dfYBj47jz9qbsMId/iRN3ewGhXQFZCSftd1LZCfmhktB"
crossorigin="anonymous">
<link rel="stylesheet"
href="https://use.fontawesome.com/releases/v5.0.10/css/all.css"
integrity="sha384-+d0P83n9kaQMCwj8F4RJB66tzIwOKmrdb46+porD/OvrJ+37WqIM7UoBtwHO6Nlg"
crossorigin="anonymous">
<link rel="stylesheet"
href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
<link href="https://fonts.googleapis.com/css?family=Roboto"
rel="stylesheet">

Is there a way to regroup this link in one and call it instead of using all this code line?

[@import](https://developer.mozilla.org/en-US/docs/Web/CSS/@import). Use with caution https://stackoverflow.com/questions/10036977/best-way-to-include-css-why-use-import — Turnip, Sep 18 '18 at 12:50
https://www.os-templates.com/journal/cascading-style-sheets/using-at-import-to-call-your-css-files — Sparky, Sep 18 '18 at 12:52

score 1 · Accepted Answer · edited Sep 18 '18 at 13:24

1

For marking it as answer.

Look at this page and you'll find anything you need.

Content summary of the link attached

<style type="text/css">
    @import url("main.css");
</style>

Where main.css contains:

@import "file1.css";
@import "file2.css";
@import "file3.css";
@import "file4.css";
@import "file5.css";

these are the name of the files.

edited Sep 18 '18 at 13:24

Arshdeep Singh

316
4
15

answered Sep 18 '18 at 12:54

Sparky

287
1
11

1

I am testing it and if worked (i don't no why not) i will make it as an answer thank you – Yagami Light Sep 18 '18 at 12:56
1

After testing it's worked for me +1 (why not upvote the question ;) – Yagami Light Sep 18 '18 at 13:20

score 0 · Answer 2 · answered Sep 18 '18 at 12:56

0

You can use the @import statement in your main css file. Not sure if this will work with FontAwesome though.

You also import the font family 'Roboto' multiple times and FontAwesome as well. Is that intended?

answered Sep 18 '18 at 12:56

Andifined

479
6
19

it was in test purpose – Yagami Light Sep 18 '18 at 12:58

Regroup all CSS link in one line

2 Answers2