Is your cloud always on? With an Always On cloud you won't have to worry about downtime for maintenance or software application code updates, ensuring that your bottom line isn't affected.
Solved
Css codes are visible in source codes of page,why?
Posted on 2016-08-06
Hello;
I use DW 2015 cc for creating webpage and above php file added the link of css file as:
My css file also start with:
But when i see the source codes of php page i see that all css codes are included in the source codes,please let me know where is the problem?
Thanks
I use DW 2015 cc for creating webpage and above php file added the link of css file as:
<link href="css/home-stylesheet.css" rel="stylesheet"/>
My css file also start with:
@charset "utf-8";
/* CSS Document */
body {
margin-left: 0px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
display: block;
}
But when i see the source codes of php page i see that all css codes are included in the source codes,please let me know where is the problem?
Thanks
[X]
Welcome to Experts Exchange
Add your voice to the tech community where 5M+ people just like you are talking about what matters.
- Help others & share knowledge
- Earn cash & points
- Learn & ask questions
-
7
4
- +1
13 Comments
Active today
Why would that be a problem? PHP produces HTML pages when it sends the data to the browser. Unless you're not being clear...
CSS can be placed in external files that are loaded by the browser, or internal files inside the HTML document, enclosed in <style> tags. Either way works fine, and respects the "cascade" of styles. It can also be placed "inline" with the affected HTML tags, but I do not recommend that since it leads to maintenance headaches.
http://www.w3schools.com/css/css_howto.asp
When I'm developing a style sheet, I like to put the styling into internal files inside the HTML document. It helps avoid browser caching which is to be avoided during development.
Here's an example from another question where we use PHP to prepare HTML elements, including internal style sheets.
http://www.w3schools.com/css/css_howto.asp
When I'm developing a style sheet, I like to put the styling into internal files inside the HTML document. It helps avoid browser caching which is to be avoided during development.
Here's an example from another question where we use PHP to prepare HTML elements, including internal style sheets.
<?php // demo/temp_edavo.php
/**
* https://www.experts-exchange.com/questions/28961750/Javascript-change-Body-Background.html
*/
error_reporting(E_ALL);
// USE PHP TO CREATE VARIABLES FOR OUR HTML
$dat = date('r');
$xyz = "This page was rendered at $dat";
// USE PHP TO CREATE THE CSS CLASS NAMES
$r_class = "r";
$b_class = "b";
// USE PHP TO CREATE THE CSS IMAGE LINKS
$r_image = "red_square.png";
$b_image = "blu_square.png";
// CREATE OUR WEB PAGE IN HTML5 FORMAT
$htm = <<<HTML5
<!DOCTYPE html>
<html dir="ltr" lang="en-US">
<head>
<meta charset="utf-8" />
<meta name="robots" content="noindex, nofollow" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<style type="text/css">
.$r_class {
background-image:url("images/$r_image");
}
.$b_class {
background-image:url("images/$b_image");
}
</style>
<script src="https://code.jquery.com/jquery-latest.min.js"></script>
<script>
$(document).ready(function(){
$("#make_red").click(function(){
$("body").removeClass("$b_class");
$("body").addClass("$r_class");
});
$("#make_blu").click(function(){
$("body").removeClass("$r_class");
$("body").addClass("$b_class");
});
});
</script>
<title>HTML5 Page With jQuery in UTF-8 Encoding</title>
</head>
<body>
<noscript>Your browsing experience will be much better with JavaScript enabled!</noscript>
<p>$xyz</p>
<input id="make_red" value="Make Body Red" />
<input id="make_blu" value="Make Body Blue" />
</body>
</html>
HTML5;
// RENDER THE WEB PAGE
echo $htm;
Active 3 days ago
<link> is HTML, not PHP. It's not executed by PHP nor by a PHP editor. So what do you talk about? View source of a browser? Even a browser will only load and apply the css, but not show it in source view.
Bye, Olaf.
Bye, Olaf.
Thanks for comment,this is not the first time that i design web page, when i have upgraded to DW2015 and create my first page in this version, today i checked and saw it.
@Olaf Doschke,yes i see the codes of css file inside the source codes in browser.
yes
I don't know that staring the css file is ok?
The css file has created by Dw 2015.
@Olaf Doschke,yes i see the codes of css file inside the source codes in browser.
View source of a browser?
yes
I don't know that staring the css file is ok?
The css file has created by Dw 2015.
Before,that i had the old version of DW when i test a page on localhost and saw the source codes in browser,it was ok and the css codes was invisible,but it seams that by this new version when test on localhost then it include the css codes,i thought that i test it on remote server and it is ok on it,the codes of external css file is not invisible in browser source codes.
Active 3 days ago
You don't break any license when the HTML and CSS is accessible. That's how browsers work, you can't prevent it anyway, even with certain right click disablers, the DOM is loaded and can be looked at with many tools like proxies, fiddler, inspecting browser cache and many more. That's not worth the protection.
It would still be very unusual you see the core CSS within the HTML view source, you would rather only see the link tag with the HREF, but you can click the HREF url and get to the CSS. If you would hide it, restrict access to it, the browser wouldn't be able to apply it.
Bye, Olaf.
It would still be very unusual you see the core CSS within the HTML view source, you would rather only see the link tag with the HREF, but you can click the HREF url and get to the CSS. If you would hide it, restrict access to it, the browser wouldn't be able to apply it.
Bye, Olaf.
Yes, you are right,normally when we use external css file we must not see(it is invisible in browser source codes,but it is clear that load that css file and act) the css codes in browser source codes,for this reason i sent this question on E-E,i didn't had this experiences before that on localhost can see the css codes in browser source codes.
Thanks
Thanks
Active 3 days ago
Localhost does not differ from a "real" or remote host in that aspect, you just have a different base URL but HREF addresses are specified relative to the base URI anyway, so I still don't get what difference you see and have where and why.
There is a big difference when working without any web server and use file:// links, but even then relative URLs are possible and commonly used, if your pages only are HTML, CSS, JS and image files, you have a static page and need no web server. The web server comes into play as soon as you want to use something dynamic, server side includes would be the simplest, PHP or any other scripting language and from there, any database or web service addressed from the basis of PHP will need a web server.
There is just a slight difference between localhost and domain.com. Indeed in regard to database access you typically do use root user on localhost both at your own development localhost PC and the scripts addressing URLs on the domain also work with localhost, as localhost on domain.com is domain.com, localhost simply is another term for "this", "here", "me", "myself".
Bye, Olaf.
There is a big difference when working without any web server and use file:// links, but even then relative URLs are possible and commonly used, if your pages only are HTML, CSS, JS and image files, you have a static page and need no web server. The web server comes into play as soon as you want to use something dynamic, server side includes would be the simplest, PHP or any other scripting language and from there, any database or web service addressed from the basis of PHP will need a web server.
There is just a slight difference between localhost and domain.com. Indeed in regard to database access you typically do use root user on localhost both at your own development localhost PC and the scripts addressing URLs on the domain also work with localhost, as localhost on domain.com is domain.com, localhost simply is another term for "this", "here", "me", "myself".
Bye, Olaf.
Yes, i tested again on localhost with this url below and it is ok,there is no css codes in resource:
http://localhost/ppresponsive/indextest.php
But when i want to see the page in browser i push F12 and then the page come in bowser with this addrss:
http://localhost/ppresponsive/TMP1qismfu.php
With this url i saw and see that css codes are in resource codes,with this test i surprised that saw the css codes,so i thought that it is abnormal,but still i cannot understand that why these 2 url are different in browser source codes.
Thanks
http://localhost/ppresponsive/indextest.php
But when i want to see the page in browser i push F12 and then the page come in bowser with this addrss:
http://localhost/ppresponsive/TMP1qismfu.php
With this url i saw and see that css codes are in resource codes,with this test i surprised that saw the css codes,so i thought that it is abnormal,but still i cannot understand that why these 2 url are different in browser source codes.
Thanks
Active 3 days ago
That's most probably Dreamweaver saving your current edit as a temp file and execute it via its internal web server. Visual Studio does similar things when you debug a web project. But his has nothing to do with the final publishing of all this.
I don#t use Dreamweaver, so this is just a wild guess, it may also be your browser, but double checking chrome and firefox don't create a new file when you view source or press F12, which does start developer tools in browsers. Also browser couldn't merge files the way you see it. So most likely dreamweaver does something more than just saving indextest.php as is as Tmp1qismfu.php, it merges things, which a browser would only do later at runtime, more precise which a browser will handle differently at runtime.
That's some of the behaviour I dislike about complex IDEs. There are pros and cons. If you instead start up a browser and manually start from http://localhost, then this will not cause a new php file being created and requested, you get 1:1 the request of and response from indextest.php
Bye, Olaf.
I don#t use Dreamweaver, so this is just a wild guess, it may also be your browser, but double checking chrome and firefox don't create a new file when you view source or press F12, which does start developer tools in browsers. Also browser couldn't merge files the way you see it. So most likely dreamweaver does something more than just saving indextest.php as is as Tmp1qismfu.php, it merges things, which a browser would only do later at runtime, more precise which a browser will handle differently at runtime.
That's some of the behaviour I dislike about complex IDEs. There are pros and cons. If you instead start up a browser and manually start from http://localhost, then this will not cause a new php file being created and requested, you get 1:1 the request of and response from indextest.php
Bye, Olaf.
Featured Post
We value your feedback.
Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!
Question has a verified solution.
If you are experiencing a similar issue, please ask a related question
Introduction
This article is intended for those who are new to PHP error handling (https://www.experts-exchange.com/articles/11769/And-by-the-way-I-am-New-to-PHP.html). It addresses one of the most common problems that plague beginning PHP develop…
There are times when I have encountered the need to decompress a response from a PHP request.
This is how it's done, but you must have control of the request and you can set the Accept-Encoding header.
In this tutorial viewers will learn how to style a decorative dropcap for the first letter in a paragraph using CSS.
In CSS, create a new paragraph class by typing "p.fancy": Then, to style only the first letter of the first sentence, include the ps…
In this tutorial viewers will learn how to embed custom externally-hosted Google Fonts using the Google Font API in CSS
Go to the Google Fonts website at google.com/fonts: Browse or search based on font properties or name to find a suitable font for…
Suggested Courses
Course of the Month9 days, left to enroll
604 members asked questions and received personalized solutions in the past 7 days.
Join the community of 500,000 technology professionals and ask your questions.