why <link type=“text/css” src=“html content”> not working
Question
I want to convert html content to css content using the Tag Link's Attribute type="text", but it does not work!
- Here is my php code:
//url with (http://127.0.0.1/test.php);
//I know it should be: header("Content-type: text/css; charset=utf-8");
header("Content-type: text/html; charset=utf-8");
echo "BODY{background-color:#f00;}"
- html code:
<html>
<head>
<!--
it not works!why?
I've pointed that type="text/css"
why it can't be convert to text/css
-->
<link rel="stylesheet" type="text/css" href="http://127.0.0.1/test.php">
</head>
<body>
anything ...
</body>
</html>
why attrbute type for tag link not works?
But the script Tag works well!
My english is very poor, if you can't understand my words, please leave me a message! Thanks for your answers！
SUMMERY
@Luke Briggs's answer helps me to understand why sometime works or not！
@Dekel's answer helps me to understand @Luke Briggs's answer thks a lot!
2 answers
solution1
3 2016-12-31 23:36:00
You should use Content-type: text/css and not text/html :
header("Content-type: text/css; charset=utf-8");
echo "body {background-color:#f00;}";
The reason for your current code to not work is that the browser is trying to get a resource and parse it, but the server tells the browser that the resource's content is text/html . Because the server tells the browser that the content is HTML - the browser will not try to use that content as CSS.
solution2
1 ACCPTED 2017-01-01 02:39:20
The type attribute of a link tag is "purely advisory" as stated in the HTML5 specification :
User agents must not consider the type attribute authoritative — upon fetching the resource, user agents must not use the type attribute to determine its actual type.
Link tags describe a variety of things and not just CSS - a user agent uses that type attribute to know immediately if it supports the file or not:
The type attribute is used as a hint to user agents so that they can avoid fetching resources they do not support.
In short, it's only there as a hint. The header coming from the server is the 'de-facto' type when used within a link tag.
A real world example
In the source of a Twitter page you'll see this:
<link rel="search" type="application/opensearchdescription+xml" href="/opensearch.xml" title="Twitter">
My ordinary web browser doesn't know what application/opensearchdescription+xml is, so it avoids loading that xml file entirely (and as a side note, if it did load the XML file, it wouldn't know what to do with it anyway).
What about a script element? Why does it work with them?
script elements define their type attribute very differently in the HTML5 specification:
The value of the {src} attribute must be a valid non-empty URL potentially surrounded by spaces identifying a script resource of the type given by the type attribute
This time the type attribute is not simply a hint - it defines the actual type to use.
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.