Каков наилучший способ изменить CSS другого веб-сайта на моем веб-сайте? [Дубликат]

К сожалению, я должен согласиться с phari .

Цитата:

1) Вы не можете полностью изменить HTML-страницу страницы , и поэтому не может содержать другой файл CSS. 2) Вы можете изменить файлы CSS, но разработчики могут позже их модифицировать и удалить любые сделанные вами изменения. Следовательно, вы не можете постоянно изменять файлы CSS. 3) Вы не можете / не хотите использовать Javascript и JQuery). Если все это верно, нет решения вашей проблемы.

Комментирует phari 26 марта в 14:29

Позвольте мне сломать это. Я попытаюсь изо всех сил объяснить, почему нет решения (исправьте меня, если я ошибаюсь в любом из этих вариантов);

Вариант 1: Использование jQuery или Javascript. Вы не можете изменить HTML страницы вообще! Вы не хотите использовать jquery или javascript. Это означает, что все ответы на ваш вопрос, упомянутые на этой странице, которые включают jquery или javascript, не учитываются. Это не означает, что ответы, приведенные на этой странице, неверны. В вашем случае это невозможно.

Вариант 2: @import url(css4.css); На вашем веб-сайте есть 3 файла css, которые автоматически включаются как часть веб-сайта, но, к сожалению, у вас нет доступ к ЛЮБОЙ из этих файлов css. Вы не можете поместить этот фрагмент кода в css3.css или в любой из этих файлов. Вы можете изменить файлы CSS, но разработчики могут позже их модифицировать и удалить любые сделанные вами изменения, что означает, что @import url(css4.css); также можно удалить. Также использование @import url(css4.css); было бы совершенно бесполезным. Вам нужно будет поместить @import url(css4.css); в конец css3.css, но это не сработает, потому что правила @import всегда должны быть первыми в документе. Если я не ошибаюсь, Илья (который прокомментировал 23 марта в 9:42) означал, что код может быть размещен в любом месте файла. @import url(css4.css); должен быть наверху. Ссылка ilia, представленная как «доказать», также указывает, что это требование , чтобы поместить его в начале .. Проверьте две ссылки ниже. Подробнее посетите http://webdesign.about.com/cs/css/qt/tipcssatimport.htm или https://developer.mozilla.org/en/docs/Web/CSS / @ импорт # Технические характеристики . Вариант 2 также игнорируется.

Я не думаю, что может быть другой способ сделать то, что вы хотите сделать. Следовательно, решения вашей проблемы нет.

Если я понимаю, что вы правильно задали вопрос, добавив @import url(css4.css) в начало css3.css, импортируйте свою таблицу стилей в css3.css. Но ваши стили переопределяются стилями в css3.css. Это связано с каскадным порядком и Specificity . Чтобы ваши стили css4.css были использованы, ваши селекторы должны иметь более высокую специфичность, чем селектор в css.3.css, который вы пытаетесь переопределить.

Пример: теги <h1> будут окрашены в красный цвет.

body h1 { //this is more specific
   color: blue;
}

h1 { //this is less specific
   color: red;
}

Но поскольку вы @import url(css4.css) строка кода будет удаляться каждый раз, когда разработчики обновят css3.css file это не «пуленепробиваемое решение»

У вас есть возможность добавить любой javascript на сайт? Если это так, вы можете использовать следующее решение

jQuery

$('head').append('<link rel="stylesheet" type="text/css" href="css4.css">');

Javascript

var head = document.head
  , link = document.createElement('link')

link.type = 'text/css'
link.rel = 'stylesheet'
link.href = 'css4.css'

head.appendChild(link)

Источник: https://stackoverflow.com/ а / 11833777/2687861

Вот веселое решение, о котором никто не упомянул.

Факты:

1. Вы вообще не можете изменять HTML-страницу - не проблема!
2. Вы можете изменять файлы CSS, но разработчики могут позже их модифицировать и удалить любые сделанные вами изменения - не беспокоиться.
3. Вы не можете / не хотите использовать Javascript и JQuery - отлично от меня .
4. Вы можете добавить больше файлов на сервер - Отлично!

Давайте сделаем некоторые .htacess взломать удовольствие и прибыль!

Документ root .htaccess file:

Options +FollowSymlinks
RewriteEngine on
RewriteBase /

RewriteRule ^(.*?)css3.css(.*?) $1hackedCSS3.php$2 [L]

Результат: hackedCSS3.php беззвучно подается вместо css3.css для каждого запроса.

REF: http://httpd.apache.org/docs/2.2/howto/htaccess.html

файл hackedCSS3.php:

<?php

// Send the right header information!
header("Content-type: text/css; charset: UTF-8");

// Output the css3.css file
echo file_get_contents("css3.css");
?>

// Add your CSS here with any neat !important or override tricks (read: specificity)
div { ... }

Бонус:

Вы можете расширить это решение, включив все три файла .css в этот файл .php (но только, скажем, css3.css и отправьте css1.css и css2.css в черную дыру с помощью .htaccess ) и использовать умные регулярные выражения для удаления / изменения CSS этого разработчика, не касаясь каких-либо их файлов. Возможности дразнят.

Приложение:

Можете ли вы быть более конкретным, где включать эти файлы?

. Файл .htaccess должен быть в корневом каталоге документа на веб-сайте. Это где www.example.com/index.html будет загружать index.html

Если файл hackedCSS3.php находится в том же каталоге, что и другие css-файлы?

Он может быть в любом каталоге, указанном в файле .htaccess. Корень документа отлично. Измените

RewriteRule ^(.*?)css3.css(.*?) $1hackedCSS3.php$2 [L]

на

RewriteRule ^(.*?)css3.css(.*?) /folders/you/want/hackedCSS3.php$2 [L]

Если наш css-контент (где вы указали // Добавить свой CSS здесь ...) должен быть в тегах стиля html?

№. Относитесь к своему CSS-коду в этом разделе, как если бы он был .css-файлом. Вам не нужны теги <style>.

Используйте @import url('css4.css') на одной из ваших существующих страниц css. Затем используйте спецификацию для выделения вашего нового кода:

Html:

<ul class='ulclass'>
 <li class='liclass'>
  <a class='aclass>The text</a>
 </li>
</ul>

css1.css:

.aclass{
   color : red;
}

css4.css:

ul.ulclass li.liclass a.aclass{
   color: green;
}

Тогда у вас будет green цвет в вашем элементе a

Альтернатива: полагайтесь на каскад вместо специфичности

. Ряд решений здесь рекомендуют использовать @import для включения вашего файла css4.css, а затем модифицировать селектора в нем, чтобы иметь большую специфичность или для использования объявления !important, но есть еще один способ.

Вставить все содержимое css4.css в конце css3.css. Таким образом, вам не нужно полагаться на !important или специфичность, потому что каскадное наследование примет ваши правила в конце файла, если они имеют одинаковую специфичность.

С помощью этого метода вы жертвуете

<div class="mycooldiv">Hello World</div>