Unique CSS for each page?

Y

YVW2016-06-08 04:46:44

css

YVW, 2016-06-08 04:46:44

Such a situation:
there is a main page index.html, on which links to link1.html, link2.html, link3.html are located.
Each page has a container that changes via ajax depending on the open page.
The problem is that each page needs to be customized: change the colors of the background, header and footer, and the head, body, header, footer code is located only on index.html.

Question - how to register unique css for each page?
I know that the method to write on each link1.html, link2.html, link3.html
code is considered incorrect and dirty, although it works successfully. I am not very strong in code, so I ask for your help. Just in case, I bring the script itself<style>...</style>

<script>
        function get_content(adress) {
            $.ajax({
                url: adress,
                success: function(data) {
                    $('#page_content').html(data);
                },
                error: function() {
                    alert("Ошибка! Страница недоступна");
                }
            });
        }

    </script>

Reply

Answer the question

In order to leave comments, you need to log in

4 answer(s)

R

Rithmsamba, 2015-10-06
@vlad_revuk

transform: rotate(45deg);
And the parent - overflow: hidden

A

Alexander Bulgakov, 2016-06-08
@alebul

there should be only one css file, write your class for each page, for example, in the body and customize it through a short cascade.

P

Pavel Kokovin, 2016-06-08
@Per_Ardua

If there is access to the server side, then substitute the variable in the link:

<?php
    $split_uri = split("/", $_SERVER["REQUEST_URI"]);
    $page_name = $split_uri[count($split_uri) - 1];
    // Модифицируешь имя как нужно и...
    $css_name = $page_name;
?>

<!Doctype html>
<html>
    <head>
        <link href="/css/<?=$css_name?>" rel="stylesheet"/>
    </head>

    <body>
    </body>
</html>

M

Maxim Timofeev, 2016-06-08
@webinar

I know that the method to write on each link1.html, link2.html, link3.html
code is considered incorrect and dirty, although it works successfully.

Who told you this? This is not correct in terms of code minimization. But in your case it is justified. Take out the general one in 1 css file. And you override a number of parameters in style inside the page.
You can also set a class for the body, write 1 css and change the class of the body in js.