Не срабатывают стили CSS Что ни так?

@Norik_X · Регистрация: 04.12.2017

Студворк — интернет-сервис помощи студентам

Добрый день уважаемые IT специалисты, как вы думаете почему может не сработать код CSS ??

Проблема вот в чём:

Для сайта нужно, так как контент 18+, сделать автоматически запускаемое модальное окно, которое запускается при входе на сайт и спрашивает есть ли 18+ и т.д.

Так вот я вставил код CSS в файл с расширением рнр.(index.php)
Но не работает вопрос почему???

ВАЖНО! в другом файле не на хостинге который, прекрасно все работает. Специально сделал test_site.html в блокноте написал простенький сайтик для проверки и там все работает замечательно! Но у того расширение html может в этом все дело?

Хотя другие коды стилей срабатывают, странно??

Голову уже сломал ... помогите кто нибудь??

@arava · 25.12.2017, 15:10

Norik_X, откройте исходный код страницы(правая кнопка мыши), найдите свой подключаемый ___.css и проверьте путь к нему

Добавлено через 1 минуту
Если при клике на файл с css не покажет содержимое файла значит путь прописан не верно

@BKmm · 25.12.2017, 15:21

Сообщение от arava

, найдите свой подключаемый ___.css и

Он не подключал файл, а вставил код в файл index.php. Вероятно, между тегами <style></style>

Сообщение от Norik_X

помогите кто нибудь??

Следует показать, как Вы это делали.

@Norik_X · 25.12.2017, 18:17 **[ТС]**

Вот код:

HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
<style>
/*Автоматически всплывающее модальное окно*/
#parent_popup {
  background: #696969;
  height: 100%;
  position: fixed;
  -webkit-opacity: 0.9;
  opacity: 0.9;
  width: 100%;
  z-index: 100;
  top: 0;
  left: 0;
  border-radius: 5px;
  border: 3px solid #4e4e4e;
}
#popup {
  background-color: #fff;
  height: 400px;
  position: fixed;
  padding: 10px;
  top: 100px;
  left: 25%;
  right: 30%;
  color: black;
  width: 500px;
  border-radius: 5px;
  border: 3px solid #4e4e4e;
  -moz-opacity:1;
  opacity: 1;
  -webkit-opacity: 1;
}
/*Конец модального окна*/
 
.link8 { cursor: pointer; text-decoration: none; background-color: green; color: #fff; padding: 5px; border-radius: 5px; width: 170px; height: 20px; }
.link8:hover { cursor: pointer; text-decoration: none; background-color: palegreen; color: #fff; padding: 5px; border-radius: 5px; width: 170px; height: 20px; }
 
.link9 { cursor: pointer; text-decoration: none; background-color: red; color: #fff; padding: 5px; border-radius: 5px; width: 170px; height: 20px; }
.link9:hover { cursor: pointer; text-decoration: none; background-color: #F08080; color: #fff; padding: 5px; border-radius: 5px; width: 170px; height: 20px; }
 
</style>
<!-- END CSS -->
 
<body>
 
<div id="parent_popup">
  <div id="popup">
    <center><h3>Подтвердите что вы <font color="red">старше 18 лет!</font></h3></center>
<center><p>Данный контент предназначен для лиц <font color="red">старше 18 лет</font>, подтвердите что вы являетесь старше 18 лет.</p>
<p>Нажимая на кнопку "Да я старше 18 лет" вы подтверждаете свое согласие с <a href="docs/user_agreement.pdf" target="_blanc">пользовательским соглашением</a> и <a href="docs/privacy_policy.pdf" target="_blanc">политикой конфиденциальности</a> сайта.</p></center><br/>
<center><p class="link8" onclick="document.getElementById('parent_popup').style.display='none';">Да я старше 18 лет</p><br/><p><a href="http://yandex.ru" class="link9">Нет я младше 18 лет</a></p></center>
  </div>
</div>

Не понятно то почему у других блоков на той же странице(в том же файле), всё работает.
У меня ШОК ей богу

)

@Phantom-84 · 25.12.2017, 21:17

style нужно внутри head размещать.

@BKmm · 25.12.2017, 21:24

Сообщение от Norik_X

Вот код:

А почему в Html ? Вроде проблемы были в файле php
Есть вероятность, что такие классы или идентификаторы дальше где-то переопределяются. Этот кусок кода, что Вы показали ясности не прибавил. Если нет желания выкладывать полный код - дайте ссылку на страницу.

@fanatikus · 25.12.2017, 23:41

Сообщение от Phantom-84

style нужно внутри head размещать.

не обязательно

@Norik_X · 26.12.2017, 10:31 **[ТС]**

Ваше мнение интересно, на самом деле, но вот была ещё такая идея подключить отдельный файл, то есть не в самом файле делать style, а к примеру в отдельном файле style.css ну понимаете.
Так вот сделал так и что вы думаете ничего не поменялось.
На самом деле я в первые сталкиваюсь с таким явлением "христа народу", я реально в Шоковом состоянии со вчерашнего дня и буквально сижу и пялюсь как идиот в монитор и ничего делать не могу. Сроки поджимают, а у меня руки просто падают от бессилия и непонимания.

Что это вообще может быть такое????? Вот что интересно.
Ведь если я столкнулся с такой проблемой значит и кто угодно может. Считаю нашей с вами задачи понять хотя бы как такое может вообще быть???

Почему браузер видит отдельное применение стилей к отдельным блокам на той же странице, а другие стили не понимает, это вообще как возможно???

Ведь все это происходит на одной странице.

То есть чтобы вы понимали верстка страницы срабатывает, все блоки на своих местах цвета, размеры, отступы и т.д. ВСЁ РАБОТАЕТ!!!!
НЕ РАБОТАЕТ только вот этот код Модального окна.

У меня ШОК )))

@andyyy · 26.12.2017, 12:40

а не легче ли это делать на javascript))

@Norik_X · 26.12.2017, 12:45 **[ТС]**

Вот не поверишь)
Я пока отделался именно javascript .

Вот код:

JavaScript
1
2
3
4
5
6
7
8
9
<script type="text/javascript">
<!--
if (window.confirm("Данный сайт предназначен для лиц старше 18 лет (18+) Нажмите Да(ОК) если вы подтверждаете что вы старше 18 лет!")) {
}
else {
   document.location.href = 'http://yandex.ru';
}
//-->
</script>

Так то все работает, НО:
1. Это не красиво (не эстетично).
2. При каждой перезагрузке страницы он соответственно будет спрашивать одно и тоже. Хотя эта страница главная и она используется для SEO и там, если пользователь уже зарегился не тусуется, но тем не менее.
3. Я просто не могу понять почему не работет)))

Есл ивы проверяли тот код который я сдесь показал, то наверное подтвердите что красивая форма.

@andyyy · 26.12.2017, 12:49

а не легче ли это делать на javascript))
а ну вот у вас там js есть просто делайте тогда, ща.. я в js не очень

но вроде так в body добавляйте

HTML5
1
<body onload='window()'>

а в скрипте

<script type="text/javascript">

function window {
var win = confirm("Вам есть 18?");
alert(win);

}

</script>

Добавлено через 44 секунды
а вы уже написали)) хотел вам подсказать

Добавлено через 2 минуты

Сообщение от Norik_X

Есл ивы проверяли тот код который я сдесь показал, то наверное подтвердите что красивая форма.

посмотрел - норма. Не знаю- нужно смотреть внутри всего кода

@Norik_X · 26.12.2017, 15:24 **[ТС]**

А можно ограничить количество выводов этого окна js ?

Ну чтобы он не по сто раз спрашивал бы?

@BKmm · 26.12.2017, 15:49

Сообщение от Norik_X

А можно ограничить количество выводов этого окна js ?

Не занимайся ерундой. Если есть возможность делать чисто на стилях - так и делай. Зачем тебе этот ява-скрипт? Лучше ищи косяк. А если сам не можешь найти - дай ссылку на страницу.

Добавлено через 2 минуты
Попробуй заменить имена идентификаторов и классов в своем коде. Например, #popup на #popup2 и так далее. Только не забудь поменять это в стилях, а так же в коде html

@Norik_X · 26.12.2017, 17:25 **[ТС]**

АЛИЛУЯ!!!!!

СЛАВА ВСЕВЫШНЕМУ ВУУДУ!!!!!!

)))))))))))))))))

ПРОБЛЕМА РЕШЕНА!!!

Оказывается все было дело в том что видимо я так думаю я слышком много стилей написал в одном файле и не выносил в отдельный файл style.css

Так что вы думаете

Я все вынес в отдельный файл style.css, А ИМЕННО стили Модального окна оставил в там (в смысле в index.php) И все заработало!!!! Это не вероятно

Я открыл новое свойство Браузеров Ребята вы что не понимаете??
Это Эврика!!
Оказывается нельзя загромождать стилями файл, то есть что то нужно выносить в отдельный файл типа style.cc а что-то можно оставлять там.

ВСЕМ СПАСИБО ДРУЗЬЯ!!!

За то что вы мне помогли напишу вам код обработчик добавления Каптчи от гугла для вашего сайта

PHP
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
<!-- Файл обработчки формы с Каптчей от Google -->
 
 <?php
 if (isset($_POST['submit'])) { /*Здесь если нажата кнопка "Отправить" у некой формы(регистрация. добавления комментария, отзыва и т.п.), то далее идет проверка , в том числе проверка каптчи ниже*/
 
                //Проверка каптчи от Google//
                if (!$_POST['g-recaptcha-response']) {
                exit("<font color='red'>Заполните капчу!</font><meta http-equiv='Refresh' content='9; URL=registration.php'>");
                }
                $url = 'https://www.google.com/recaptcha/api/siteverify';
                $key = 'jgjkdhksjfh5484938766'; //Здесь сек.ключ который нужно взять на сайте , он уникальный для каждого пдключения нововй каптчи(новой формы)//
                $query = $url.'?secret='.$key.'&response='.$_POST['g-recaptcha-response'].'&remoteip='.$_SERVER['REMOTE_ADDR'];
                $data = json_decode(file_get_contents($query)); //Здесь оптравка запроса Google Recaptcha//
                if ($data == false) { 
                exit("<font color='red'>Каптча введена не верно!</font><meta http-equiv='Refresh' content='9; URL=registration.php'>");//Здесь в случае не верного заполнения каптчи выдаст ошибку и вернет через 2 секунды на страницу регистрации(укажите вашу)//
                }
                //Конец проверки каптчи//
 
 
 
        }
 
 
 
        ?>
 
         <!-- Конец формы с Каптчей от Google -->

Мы нужны друг другу

))))

Новые блоги и статьи Все статьи Все блоги /
SDL3 для Web (WebAssembly): Основы отладки веб-приложений на SDL3 по USB и Wi-Fi, запущенных в браузере мобильных устройств 8Observer8 07.02.2026 Содержание блога Браузер Chrome имеет средства для отладки мобильных веб-приложений по USB. В этой пошаговой инструкции ограничимся работой с консолью. Вывод в консоль - это часть процесса. . .	SDL3 для Web (WebAssembly): Обработчик клика мыши в браузере ПК и касания экрана в браузере на мобильном устройстве 8Observer8 02.02.2026 Содержание блога Для начала пошагово создадим рабочий пример для подготовки к экспериментам в браузере ПК и в браузере мобильного устройства. Потом напишем обработчик клика мыши и обработчик. . .	Философия технологии iceja 01.02.2026 На мой взгляд у человека в технических проектах остается роль генерального директора. Все остальное нейронки делают уже лучше человека. Они не могут нести предпринимательские риски, не могут. . .	SDL3 для Web (WebAssembly): Вывод текста со шрифтом TTF с помощью SDL3_ttf 8Observer8 01.02.2026 Содержание блога В этой пошаговой инструкции создадим с нуля веб-приложение, которое выводит текст в окне браузера. Запустим на Android на локальном сервере. Загрузим Release на бесплатный. . .
SDL3 для Web (WebAssembly): Сборка C/C++ проекта из консоли 8Observer8 30.01.2026 Содержание блога Если вы откроете примеры для начинающих на официальном репозитории SDL3 в папке: examples, то вы увидите, что все примеры используют следующие четыре обязательные функции, а. . .	SDL3 для Web (WebAssembly): Установка Emscripten SDK (emsdk) и CMake для сборки C и C++ приложений в Wasm 8Observer8 30.01.2026 Содержание блога Для того чтобы скачать Emscripten SDK (emsdk) необходимо сначало скачать и уставить Git: Install for Windows. Следуйте стандартной процедуре установки Git через установщик. . . .	SDL3 для Android: Подключение Box2D v3, физика и отрисовка коллайдеров 8Observer8 29.01.2026 Содержание блога Box2D - это библиотека для 2D физики для анимаций и игр. С её помощью можно определять были ли коллизии между конкретными объектами. Версия v3 была полностью переписана на Си, в. . .	Инструменты COM: Сохранение данный из VARIANT в файл и загрузка из файла в VARIANT bedvit 28.01.2026 Сохранение базовых типов COM и массивов (одномерных или двухмерных) любой вложенности (деревья) в файл, с возможностью выбора алгоритмов сжатия и шифрования. Часть библиотеки BedvitCOM Использованы. . .

@Norik_X 0 / 0 / 0 Регистрация: 04.12.2017 Сообщений: 23

	Не срабатывают стили CSS Что ни так? 25.12.2017, 15:03. Показов 2123. Ответов 13 Метки нет (Все метки) Добрый день уважаемые IT специалисты, как вы думаете почему может не сработать код CSS ?? Проблема вот в чём: Для сайта нужно, так как контент 18+, сделать автоматически запускаемое модальное окно, которое запускается при входе на сайт и спрашивает есть ли 18+ и т.д. Так вот я вставил код CSS в файл с расширением рнр.(index.php) Но не работает вопрос почему??? ВАЖНО! в другом файле не на хостинге который, прекрасно все работает. Специально сделал test_site.html в блокноте написал простенький сайтик для проверки и там все работает замечательно! Но у того расширение html может в этом все дело? Хотя другие коды стилей срабатывают, странно?? Голову уже сломал ... помогите кто нибудь?? 0

@arava 340 / 135 / 70 Регистрация: 30.06.2014 Сообщений: 717
	25.12.2017, 15:10
	Norik_X, откройте исходный код страницы(правая кнопка мыши), найдите свой подключаемый ___.css и проверьте путь к нему Добавлено через 1 минуту Если при клике на файл с css не покажет содержимое файла значит путь прописан не верно 0

@Phantom-84 377 / 319 / 73 Регистрация: 15.09.2017 Сообщений: 1,436
	25.12.2017, 21:17
	style нужно внутри head размещать. 0

@Norik_X 0 / 0 / 0 Регистрация: 04.12.2017 Сообщений: 23
	26.12.2017, 10:31 [ТС]
	Ваше мнение интересно, на самом деле, но вот была ещё такая идея подключить отдельный файл, то есть не в самом файле делать style, а к примеру в отдельном файле style.css ну понимаете. Так вот сделал так и что вы думаете ничего не поменялось. На самом деле я в первые сталкиваюсь с таким явлением "христа народу", я реально в Шоковом состоянии со вчерашнего дня и буквально сижу и пялюсь как идиот в монитор и ничего делать не могу. Сроки поджимают, а у меня руки просто падают от бессилия и непонимания. Что это вообще может быть такое????? Вот что интересно. Ведь если я столкнулся с такой проблемой значит и кто угодно может. Считаю нашей с вами задачи понять хотя бы как такое может вообще быть??? Почему браузер видит отдельное применение стилей к отдельным блокам на той же странице, а другие стили не понимает, это вообще как возможно??? Ведь все это происходит на одной странице. То есть чтобы вы понимали верстка страницы срабатывает, все блоки на своих местах цвета, размеры, отступы и т.д. ВСЁ РАБОТАЕТ!!!! НЕ РАБОТАЕТ только вот этот код Модального окна. У меня ШОК ))) 0

@andyyy 767 / 323 / 157 Регистрация: 26.05.2016 Сообщений: 2,127
	26.12.2017, 12:40
	а не легче ли это делать на javascript)) 0

@Norik_X 0 / 0 / 0 Регистрация: 04.12.2017 Сообщений: 23
	26.12.2017, 15:24 [ТС]
	А можно ограничить количество выводов этого окна js ? Ну чтобы он не по сто раз спрашивал бы? 0

Не срабатывают стили CSS Что ни так?

Решение