2023.05.22
This commit is contained in:
Alexander
parent
25335ed108
commit
f323b412ad
28
anb.openurl/anb.openurl.js
Normal file
28
anb.openurl/anb.openurl.js
Normal file
@ -0,0 +1,28 @@
|
|||||||
|
/* Скрипт для навигации по URL.
|
||||||
|
*** Автор: Александр Бабаев.
|
||||||
|
*** Версия: 0.5
|
||||||
|
*/
|
||||||
|
function openurl (url, target = 'self', params = null) {
|
||||||
|
var w_target = target;
|
||||||
|
w_target.toLowerCase;
|
||||||
|
switch (w_target) {
|
||||||
|
case 'new':
|
||||||
|
/* Открыть в новой вкладке */
|
||||||
|
window.open(url, "_blank");
|
||||||
|
break;
|
||||||
|
case 'modal':
|
||||||
|
/* Открыть в модальном окне */
|
||||||
|
var wparams = '';
|
||||||
|
if (params == null) {
|
||||||
|
wparams = 'toolbar=no, menubar=no, location=no, directories=no, status=no, width=800, height=600';
|
||||||
|
} else {
|
||||||
|
wparams = params;
|
||||||
|
}
|
||||||
|
window.open(url, "", wparams);
|
||||||
|
break;
|
||||||
|
default:
|
||||||
|
/* Открыть в текущем окне (по умолчанию) */
|
||||||
|
location.href = url;
|
||||||
|
}
|
||||||
|
return false;
|
||||||
|
}
|
||||||
15
anb.openurl/license.txt
Normal file
15
anb.openurl/license.txt
Normal file
@ -0,0 +1,15 @@
|
|||||||
|
anb.openurl. Library for open url in JS.
|
||||||
|
Copyright (C) 2018 - 2019 by Alexander Babaev.
|
||||||
|
|
||||||
|
This program is free software: you can redistribute it and/or modify
|
||||||
|
it under the terms of the GNU General Public License as published by
|
||||||
|
the Free Software Foundation, either version 3 of the License, or
|
||||||
|
any later version.
|
||||||
|
|
||||||
|
This program is distributed in the hope that it will be useful,
|
||||||
|
but WITHOUT ANY WARRANTY; without even the implied warranty of
|
||||||
|
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
||||||
|
GNU General Public License for more details.
|
||||||
|
|
||||||
|
You should have received a copy of the GNU General Public License
|
||||||
|
along with this program. If not, see <https://www.gnu.org/licenses/>.
|
||||||
8
anb.openurl/readme.txt
Normal file
8
anb.openurl/readme.txt
Normal file
@ -0,0 +1,8 @@
|
|||||||
|
--- anb.openurl ---
|
||||||
|
--- Версия: 1.0 ---
|
||||||
|
--- Описание: Библиотека открытия URL. ---
|
||||||
|
|
||||||
|
-- Автор: Александр Бабаев --
|
||||||
|
-- URL: https://babaev-an.ru/ --
|
||||||
|
|
||||||
|
- Лицензия: GPL3 (https://www.gnu.org/licenses/gpl.html) -
|
||||||
BIN
images/diplom/image_1.png
Normal file
BIN
images/diplom/image_1.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 475 KiB |
BIN
images/diplom/image_2.jpg
Normal file
BIN
images/diplom/image_2.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 60 KiB |
BIN
images/diplom/image_3.jpg
Normal file
BIN
images/diplom/image_3.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 40 KiB |
BIN
images/diplom/image_4.jpg
Normal file
BIN
images/diplom/image_4.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 89 KiB |
BIN
images/diplom/image_5.jpg
Normal file
BIN
images/diplom/image_5.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 31 KiB |
BIN
images/menu-sub.png
Normal file
BIN
images/menu-sub.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 237 B |
BIN
images/upbutton.png
Normal file
BIN
images/upbutton.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 918 B |
139
index.html
Normal file
139
index.html
Normal file
@ -0,0 +1,139 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="ru-RU">
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
|
||||||
|
<link rel="stylesheet" href="style.css" />
|
||||||
|
<link rel="stylesheet" href="https://medcollege.bsu.edu.ru/smc-content/themes/generatepress/style.css" />
|
||||||
|
<script type="text/javascript" src="anb.openurl/anb.openurl.js"></script>
|
||||||
|
<title>Заголовок вашей страницы</title>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<div id="siteheader">
|
||||||
|
<div id="medcol_header" class="mc_header">
|
||||||
|
<div id="medcollogo" class="medcollogo" onclick="openurl('https://medcollege.bsu.edu.ru/')" title="Перейти на главную страницу сайта"></div>
|
||||||
|
<div id="sitetitle" class="textcontainer">
|
||||||
|
<span class="sitesubtitle">Белгородский государственный национальный исследовательский университет</span>
|
||||||
|
<br>
|
||||||
|
<span class="sitetitle">МЕДИЦИНСКИЙ КОЛЛЕДЖ</span>
|
||||||
|
<br>
|
||||||
|
<span class="subsitetitle">Профилактика заболеваний, передающихся половым путём</span>
|
||||||
|
</div>
|
||||||
|
<div id="bsulogo" class="bsulogo" onclick="openurl('https://www.bsuedu.ru/bsu/')" title="Перейти на официальный сайт НИУ «БелГУ»"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<ul id="site-menu" class="site-menu">
|
||||||
|
<li onclick="openurl('https://medcollege.bsu.edu.ru/')">« Вернуться на сайт МК</li>
|
||||||
|
<li onclick="openurl('')" class="selected">Памятка</li>
|
||||||
|
<li onclick="openurl('about.html')">Об авторе</li>
|
||||||
|
</ul>
|
||||||
|
<div id="site-body" class="site-body">
|
||||||
|
<div class="columnContainer">
|
||||||
|
<div class="columnLeft">
|
||||||
|
<img src="images/diplom/image_1.png" alt="Инфекции, передаваемые половым путем" style="max-width: 440px;" />
|
||||||
|
</div>
|
||||||
|
<div class="columnRight">
|
||||||
|
<strong>Инфекции, передаваемые половым путем</strong> - это инфекции, которые передаются от одного человека другому при сексуальном контакте.
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="columnContainer">
|
||||||
|
<div class="columnLeft">
|
||||||
|
Получить инфекцию довольно легко.
|
||||||
|
<br />
|
||||||
|
Если половой акт незащищенный, то за один раз может передаваться
|
||||||
|
<br />
|
||||||
|
более двадцати пяти видов возбудителей
|
||||||
|
</div>
|
||||||
|
<div class="columnRight">
|
||||||
|
<img src="images/diplom/image_2.jpg" alt="Получение инфекции" style="max-width: 440px; max-height: 200px;" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="columnContainer">
|
||||||
|
<div class="columnLeft">
|
||||||
|
<img src="images/diplom/image_3.jpg" alt="Инфекции, передаваемые половым путем" style="max-width: 440px;" />
|
||||||
|
</div>
|
||||||
|
<div class="columnRight">
|
||||||
|
<strong>Инфекции передаются:</strong>
|
||||||
|
<ul>
|
||||||
|
<li>при половых контактах, то есть при оральном, вагинальном и анальном сексе с зараженным человеком;</li>
|
||||||
|
<li>при использовании общих шприцев и игл при введении внутривенно каких-либо веществ;</li>
|
||||||
|
<li>при телесном контакте с человеком, у которого имеются высыпания и язвочки, характерные для ИППП;</li>
|
||||||
|
<li>при контакте с кровью зараженного человека;</li>
|
||||||
|
<li>от инфицированной матери к ребенку во время беременности</li>
|
||||||
|
</ul>
|
||||||
|
Эти инфекции нередко бессимптомны, протекают долго (если не лечиться) и волнообразно, часто внешне не заметны.
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="columnContainer">
|
||||||
|
<div class="columnLeft">
|
||||||
|
Основными симптомами инфекций, передающихся половым путем, являются:
|
||||||
|
<ul>
|
||||||
|
<li>покраснение в области половых органов и заднего прохода;</li>
|
||||||
|
<li>боли во время полового акта;</li>
|
||||||
|
<li>болезненное и частое мочеиспускание;</li>
|
||||||
|
<li>бородавки или язвочки в области половых органов;</li>
|
||||||
|
<li>зуд и жжение в области половых органов;</li>
|
||||||
|
<li>выделения;</li>
|
||||||
|
<li>необычные кровотечения.</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
<div class="columnRight">
|
||||||
|
<img src="images/diplom/image_4.jpg" alt="Получение инфекции" style="max-width: 440px;" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="columnContainer">
|
||||||
|
<div class="columnLeft">
|
||||||
|
<img src="images/diplom/image_5.jpg" alt="Инфекции, передаваемые половым путем" style="max-width: 440px;" />
|
||||||
|
</div>
|
||||||
|
<div class="columnRight">
|
||||||
|
<h3 style="text-align: center">Профилактические мероприятия</h3>
|
||||||
|
<p>
|
||||||
|
Чем раньше заболевший обратится к врачу, тем выше вероятность его полного излечения.
|
||||||
|
Всегда лучше и проще предупредить болезнь, чем лечиться от неё, даже успешно.
|
||||||
|
</p>
|
||||||
|
|
||||||
|
<p>
|
||||||
|
Все мы знаем, что заболевание проще предупредить, чем лечить. Чтобы уменьшить риск заражения, помните о правилах профилактики:
|
||||||
|
<ul>
|
||||||
|
<li>
|
||||||
|
имейте одного полового партнера. В таком случае вероятность заразиться ИППП стремится к нулю;
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
используйте презервативы, соблюдая правила обращения с ними;
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
откажитесь от интимных контактов, если у Вас или у Вашей партнерши есть какие-либо высыпания на половых органах или во рту,
|
||||||
|
а также выделения из мочеполовых путей.
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
растворы антисептиков защищают от бактериальных ИППП, однако не стоит слишком увлекаться такими средствами,
|
||||||
|
так как частое их использование может привести к нарушению микрофлоры во влагалище;
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
если произошел половой контакт со случайной партнершей, нужно как можно быстрее опорожнить мочевой пузырь, снять загрязненное белье,
|
||||||
|
вымыть половые органы теплой водой с мылом, просушить чистой салфеткой и обработать каким-либо антисептиком - мирамистином, хлоргексидином.
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
при возникновении подозрительных симптомов следует, не затягивая, обратиться к врачу.
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div style="font-size: 150%; font-weight: bold; text-align: center;">
|
||||||
|
Любите друг друга и будьте здоровы!
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<div id="footer" class="site-footer">
|
||||||
|
<p>© 2023 Литовченко Екатерина Павловна. При использовании текстовых и графических материалов ссылка на сайт обязательна.</p>
|
||||||
|
<p>Шаблон, © 2019 Александр Бабаев. При использовании шаблона ссылка на сайт <a href="https://medcollege.bsu.edu.ru/">https://medcollege.bsu.edu.ru/</a> обязательна.</p>
|
||||||
|
</div>
|
||||||
|
<div class="upbutton" onclick="openurl('#')"></div>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
341
style.css
Normal file
341
style.css
Normal file
@ -0,0 +1,341 @@
|
|||||||
|
/*
|
||||||
|
Theme Name: MedColBSU
|
||||||
|
Theme URI: https://medcollege.bsu.edu.ru/
|
||||||
|
Description: Web-page created for compatibility with main site
|
||||||
|
Author: Alexander Babaev
|
||||||
|
Author URI: https://babaev-an.ru/
|
||||||
|
Version: 0.1
|
||||||
|
*/
|
||||||
|
/* 1. Контйнер содержимого сайта */
|
||||||
|
.site-body {
|
||||||
|
line-height: 1.5;
|
||||||
|
text-align: justify-all;
|
||||||
|
}
|
||||||
|
@media (max-width: 768px) {
|
||||||
|
.site-body{
|
||||||
|
padding: 10px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@media (min-width: 769px) and (max-width: 1024px) {
|
||||||
|
.site-body{
|
||||||
|
padding: 20px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@media (min-width: 1025px) {
|
||||||
|
.site-body{
|
||||||
|
padding: 40px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
/* 2. Контейнер шапки. */
|
||||||
|
.mc_header {
|
||||||
|
display: -webkit-flex;
|
||||||
|
-webkit-justify-content: center;
|
||||||
|
display: flex;
|
||||||
|
justify-content: flex-start;
|
||||||
|
align-items: center;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
align-content: center;
|
||||||
|
width: auto;
|
||||||
|
flex-direction: row;
|
||||||
|
}
|
||||||
|
.mc_header .medcollogo {
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
.mc_header .bsulogo {
|
||||||
|
cursor: pointer;
|
||||||
|
margin-left: auto;
|
||||||
|
}
|
||||||
|
.mc_header .textcontainer{
|
||||||
|
min-width: 0;
|
||||||
|
word-wrap: break-word;
|
||||||
|
margin-left: 20px;
|
||||||
|
flex: auto;
|
||||||
|
}
|
||||||
|
@media (max-width: 309px) {
|
||||||
|
.mc_header {
|
||||||
|
flex-direction: column;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
.mc_header .bsulogo {
|
||||||
|
margin-left: 0px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@media (max-width: 768px) {
|
||||||
|
.mc_header {
|
||||||
|
padding: 2px 10px;
|
||||||
|
}
|
||||||
|
.mc_header .textcontainer{
|
||||||
|
margin-left: 5px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@media (min-width: 769px) and (max-width: 1024px) {
|
||||||
|
.mc_header {
|
||||||
|
padding: 3px 20px;
|
||||||
|
}
|
||||||
|
.mc_header .textcontainer{
|
||||||
|
margin-left: 10px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@media (min-width: 1025px) {
|
||||||
|
.mc_header {
|
||||||
|
padding: 5px 40px;
|
||||||
|
}
|
||||||
|
.mc_header .textcontainer{
|
||||||
|
margin-left: 20px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
/* 3. Текст шапки. */
|
||||||
|
.sitetitle {
|
||||||
|
font-family: PTSansRegular, Arial, Tahoma, Helvetica, Sans-Serif, Verdana;
|
||||||
|
color: #663333;
|
||||||
|
font-weight: 600;
|
||||||
|
line-height: 100%;
|
||||||
|
text-transform: uppercase;
|
||||||
|
white-space: pre-wrap;
|
||||||
|
}
|
||||||
|
.sitesubtitle {
|
||||||
|
font-family: PTSansRegular, Arial, Tahoma, Helvetica, Sans-Serif, Verdana;
|
||||||
|
color: #666666;
|
||||||
|
font-weight: normal;
|
||||||
|
white-space: pre-wrap;
|
||||||
|
}
|
||||||
|
.subsitetitle {
|
||||||
|
font-family: PTSansRegular, Arial, Tahoma, Helvetica, Sans-Serif, Verdana;
|
||||||
|
color: #ff4d00;
|
||||||
|
font-weight: 600;
|
||||||
|
line-height: 100%;
|
||||||
|
text-transform: uppercase;
|
||||||
|
white-space: pre-wrap;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (max-width: 768px) {
|
||||||
|
.sitetitle {
|
||||||
|
font-size: 16px;
|
||||||
|
}
|
||||||
|
.sitesubtitle {
|
||||||
|
font-size: 6px;
|
||||||
|
}
|
||||||
|
.subsitetitle {
|
||||||
|
font-size: 14px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@media (min-width: 769px) and (max-width: 1024px) {
|
||||||
|
.sitetitle {
|
||||||
|
font-size: 24px;
|
||||||
|
}
|
||||||
|
.sitesubtitle {
|
||||||
|
font-size: 11px;
|
||||||
|
}
|
||||||
|
.subsitetitle {
|
||||||
|
font-size: 22px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@media (min-width: 1025px) {
|
||||||
|
.sitetitle {
|
||||||
|
font-size: 35px;
|
||||||
|
}
|
||||||
|
.sitesubtitle {
|
||||||
|
font-size: 16px;
|
||||||
|
}
|
||||||
|
.subsitetitle {
|
||||||
|
font-size: 33px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
/* 4. Логотипы сайта. */
|
||||||
|
.medcollogo {
|
||||||
|
background-image: url(https://medcollege.bsu.edu.ru/smc-content/themes/medcolbsu/images/sitelogo/logo_medcol.png);
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
background-position: center center;
|
||||||
|
}
|
||||||
|
.bsulogo {
|
||||||
|
background-image: url(https://medcollege.bsu.edu.ru/smc-content/themes/medcolbsu/images/sitelogo/logo_bsu.png);
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
background-position: center center;
|
||||||
|
}
|
||||||
|
@media (max-width: 768px) {
|
||||||
|
.medcollogo {
|
||||||
|
background-size: 55px;
|
||||||
|
width: 55px;
|
||||||
|
height: 55px;
|
||||||
|
}
|
||||||
|
.bsulogo {
|
||||||
|
background-size: 37px;
|
||||||
|
width: 37px;
|
||||||
|
height: 55px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@media (min-width: 769px) and (max-width: 1024px) {
|
||||||
|
.medcollogo {
|
||||||
|
background-size: 81px;
|
||||||
|
width: 81px;
|
||||||
|
height: 82px;
|
||||||
|
}
|
||||||
|
.bsulogo {
|
||||||
|
background-size: 56px;
|
||||||
|
width: 56px;
|
||||||
|
height: 82px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@media (min-width: 1025px) {
|
||||||
|
.medcollogo {
|
||||||
|
background-size: 109px;
|
||||||
|
width: 109px;
|
||||||
|
height: 110px;
|
||||||
|
}
|
||||||
|
.bsulogo {
|
||||||
|
background-size: 61px;
|
||||||
|
width: 61px;
|
||||||
|
height: 90px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
/* 5. Меню. */
|
||||||
|
.site-menu {
|
||||||
|
margin: 0px;
|
||||||
|
padding: 0px;
|
||||||
|
width: 100%;
|
||||||
|
text-align: center;
|
||||||
|
border: 0px;
|
||||||
|
background: #69F;
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
.site-menu > li {
|
||||||
|
position: relative;
|
||||||
|
display: inline-block;
|
||||||
|
cursor: pointer;
|
||||||
|
padding: 10px 5px;
|
||||||
|
}
|
||||||
|
.site-menu li:hover {
|
||||||
|
background: #36C;
|
||||||
|
}
|
||||||
|
.site-menu > li:first-child {
|
||||||
|
margin-left: 10px;
|
||||||
|
}
|
||||||
|
.site-menu > li:last-child {
|
||||||
|
margin-right: 10px;
|
||||||
|
}
|
||||||
|
.site-menu-sub > li:first-child {
|
||||||
|
margin-top: 10px;
|
||||||
|
}
|
||||||
|
.site-menu-sub > li:last-child {
|
||||||
|
margin-bottom: 10px;
|
||||||
|
}
|
||||||
|
.site-menu .site-menu-sub {
|
||||||
|
left: 10px;
|
||||||
|
position: absolute;
|
||||||
|
display: none;
|
||||||
|
width: auto;
|
||||||
|
max-width: 300px;
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
list-style: none;
|
||||||
|
background: #69F;
|
||||||
|
}
|
||||||
|
.site-menu > .selected {
|
||||||
|
background: #36C;
|
||||||
|
}
|
||||||
|
.site-menu-sub > .selected {
|
||||||
|
background: #36C;
|
||||||
|
}
|
||||||
|
.site-menu-sub > li {
|
||||||
|
padding: 0px 10px;
|
||||||
|
}
|
||||||
|
.site-menu > li:hover .site-menu-sub {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
.site-menu-toggle {
|
||||||
|
display: inline-block;
|
||||||
|
width: 16px;
|
||||||
|
height: 16px;
|
||||||
|
clear: both;
|
||||||
|
background-image: url(images/menu-sub.png);
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
background-position: center center;
|
||||||
|
}
|
||||||
|
/* 6. Подвал */
|
||||||
|
.site-footer {
|
||||||
|
background-color: #69F;
|
||||||
|
color: white;
|
||||||
|
font-size: 14px;
|
||||||
|
text-align: center;
|
||||||
|
padding: 10px 5px 10px 5px;
|
||||||
|
}
|
||||||
|
/* 7. Класс для выравнивания и размера изображений. */
|
||||||
|
img.alleft {
|
||||||
|
float: left;
|
||||||
|
padding-right: 10px;
|
||||||
|
}
|
||||||
|
img.alright {
|
||||||
|
float: right;
|
||||||
|
padding-left: 10px;
|
||||||
|
}
|
||||||
|
img.small {
|
||||||
|
width: 150px;
|
||||||
|
height: auto
|
||||||
|
}
|
||||||
|
img.normal {
|
||||||
|
width: 300px;
|
||||||
|
height: auto
|
||||||
|
}
|
||||||
|
img.big {
|
||||||
|
width: 500px;
|
||||||
|
height: auto
|
||||||
|
}
|
||||||
|
img.hd {
|
||||||
|
width: 720px;
|
||||||
|
height: auto
|
||||||
|
}
|
||||||
|
/* 8. Кнопка «Вверх» */
|
||||||
|
.upbutton{
|
||||||
|
width: 80px;
|
||||||
|
height: 78px;
|
||||||
|
border: 0px;
|
||||||
|
padding: 5px;
|
||||||
|
position: fixed;
|
||||||
|
bottom: 2px;
|
||||||
|
right: 2px;
|
||||||
|
cursor: pointer;
|
||||||
|
background: url(images/upbutton.png) no-repeat;
|
||||||
|
opacity: 0.6;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 9. Класс, делящий страницу на 2 колонки. */
|
||||||
|
.columnContainer {
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: nowrap;
|
||||||
|
align-content: center;
|
||||||
|
justify-content: space-around;
|
||||||
|
}
|
||||||
|
|
||||||
|
.columnLeft{
|
||||||
|
padding-left: 10px;
|
||||||
|
order: 1;
|
||||||
|
text-align: right;
|
||||||
|
margin-right: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.columnRight {
|
||||||
|
padding-right: 10px;
|
||||||
|
order: 2;
|
||||||
|
text-align: left;
|
||||||
|
margin-left: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (max-width: 768px) {
|
||||||
|
.columnContainer {
|
||||||
|
flex-direction: column;
|
||||||
|
}
|
||||||
|
|
||||||
|
.columnContainer .columnLeft, .columnContainer .columnRight {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (min-width: 769px) {
|
||||||
|
.columnContainer {
|
||||||
|
flex-direction: row;
|
||||||
|
}
|
||||||
|
|
||||||
|
.columnContainer .columnLeft, .columnContainer .columnRight {
|
||||||
|
width: 50%;
|
||||||
|
}
|
||||||
|
}
|
||||||
Reference in New Issue
Block a user