www.webdeveloper.com
Page 1 of 2 12 LastLast
Results 1 to 15 of 16

Thread: Point html files to other files that contain css?

  1. #1
    Join Date
    Feb 2012
    Posts
    29

    Point html files to other files that contain css?

    I have tons of html files, every html file has CSS code at the top telling the html page what to look like. EVERY html file has the same CSS code. If I change the CSS code in one, I have to go through ALL of my html files and change it in them to.

    How can I point my html files to a single CSS file so that when I change that file it changes the look of ALL of my html files at once?
    Last edited by grimshad; 02-03-2012 at 07:58 PM.

  2. #2
    Join Date
    Aug 2010
    Location
    San Diego
    Posts
    242
    Put the CSS code in a file and link to the the file in the head of your page like so:

    HTML Code:
    <head>
        <link rel="stylesheet" href="styles.css">
    </head>
    As you can imagine linked style sheets are preferable to writing out the CSS code in the head of the page because it's much easier to manage and faster to download.

  3. #3
    Join Date
    Feb 2012
    Posts
    29
    after doing a vast amount of research I found out about this right before your post.

    Question: Do I need to put type="text/css" in that link code?

  4. #4
    Join Date
    Feb 2012
    Location
    Bokaro Steel City (Jharkhand), India!
    Posts
    194

    Smile

    Yes, you can LINK your documents to an external style sheet!
    e.g.
    <link rel="stylesheet" href="styles.css" type="text/css" />

    But there are pros and cons...

    Pros:
    *Can set and update styles for many documents at once.
    *Style information is cached by the browser, so there is no need to repeat.

    Cons:
    *Requires extra download round trip for the style sheet, which might delay page rendering, particularly when multiple files are in use.
    *In some cases when @import is used, the browser may cause a rendering "flash" under slow loading conditions.

    But as I feel, in your condition there should only be pros!!! :-)

  5. #5
    Join Date
    Aug 2010
    Location
    San Diego
    Posts
    242
    Quote Originally Posted by grimshad View Post
    after doing a vast amount of research I found out about this right before your post.

    Question: Do I need to put type="text/css" in that link code?
    No, "text/css" only goes in the <style> tag used specify styles in the head of the HTML page.

  6. #6
    Join Date
    Feb 2012
    Location
    Bokaro Steel City (Jharkhand), India!
    Posts
    194

    Exclamation

    Quote Originally Posted by handcraftedweb View Post
    No, "text/css" only goes in the <style> tag used specify styles in the head of the HTML page.
    There is nothing like this!
    You can specify type="text/css" in the <link> tag!
    It is NOT MANDATORY but you should...

  7. #7
    Join Date
    Feb 2012
    Posts
    29
    Quote Originally Posted by TheAliveWinner View Post
    There is nothing like this!
    You can specify type="text/css" in the <link> tag!
    It is NOT MANDATORY but you should...
    That's also what I was reading elsewhere.

  8. #8
    Join Date
    Mar 2011
    Posts
    1,145
    Using an external stylesheet is best practice for website design. The delay in rendering a page caused by using an external stylesheet is trivial in comparison to all of the other external components on a page. And if you're using the same stylesheet throughout your site, browser caching will mean users will generally only have to download it once per visit.
    So don't give it a second thought. Good luck!
    Rick Trethewey
    Rainbo Design

  9. #9
    Join Date
    Aug 2010
    Location
    San Diego
    Posts
    242
    Quote Originally Posted by TheAliveWinner View Post
    There is nothing like this!
    You can specify type="text/css" in the <link> tag!
    It is NOT MANDATORY but you should...
    Ah, thanks for the correction.

  10. #10
    Join Date
    Feb 2012
    Posts
    29
    I know this is a long shot, but I have another problem with the same setup. I now have all the html files pulling style information from a master CSS file. However, If I make a physical change to the html file I have to go change the html in every html file so they are all the same.

    I have multiple html files that are essentially tables of information. The information for each html file is different, but all the tables are the same. If I add a new table to hold additional information, I have to add that new table to each html file individually. Is there a way to use a single html file for my table layout and populate their information separately?

  11. #11
    Join Date
    Feb 2012
    Location
    Bokaro Steel City (Jharkhand), India!
    Posts
    194

    Question

    Yes, in the web developing world there is a solution to each and every type of problem!!!
    Your problem can be solved using PHP!
    I am sure that it can be solved but I am not sure how to do it... as I have just started to learn this language!
    But then also I guess you can solve the problem using the SSI (Server Side Includes).
    They help you to insert the content of one PHP file into another file before the server executes it, with the help of "include()" and "require()" functions.

    There is also a possibility that I may go wrong... so I am waiting for somebody to throw light on this problem's solution!

  12. #12
    Join Date
    Aug 2010
    Location
    San Diego
    Posts
    242
    Quote Originally Posted by grimshad View Post
    I know this is a long shot, but I have another problem with the same setup. I now have all the html files pulling style information from a master CSS file. However, If I make a physical change to the html file I have to go change the html in every html file so they are all the same.

    I have multiple html files that are essentially tables of information. The information for each html file is different, but all the tables are the same. If I add a new table to hold additional information, I have to add that new table to each html file individually. Is there a way to use a single html file for my table layout and populate their information separately?
    No. Server side programming (in PHP, Ruby, Python, etc.) is usually the way to handle that. It could be done in the browser with JavaScript, but that's not typical. HTML by itself has no way of reusing boilerplate structures other than by simple code copying, in which case problems like what you're now facing are inevitable.

  13. #13
    Join Date
    Feb 2012
    Posts
    29
    Any chance I could get a link to a page that can teach me how to use php to do what i'm asking?

  14. #14
    Join Date
    Aug 2010
    Location
    San Diego
    Posts
    242
    Quote Originally Posted by grimshad View Post
    Any chance I could get a link to a page that can teach me how to use php to do what i'm asking?
    I can give some you tips.

    First make sure PHP is available on your server (it probably is, PHP is maybe the most popular server side language). Then get an overview of the language, maybe here.

    This is not going to be an easy task, could take weeks or months.

    There are 2 main parts here, 1 is to get the data in the form of a 2 dimensional array, the other part is a function that takes that data and outputs an HTML table:

    PHP Code:
    function outputTable $a2DArray ) {
      echo 
    '<table class="my-table">'"\n";
    // output table rows
      
    echo "</table>\n";

    The above function is the part that only needs to be done once. I don't know about the code that assembles the data in a 2D array. Depending on what form the data comes in it might need to be written for each batch or it might be able to be a group of functions that gets reused.

    The important thing is to keep the 2 pieces, the data assembling and the table outputting, separate and not intermingled. You could work on the data assembling and get someone else to work on data outputting.

    One other thing, when you're searching about tables understand there are HTML tables (which you're concerned about here) and there are database tables, which are something different.

  15. #15
    Join Date
    Feb 2012
    Posts
    29
    Im an advanced programmer and i would say high end beginner in web development. I understand the basics of html php css and javascript.

    Its just hard for me to do things in php from scratch at this point.

    My idea is to have a form that uses php to send the data to the database with an id

    Then i enter the code into the page including the id of the data set i want to load. It runs another php file which draws the table with the content in the database from the id i specified. That way to make a change to all pages, i can simply edit the php file that pulls the data from the database and draws the tables.

    Essentially it will do exactly what phpbb does. The topic page is a static template html which is loaded visually. It uses php to pull data from the database and fill the topic info. It knows which topic info to get via topic id

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles