Не могу разобраться с opacity

@tsmetall55 · Регистрация: 18.03.2014

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

Добрый день. У меня следующая проблема. Решил сделать сайт с полупрозрачным фоном, использовал для этого атрибут opacity. И все было хорошо пока я не понял что у меня стали прозрачными не только фон но и все картинки. Что я делаю не так.

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
<body>
 
<div  class=" opacity 0.7" id="wrapper">
<a name="top"></a>
<!-- header -->
<div id="header">
<div id="pagedescription"><h1>Столярная мастерская</h1><br /><h2> Пришла нужда постучать по дереву -  обнаруживаешь, что мир состоит из алюминия и пластика! </h2></div>
    <div id="branding"><img src="https://www.cyberforum.ru/images/logo.png" alt="" title=""></div>
</div>
 
<!-- top menu -->
<div id="menu">
    <ul>
        <li><a href="index.html" title="Menu Item">О нас</a></li>
        <li ><a href="port.html" title="Menu Item">Портфолио</a></li>
        <li><a href="client.html" title="Menu Item">Клиенты</a></li>
        <li><a href="partner.html" title="Menu Item">Партнеры</a></li>
        <li><a href="contact.html" title="Menu Item">Контакты</a></li>
    </ul>
</div>
 
<!-- bodywrap -->
<div id="bodytop">&nbsp;</div>
<div id="bodywrap">
    
    <div id="contentbody">
 
 
<a name="content"></a>
    
<h1>Заборы</h1>
 
<p> Выполняем изготовление заборов в соответствии с вашими пожеланиями. Возможно иготовление как из сырой древесины, так и из пром.сушки.</p>
 
    <img src="https://www.cyberforum.ru/images/zabor/1.jpg" class=" opacity 1">
 
    </div>
    
</div> 
 
<div id="bodybottom">&nbsp;</div>
<div id="footer">
<p>Copyright 2014 Столярная мастерская
 
</p>
</div> 
<div id="sidemenu"><div id="smtop">&nbsp;</div>

@Micheal · 06.05.2014, 10:01

представленный код не работает, стилей нет...

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

есть возможность это обойти с помощью псевдородителя

@dimadyak · 06.05.2014, 10:25

как вариант задать цвет фону в rgba формате

@Micheal · 06.05.2014, 10:32

HTML5
1
2
3
4
5
6
7
8
9
10
11
12
<!DOCTYPE html>
<html>
<head>
    <title>Test</title>   
</head>
<body>
    <div class="parent">
            <div class="pseudo_parent"></div>
            <div class="child"></div>
        </div>
</body>
</html>

CSS
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
.parent
{
    width:100%;
    height:1000px;
    position:relative;
}
 
.pseudo_parent
{
    background-color:#000090;
    width:100%;
    height:100%;
    opacity:0.5;
    position:absolute;
    top:0;
    left:0;
}
 
.child
{
    position:relative;    
    height:50%;
    width:60%;    
    background-color:red;    
}

@falosun · 06.05.2014, 10:51

Пиши background-color: rbga{0,0,0,.5); ну или какой у тебя цвет, проверь через фотошоп, или что-нибудь другое. Естественно opacity вообще убери строчку.

Новые блоги и статьи Все статьи Все блоги /
Реалии Hrethgir 01.03.2026 Нет, я не закончил до сих пор симулятор. Эта задача сложнее. Не получилось уйти в плавсостав, но оно и к лучшему, возможно. Точнее получалось - но сварщиком в палубную команду, а это значит, в моём. . .	Ритм жизни kumehtar 27.02.2026 Иногда приходится жить в ритме, где дел становится всё больше, а вовлечения в происходящее — всё меньше. Плотный график не даёт вниманию закрепиться ни на одном событии. Утро начинается с быстрых,. . .	SDL3 для Web (WebAssembly): Сборка библиотек: SDL3, Box2D, FreeType, SDL3_ttf, SDL3_mixer и SDL3_image из исходников с помощью CMake и Emscripten 8Observer8 27.02.2026 Недавно вышла версия 3. 4. 2 библиотеки SDL3. На странице официальной релиза доступны исходники, готовые DLL (для x86, x64, arm64), а также библиотеки для разработки под Android, MinGW и Visual Studio. . . .	SDL3 для Web (WebAssembly): Реализация движения на Box2D v3 - трение и коллизии с повёрнутыми стенами 8Observer8 20.02.2026 Содержание блога Box2D позволяет легко создать главного героя, который не проходит сквозь стены и перемещается с заданным трением о препятствия, которые можно располагать под углом, как верхнее. . .
Конвертировать закладки radiotray-ng в m3u-плейлист damix 19.02.2026 Это можно сделать скриптом для PowerShell. Использование . \СonvertRadiotrayToM3U. ps1 <path_to_bookmarks. json> Рядом с файлом bookmarks. json появится файл bookmarks. m3u с результатом. # Check if. . .	Семь CDC на одном интерфейсе: 5 U[S]ARTов, 1 CAN и 1 SSI Eddy_Em 18.02.2026 Постепенно допиливаю свою "многоинтерфейсную плату". Выглядит вот так: https:/ / www. cyberforum. ru/ blog_attachment. php?attachmentid=11617&stc=1&d=1771445347 Основана на STM32F303RBT6. На борту пять. . .	Камера Toupcam IUA500KMA Eddy_Em 12.02.2026 Т. к. у всяких "хикроботов" слишком уж мелкий пиксель, для подсмотра в ESPriF они вообще плохо годятся: уже 14 величину можно рассмотреть еле-еле лишь на экспозициях под 3 секунды (а то и больше),. . .	И ясному Солнцу zbw 12.02.2026 И ясному Солнцу, и светлой Луне. В мире покоя нет и люди не могут жить в тишине. А жить им немного лет.

@Micheal 53 / 53 / 28 Регистрация: 23.04.2011 Сообщений: 214
	06.05.2014, 10:01
	представленный код не работает, стилей нет... ну да ладно...у Вас все абсолютно так, это свойство такое, применяя его к элементу, нужно быть готовым, что его дочерние элементы также будут с соответствующей прозрачностью есть возможность это обойти с помощью псевдородителя 0

@dimadyak 9 / 9 / 6 Регистрация: 08.04.2014 Сообщений: 54
	06.05.2014, 10:25
	как вариант задать цвет фону в rgba формате 0

@falosun 5 / 5 / 3 Регистрация: 29.03.2014 Сообщений: 48
	06.05.2014, 10:51
	Пиши background-color: rbga{0,0,0,.5); ну или какой у тебя цвет, проверь через фотошоп, или что-нибудь другое. Естественно opacity вообще убери строчку. 1