Форум программистов, компьютерный форум, киберфорум
HTML, CSS
Войти
Регистрация
Восстановить пароль
Блоги Сообщество Поиск Заказать работу  
 
Рейтинг 4.60/5: Рейтинг темы: голосов - 5, средняя оценка - 4.60
9 / 9 / 3
Регистрация: 11.10.2014
Сообщений: 363

Как сделать полупрозрачным фон слоя

30.11.2015, 02:01. Показов 1143. Ответов 1
Метки нет (Все метки)

Студворк — интернет-сервис помощи студентам
Имеется сайт (не думайте что реклама, скрин прикреплю ниже), multigstore.ru , как сделать что бы белая часть (обведено красным) была полупрозрачной.

исходный код шаблона:
Кликните здесь для просмотра всего текста

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
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
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
<html>
<head>
<meta charset="utf-8">
<title>Multi Games Store</title>
<script type="text/javascript">
//<![CDATA[
try{if (!window.CloudFlare) {var CloudFlare=[{verbose:0,p:1415656639,byc:0,owlid:"cf",bag2:1,mirage2:0,oracle:0,paths:{cloudflare:"/cdn-cgi/nexp/dok2v=1613a3a185/"},atok:"4e23a12c7b9affd1d88c6b220f097c9b",petok:"3381a9b915acf1961e3d9294130d4e04efd54097-1415721937-1800",zone:"multigstore.ru",rocket:"0",apps:{"abetterbrowser":{"ie":"6"},"ga_key":{"ua":"UA-47424123-1","ga_bs":"2"}}}];!function(a,b){a=document.createElement("script"),b=document.getElementsByTagName("script")[0],a.async=!0,a.src="//ajax.cloudflare.com/cdn-cgi/nexp/dok2v=919620257c/cloudflare.min.js",b.parentNode.insertBefore(a,b)}()}}catch(e){};
//]]>
</script>
 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript" src="https://primearea.biz/shopsite/v1.2/index.php?id=16914" charset="utf-8"></script>
<link media="screen" href="https://primearea.biz/shopsite/v1.2/my_site_style.css" type="text/css" rel="pamda" />
 
<meta name="description" content="10">
<link href="/assets/pamda/css/bootstrapcssleque.css" rel="stylesheet" media="screen">
<link href="/assets/pamda/css/style.css" rel="stylesheet" media="screen">
<link href="/assets/pamda/css/jquery.toastmessage.css" rel="stylesheet" media="screen">
<link href="/assets/pamda/css/stylesgrmsells.css" rel="stylesheet" media="screen">
<link href="/assets/pamda/css/lightboxgrmsells.css" rel="stylesheet" media="screen">
<link href="/assets/pamda/css/bootstrap-glyphicons.css" rel="stylesheet" media="screen">
<script src="http://code.jquery.com/jquery.js"></script>
<script type="text/javascript" src="http://code.jquery.com/ui/1.10.0/jquery-ui.js"></script>
<script src="/assets/js/bootstrap.min.js"></script>
<script type="text/javascript" src="//vk.com/js/api/openapi.js?121"></script>
<script src="/assets/js/bootstrap.js"></script>
<script src="/assets/js/respond.js"></script>
<script src="/assets/js/app.js"></script>
<script src="/assets/js/script.js"></script>
<script src="/assets/js/jquery.toastmessage.js"></script>
<script src="/assets/js/custom.js"></script>
<script src="/assets/js/popup_buy.js"></script>
<script src="/assets/js/jquery-ui-1.9.2.custom.min.js"></script>
<script src="/assets/ZeroClipboard.js"></script>
<script type="text/javascript">window.dload=function(e){if(document.addEventListener){if(typeof window.magictab!='undefined'&&window.magictab.__loaded===true){e()}else{document.addEventListener("mgtLoaded",e,false)}}else if(document.attachEvent){document.attachEvent("mgtLoaded",e)}};(function(c,a){window.magictab=a;var b,d,h,e;b=c.createElement("script");b.type="text/javascript";b.async=!0;b.src=("https:"===c.location.protocol?"https:":"http:")+'//api.magictab.ru/js/v2.0/magictab-1.0.js';d=c.getElementsByTagName("script")[0];d.parentNode.insertBefore(b,d);a._i=[];a.init=function(b,c,f){var g=a;"undefined"!==typeof f?g=a[f]=[]:f="magictab";g.people=g.people||[];g.plugins=g.plugins||[];a._autoload=['alerts','main-widget'];a._i.push([b,c,f])};a.__SV=1.3;a._e=document.createEvent("Event");a._e.initEvent('mgtLoaded', true, true);})(document,window.magictab||[]);magictab.init("895468a56c39347c481e5aea21906b4c");</script><style>.modal-content{color:rgb(0,0,0);}.tab-box{width:796px;}</style>
 
<script type="text/javascript">
  var _paq = _paq || [];
  _paq.push(['trackPageView']);
  _paq.push(['enableLinkTracking']);
  (function() {
    var u=(("https:" == document.location.protocol) ? "https" : "http") + ":multigstore.ru";
    _paq.push(['setTrackerUrl', u+'piwik.php']);
    _paq.push(['setSiteId', 1]);
    var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0]; g.type='text/javascript';
    g.defer=true; g.async=true; g.src=u+'piwik.js'; s.parentNode.insertBefore(g,s);
  })();
</script>
<noscript><p><img src="http://stats.lequeshop.ru/piwik.php?idsite=1" style="border:0;" alt=""/></p></noscript>
</head> <body data-twttr-rendered="true" style="overflow: auto;">
<script type="text/javascript">
  VK.init({apiId: 5154436, onlyWidgets: true});
</script> 
<div id="preload" style="display: none;"><ul class="bokeh"><li></li><li></li><li></li><li></li></ul></div>
<div id="main">
 
<div id="header">
<ul id="h-nav">
<li><a href="/">Главная</a></li>
        <ul>
        <? echo get_menu($menu); ?>
        </ul>
</ul> <div id="h-poster">
<div id="h-shadw"></div>
<a style="background: url() no-repeat;width: 250px;" href="/" id="h-logo"></a>
<object type="image/svg+xml" data="http://multigstore.ru/image/Amin.svg">
</object>
</div>
<div id="h-searchbar">
<form id="h-search" action="/search_pamda" method="post">
<input type="text" name="m" placeholder="Введите фразу и нажмите Enter..." id="field">
<input type="submit" name="submit" value="" id="submit">
</form>
<div id="h-alphabet">
 
</div> 
<div class="rcol">
<div id="bags">
<a href="/page/myorders" target="_blank" rel="nofollow">Мои покупки</a>
</div>
</div>
</div>
<script>
$(function(){
        $('li.layer').click(function(){
                cid = $(this).data("catId")
                $('li.act').removeClass('act')
 
                $(this).addClass("act")
                console.log(cid)
                $.get('/', {'ajax': 1, 'cat_id': cid}, function(data){
                        $('div.layer').html(data)
 
                        console.log("Data recived")
                })
        })
})
</script>
<div id="cat-bar">
<ul class="cat-list">
<?php foreach($categories as $category): ?>
                        <li><? echo anchor('category/' . $category->id, $category->title); ?></li>
                    <?php endforeach; ?>
</ul>
</li>
</ul> </div>
</div>
<section id="middle" style="min-height: 20px;">
<aside id="side-left">
<ul class="b-nav">
<?php foreach($categories as $category): ?>
                        <li><? echo anchor('category/' . $category->id, $category->title); ?></li>
                    <?php endforeach; ?>
</ul>
</li>
</ul>
<div class="left-box">
<div class="block-top">Контакты</div>
<p><span><? echo config_item('site_infokontakt'); ?></span></p></div>
</aside>
<div class="layer">
<div id="content">
<aside id="side-right">
<div class="right-box">
<div class="block-top">Способы оплаты</div>
<img src='http://anselean.ru/images_decor/robokassa222.png'>
</div>
<div class="right-box">
<div class="block-top">Информация</div>
<script type="text/javascript" src="//vk.com/js/api/openapi.js?121"></script>
 
<!-- VK Widget -->
<div id="vk_groups"></div>
<script type="text/javascript">
VK.Widgets.Group("vk_groups", {mode: 2, width: "180", height: "350"}, 76136517);
</script>
</div>
  </aside>
 
<div  id="content-c">
<? $this->load->view($subview); ?>
<?php
mysql_query("UPDATE views SET sviews=sviews+1 WHERE id = '1'") or die(mysql_error());
?>  
<ul class="paginator">
</ul> </div>
</div> </div>
 
</section>
<div id="hFooter"></div>
</div> 
<footer id="footer" class="wrap">
<div id="ws-copy">
</div>
<div class="rcont">
<script type="text/javascript">
    var _cp = {trackerId: 3929};
    (function(d){
        var cp=d.createElement('script');cp.type='text/javascript';cp.async = true;
        cp.src='//tracker.cartprotector.com/cartprotector.js';
        var s=d.getElementsByTagName('script')[0]; s.parentNode.insertBefore(cp, s);
    })(document);
</script> </div>
<div id="f-left">
<ul id="f-nav">
<li><a href="/">Главная</a>
<? echo get_menu($menu); ?>
</li></ul>
</div> </footer>
<style type="text/css">HTML,BODY{background-image:url(<? echo config_item('sitefon'); ?>);background-attachment:fixed;background-size:cover;background-repeat:no-repeat;cursor:url("hhttp://www.digma.ru/img/cursor.png"),auto;}body{font-family:Arial;font-size:13px;color:white;text-shadow:;}.modal-content{background-color:ffffff}#copybill{cursor:pointer;}#copyfund{cursor:pointer;}<style type="text/css">
Миниатюры
Как сделать полупрозрачным фон слоя  
0
cpp_developer
Эксперт
20123 / 5690 / 1417
Регистрация: 09.04.2010
Сообщений: 22,546
Блог
30.11.2015, 02:01
Ответы с готовыми решениями:

Как из слоя сделать фон
По всему макету имеется вот такое наложение с прозрачностью 15% Как из этой большой картинки вырезать кусок, что бы при репите не было...

Как сделать изображение полупрозрачным?
В каком формате надо сохранять изображение, чтобы оно было полупрозрачным? Или может это можно сделать в html или css? Перепробовал кучу...

Как сделать, чтобы левый край слоя не пропадал за экраном?
при позиционировании слоя методом left:50% margin-left - при уменьшении ширины экрана рано или поздно левый край пропадает за экраном. как...

1
В поисках себя
 Аватар для Glart
115 / 89 / 34
Регистрация: 12.11.2015
Сообщений: 529
30.11.2015, 02:21
В современном Мире.
CSS
1
background-color: rgba(0, 120, 201, 0.7); /* Цвет фона и значение прозрачности */
В старом мире ставилась на фон полупрозрачная png картинка.
0
Надоела реклама? Зарегистрируйтесь и она исчезнет полностью.
raxper
Эксперт
30234 / 6612 / 1498
Регистрация: 28.12.2010
Сообщений: 21,154
Блог
30.11.2015, 02:21
Помогаю со студенческими работами здесь

Как сделать резиновый фон шапки и резиновый фон меню?
Как сделать резиновый фон шапки и резиновый фон меню?

Нужно сделать элемент полупрозрачным, но чтобы сквозь него можно было кликать на другие элементы
есть полупрозрачный контейнер с картинкой со стилями: {position: absolute; z-index: 999; opacity: 0.3;} По сути весь сайт видно сквозь...

Как сделать фон
Подскажите как мне сделать фон внизу, если вверху у меня картинка с коллажами, а высота сайты достигает более 3000 пикселей.

Как сделать фон документа?
добрый вечер подскажите пожалуйста как сделать так чтоб фон по бокам сайта стал белым? вот что я имею ...

Как сделать фон на сайте?
Хоху что-бы на сайте можно было менять фон и что-бы после перезагрузки страницы он сохранялся Перепробовал и на php и на javascript но не...


Искать еще темы с ответами

Или воспользуйтесь поиском по форуму:
2
Ответ Создать тему
Новые блоги и статьи
Установка Qt Creator для C и C++: ставим среду, CMake и MinGW без фреймворка Qt
8Observer8 05.04.2026
Среду разработки Qt Creator можно установить без фреймворка Qt. Есть отдельный репозиторий для этой среды: https:/ / github. com/ qt-creator/ qt-creator, где можно скачать установщик, на вкладке Releases:. . .
AkelPad-скрипты, структуры, и немного лирики..
testuser2 05.04.2026
Такая программа, как AkelPad существует уже давно, и также давно существуют скрипты под нее. Тем не менее, прога живет, периодически что-то не спеша дополняется, улучшается. Что меня в первую очередь. . .
Отображение реквизитов в документе по условию и контроль их заполнения
Maks 04.04.2026
Алгоритм из решения ниже реализован на примере нетипового документа "ПланированиеСпецтехники", разработанного в конфигурации КА2. Данный документ берёт данные из другого нетипового документа. . .
Фото всей Земли с борта корабля Orion миссии Artemis II
kumehtar 04.04.2026
Это первое подобное фото сделанное человеком за 50 лет. Снимок называют новым вариантом легендарной фотографии «The Blue Marble» 1972 года, сделанной с борта корабля «Аполлон-17». Новое фото. . .
Вывод диалогового окна перед закрытием, если документ не проведён
Maks 04.04.2026
Алгоритм из решения ниже реализован на примере нетипового документа "СписаниеМатериалов", разработанного в конфигурации КА2. Задача: реализовать программный контроль на предмет проведения документа. . .
Программный контроль заполнения реквизитов табличной части документа
Maks 02.04.2026
Алгоритм из решения ниже реализован на примере нетипового документа "СписаниеМатериалов", разработанного в конфигурации КА2. Задача: 1. Реализовать контроль заполнения реквизита. . .
wmic не является внутренней или внешней командой
Maks 02.04.2026
Решение: DISM / Online / Add-Capability / CapabilityName:WMIC~~~~ Отсюда: https:/ / winitpro. ru/ index. php/ 2025/ 02/ 14/ komanda-wmic-ne-naydena/
Программная установка даты и запрет ее изменения
Maks 02.04.2026
Алгоритм из решения ниже реализован на примере нетипового документа "СписаниеМатериалов", разработанного в конфигурации КА2. Задача: при создании документов установить период списания автоматически. . .
КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin
Copyright ©2000 - 2026, CyberForum.ru