Единый форум поддержки |
Привет, Гость! Войдите или зарегистрируйтесь.
Вы здесь » Единый форум поддержки » Архив » Общие вопросы по оформлению (53)
Предыдущая тема: Общие вопросы по оформлению (52)
Как с помощью браузера можно определить элемент дизайна. | |
Полезные скрипты, необходимые темы для новичков, а также ссылки на сайты рассказывающие что такое НТМЛ и CSS. | |
Ответы на часто задаваемые вопросы. | |
Как задавать вопросы! Разница между стилем и скриптом. ( Советы) | Плюс к названию темы еще и Памятка. |
Любой вопрос по оформлению/неполадкам сопровождайте ссылкой на форум, по которому возникли сложности. |
добрый день!
подскажите, как убрать это огромное расстояние внизу, где футер?
Это у вас в стиле так по дурному прописано:
#pun-about p.container {background-color: #;
background-image : url(http://sd.uploads.ru/yYTt4.png);
background-position : center top;
background-repeat : no-repeat;
height: 141px;
width: 800px;
margin-left: -32px;
text-align: center;
border-color: transparent;
}
В НТМЛ верх поставьте:
<style type="text/css"> height: 30px !important; </style>
30px - выставляете в коде высоту, которая вам нужна..Я поставил на глаз..
kolobdur74А теперь ещё раз, и помедленнее.
А как отпозиционировать инпуты внутри окна?
Уменьшаем их по ширине/высоте, а дальше как прописывать?
<!---Быстрый вход--->
<script id="MylogIn" type="text"><!--Быстрый Вход -->
<form id="login" style="top: 109px; margin-left:-360px; position: absolute; right: 15px; text-align: center; width: 384px; height: 260px; backgroung-image: none; font-family: Arial Black!important;" class="container" method="post" action="/login.php?action=in" onsubmit="return process_form(this)">
<div style="background-image: url(http://se.uploads.ru/VnatM.png); background-position: center; width: 384px; height: 260px;">
<input type="hidden" name="form_sent" value="1" /><input type="hidden" name="redirect_url" value="" /><br/><br/>
<input placeholder="Логин" style="text-align:center;height:30px;font-size:16px" type="text" id="fld1" name="req_username" size="16" maxlength="25" /><br/><br/><br/>
<input placeholder="Пароль" style="text-align:center;height:30px;font-size:16px" type="password" id="fld2" name="req_password" size="16" maxlength="16" /><br/><br/>
<a href="http://cwaw.mybb.ru/register.php" style="color:#FFFFFF; font-family: Georgia; font-style: italic;">Go to registration</a><br/><br/>
<button type="submit" style="height: 50px; width: 140px; background-color: #849758; color: #ffffff; font-family: Times New Roman; outline: none; border: none;">ВХОД</button>
</div>
</form>
</script>
<script>$(document).ready(function(){if($("#navlogin").length)$(".punbb").prepend($("#MylogIn").text());});</script>
<!---Быстрый вход--->
"Поигрался" с выделенным, меняя то на left, то на right.
left
right
В случае с right вообще бросает на другой борт форума, а с left - суёт в запредельные дали.
Код:
<script type="text/javascript">
function change(){
var date = new Date(); // Получаем текущие дату и время
var h = date.getHours(); // Получаем текущий час
if (h > 23 || h <7) {$('#pun_wrap').css('backgroundImage', 'url(Ссылка на картинку)')}
if (h > 6 && h < 12) {$('#pun_wrap').css('backgroundImage', 'url(Ссылка на картинку)')}
if (h > 11 && h < 19) {$('#pun_wrap').css('backgroundImage', 'url(Ссылка на картинку)')}
if (h > 18 && h < 24) {$('#pun_wrap').css('backgroundImage', 'url(Ссылка на картинку)')}
}
$(document).ready(function(){
change();
});
</script>Вместо:
{$('#pun_wrap').css('backgroundImage', 'url(Ссылка на картинку)')}
Вместо красного выставляем селектор на который ставим фон, вместо зеленого ваша картинка..
Подпись автора
Инструменты для поиска и редактирования стиля
Как с помощью браузера можно определить элемент дизайна
Каталог скриптов/CSS
Полезные скрипты, темы для новичков
Типовые Вопросы(ЧаВо)
Ответы на часто задаваемые вопросы
Просилка
Просьбы по улучшению работы сервиса
Спасибо! Прекрасный код, все работает. А можно сделать так, чтобы изображение растягивалось на весь экран и не повторялось?
Здравствуйте!Хочу спросить, как поставить картинку на фон, как на этом форуме?
http://prehistoric.0pk.ru/
А теперь ещё раз, и помедленнее.
Обернуть, а не запихать внутрь формы, вот таким образом:
<!---Быстрый вход--->
<script id="MylogIn" type="text"><!--Быстрый Вход -->
<div style="background-image: url(http://se.uploads.ru/VnatM.png); background-position: center; width: 384px; height: 260px;">
<form id="login" style="top: 109px; margin-left:-360px; position: absolute; right: 15px; text-align: center; width: 384px; height: 260px; backgroung-image: none; font-family: Arial Black!important;" class="container" method="post" action="/login.php?action=in" onsubmit="return process_form(this)"><input type="hidden" name="form_sent" value="1" /><input type="hidden" name="redirect_url" value="" /><br/><br/>
<input placeholder="Логин" style="text-align:center;height:30px;font-size:16px" type="text" id="fld1" name="req_username" size="16" maxlength="25" /><br/><br/><br/>
<input placeholder="Пароль" style="text-align:center;height:30px;font-size:16px" type="password" id="fld2" name="req_password" size="16" maxlength="16" /><br/><br/>
<a href="http://cwaw.mybb.ru/register.php" style="color:#FFFFFF; font-family: Georgia; font-style: italic;">Go to registration</a><br/><br/>
<button type="submit" style="height: 50px; width: 140px; background-color: #849758; color: #ffffff; font-family: Times New Roman; outline: none; border: none;">ВХОД</button>
</form>
</div>
</script>
<script>$(document).ready(function(){if($("#navlogin").length)$(".punbb").prepend($("#MylogIn").text());});</script>
<!---Быстрый вход--->
И уже внутри дива позиционировать форму, а инпуты лучше не трогать..Форма это тег: <form></form> Уменьшите форму, поставьте position: relative; вместо position: absolute; и маргинами отпозиционируйте в диве..
Deutalios
В Html-верх:
<style type="text/css">
html, body {
background: url(ссылка на изображение) fixed;
background-size: 100%;
}
</style>
Здравствуйте!Хочу спросить, как поставить картинку на фон, как на этом форуме?
http://prehistoric.0pk.ru/
В НТМЛ верх:
<style type="text/css">
HTML, BODY {
background-image: url(Ссылка на картинку фона);
background-attachment: fixed;
background-size: 100%;
}
.punbb .section .container, .punbb .post-body, .punbb .post-links, .punbb .formal fieldset .post-box, #viewprofile li strong, #viewprofile li div, #setmods dd, .punbb .info-box, .punbb #pun-main .info-box .legend, .punbb .main .container, .punbb .post .container, .punbb .post h3, #pun-stats h2, .punbb .main h1, .punbb .main h2, #pun-title .container, .punbb .modmenu .container, #pun-navlinks .container, .punbb th, .punbb .post h3 span, #pun-main fieldset legend span, .punbb textarea, .punbb .quote-box, .punbb .code-box, #pun-crumbs2 .container, #pun-about .container, .punbb .section .formal .container, .punbb .altstyle h3, .punbb .altstyle .container, #pun-navlinks .container, #pun-ulinks .container, #profilenav h2 span, .punbb td.tc2, .punbb td.tc3, .punbb td.tcr, #viewprofile li strong, #pun-title h1, #pun-stats div.statscon, #viewprofile li div, #setmods dd, .punbb #pun-main .info-box .legend, .punbb .post-links, .punbb .formal fieldset, .punbb .post-body, .post-box, .punbb .altstyle .post-links, .punbb .altstyle .post-body, .altstyle .post-box, .punbb th, .punbb legend span, .punbb .post h3 span, .punbb .altstyle h3 span, #viewprofile h2 span {
background: transparent none !important;
}
</style>Сюда ставим ссылку на картинку фона: background-image: url(Ссылка на картинку фона);
Спасибо! Прекрасный код, все работает. А можно сделать так, чтобы изображение растягивалось на весь экран и не повторялось?
В НТМЛ верх:
<style type="text/css">
#pun_wrap {
background-size: 100% 100%;
background-repeat: no-repeat;
}
</style>Селектор #pun_wrap меняем на свой, на котором висит фон..
kolobdur74, спасибо!
kolobdur74
Дело принимает скверный оборот, если поменять position.
kolobdur74, у меня теперь такой вопрос, я сделал фон, а текст весь белый и ничего не видно (посты, описания подфорумов...), как изменять цвет?
Отредактировано Deutalios (Пн, 14 Июл 2014 12:12:29)
Доброго времени суток!
Хотелось бы немного подкорректировать стиль подфорумов, да только мои очумелые лапки не знают, как.
В чем, собственно, суть. Идет описание подфорума, слева иконка. Пока что все нормально. Но потом, видимо, иконка заканчивается, и описание съезжает влево.
Хотелось бы как-нибудь все это выровнять без изменения высоты иконки, ибо в описаниях стоят таблицы, которым выставлена ширина в процентах. И эти таблицы отказываются идти с иконкой вместе и начинаются только после нее (то бишь, как съехавший текст)
у меня теперь такой вопрос, я сделал фон, а текст весь белый и ничего не видно, как изменять цвет?
Если для всего форума, то:
<style type="text/css">
#pun {
color: #16334B;
}
</style>Где: color: #16334B; ставите свой цвет..
Дело принимает скверный оборот, если поменять position.
Я же сказал - для дива своя позиция, для формы своя..Див двигаем по форуму, форму двигаем внутри дива, что-то вроде:
<script id="MylogIn" type="text">
<div style="top: 109px; margin-left:30px; position: fixed; text-align: right; width: 384px; height: 260px; background-image: url('http://se.uploads.ru/VnatM.png');">
<form id="login" style="margin-left:157px; position: relative; text-align: center; width: 192px; height: 260px; background: transparent; font-family: Arial Black!important;" class="container" method="post" action="/login.php?action=in" onsubmit="return process_form(this)">
<input type="hidden" name="form_sent" value="1" /><input type="hidden" name="redirect_url" value="" /><br/><br/>
<input placeholder="Логин" style="text-align:center;height:30px;font-size:16px" type="text" id="fld1" name="req_username" size="16" maxlength="25" /><br/><br/><br/>
<input placeholder="Пароль" style="text-align:center;height:30px;font-size:16px" type="password" id="fld2" name="req_password" size="16" maxlength="16" /><br/><br/>
<a href="http://cwaw.mybb.ru/register.php" style="color:#FFFFFF; font-family: Times New Roman;">ЗАРЕГИСТРИРУЙТЕСЬ</a><br/><br/>
<button type="submit" style="height: 50px; width: 160px; background-color: #849758; color: #ffffff; font-family: Times New Roman; outline: none; border: none;">ВХОД</button>
</form>
</div>
</script>
<script>$(document).ready(function(){if($("#navlogin").length)$(".punbb").prepend($("#MylogIn").text());});</script>Где: color: #16334B; ставите свой цвет..
А какой код будет у красного цвета?И куда вставлять скрипт?
Отредактировано Deutalios (Пн, 14 Июл 2014 12:29:53)
Хотелось бы как-нибудь все это выровнять без изменения высоты иконки, ибо в описаниях стоят таблицы, которым выставлена ширина в процентах. И эти таблицы отказываются идти с иконкой вместе и начинаются только после нее (то бишь, как съехавший текст)
Ну, так увеличьте отступ:
/* C2.14 */
.punbb td div.tclcon {
margin-left: 29px;
}
У вас картинка наезжает на текст, текст ее обтекает, а дальше возвращается назад..
Добрый День 
Мне стало интересно, как сделать так, чтобы на месте ввода(я прилагаю изображение) был не такой фон, а какая-нибудь картиунка, которую мне нужно вставить.
То есть, не как у меня 
, а как здесь 
Заранее спасибо ,3
А какой код будет у красного цвета?И куда вставлять скрипт?
Цвет красного: red, есть таблица цветов: http://www.stm.dp.ua/web-design/color-html.php Это не скрипт - это css, ставить в НТМЛ верх.
kolobdur74, не выходит.
Фон на всю форму:
<style type="text/css">
.punbb .formal fieldset {
background-image: url(ссылка на картинку);
}
</style>
Фон на поле ввода:
<style type="text/css">
.formal textarea {
background-image: url(ссылка на картинку);
}
</style>
не выходит.
В каких местах цвет шрифта вам нужно заменить? И ссылку на форум..
Вы здесь » Единый форум поддержки » Архив » Общие вопросы по оформлению (53)