WelcomeUser Guide
ToSPrivacyCanary
DonateBugsLicense

©2025 Poal.co

937

It does obviously not bother me, but I am just wondering whether there is a technical reason for having the CSS contents inline in the HTML source code, instead of a dedicated .CSS file, referenced to using <link rel="stylesheet" href="custom.css" />.


About the priority: I know that whichever comes last out of two identical CSS references (whether in the same style sheet or multiple style sheets of the same page), has the higher priority.

Whether a style sheet CSS is embedded in the HTML source code (<style> … </style>) or outsourced to a separate file (<link rel="stylesheet" href="stylesheet_filename.css" />) makes no difference in terms of priority, as long as the tags are at the same position.

But is there a technical reason for having the custom style sheet inside the HTML source code instead of a separate file?

It does obviously not bother me, but I am just wondering whether there is a technical reason for having the CSS contents inline in the HTML source code, instead of a dedicated .CSS file, referenced to using `<link rel="stylesheet" href="custom.css" />`. ---- About the priority: I know that **whichever comes last** out of two identical CSS references (whether in the same style sheet or multiple style sheets of the same page), has the higher priority. Whether a style sheet CSS is embedded in the HTML source code (`<style> … </style>`) or outsourced to a separate file (`<link rel="stylesheet" href="stylesheet_filename.css" />`) makes no difference in terms of priority, as long as the tags are at the same position. But is there a **technical** reason for having the custom style sheet inside the HTML source code instead of a separate file?

(post is archived)

[–] 1 pt

Of course, it does not work.

But I wonder why that filtered CSS is embedded inside the HTML instead of a separate CSS file.

Not that it bothers me, but I would like to know a technical explanation.

[–] 1 pt

I'm not saying angular is used here, but I believe what's going on under the hood is handled in a similar fashion

https://www.w3schools.com/angular/ng_ng-style.asp

<body ng-app="myApp" ng-controller="myCtrl">

<h1 ng-style="myObj">Welcome</h1>

<script> var app = angular.module("myApp", []); app.controller("myCtrl", function($scope) { $scope.myObj = { "color" : "white", "background-color" : "coral", "font-size" : "60px", "padding" : "50px" } }); </script> </body>

As you can see here, all css is handled with js, there' s no separate css file