- 0
-
Обсуждения
-
Доброго всем времени суток. Прошу помощи. Научите принципу изменения футера. Движок Xenforo. Версия 2.2.10. Стиль дефолтный. Что именно нужно в итоге на фото примере. Мой шаблон app.footer less имеет следующее значение. .p-footer { .xf-publicFooter(); a { .xf-publicFooterLink(); } } .p-footer-inner { .m-pageWidth(); .m-pageInset(); padding-top: @xf-paddingMedium; padding-bottom: @xf-paddingLarge; } .p-footer-row { .m-clearFix(); margin-bottom: -@xf-paddingLarge; } .p-footer-row-main { float: left; margin-bottom: @xf-paddingLarge; } .p-footer-row-opposite { float: right; margin-bottom: @xf-paddingLarge; } .p-footer-linkList { .m-listPlain(); .m-clearFix(); > li { float: left; margin-right: .5em; &:last-child { margin-right: 0; } a { padding: 2px 4px; border-radius: @xf-borderRadiusSmall; &:hover { text-decoration: none; background-color: fade(@xf-publicFooterLink--color, 10%); } } } } .p-footer-rssLink { > span { position: relative; top: -1px; display: inline-block; width: 1.44em; height: 1.44em; line-height: 1.44em; text-align: center; font-size: .8em; background-color: #4682B4; border-radius: 2px; } .fa-rss { color: white; } } .p-footer-copyright { margin-top: @xf-elementSpacer; text-align: center; font-size: @xf-fontSizeSmallest; } .p-footer-debug { margin-top: @xf-paddingLarge; text-align: right; font-size: @xf-fontSizeSmallest; .pairs > dt { color: inherit; } } @media (max-width: @xf-responsiveMedium) { .p-footer-row-main, .p-footer-row-opposite { float: none; } .p-footer-copyright { text-align: left; padding: 0 4px; // aligns with other links } } -
Нужны сайты с примерами верстки, типа https://css-tricks.com/. Типовые приемы и нестандартные на все случаи жизни. Накидайте ссылок. -
By Katerina23 · Posted
Да, подходит. Спасибо. -
<input type="number"> -
By Katerina23 · Posted
Здравствуйте, подскажите какой тег использовать для увеличения значения, пример на картинке. Вроде, про такой тег я слышала. Если есть тег прогресс бар, значит и такое должно быть.
-
Question
ose
Буду очень признателен в оказании мне помощи, т.к. я только начинаю осваивать азы верстки...
Пробую настроить шаблон VM на Jooml`e. Увеличил шаблон мини изображения, картинка увеличилась но текст справа наезжает на нее. Поправил красные поля, в Firefox все выглидит так как надо, а в эксплорере текст поверх картинки и в высоту длина не увеличивается. float: left пробовал добавлять к картинке...
#product_list>div { /*Оформление "квадрата" с информацией о товаре */
border-right:1px #E5E5E5 solid;
background-image:url("../images/t1_bottom.gif");
background-repeat:no-repeat;
background-position:0 100%;
margin-top:1em;
margin-bottom:2em;
margin-left:10px;
margin-right:0 !important;
position:relative;
left:-10px;
padding-bottom:2em;
[color="red"][b]min-height:250px;[/b][/color]
/* width:46% !important;
float:left !important;
clear:left !important; */
}
#product_list div>div{ /*div, содержащий тело "квадрата" */
border:none;
margin:0;
left:0;
background:none;
}
#product_list div>div>div{ /*div, содержащий заголовок "квадрата"*/
/* width:auto !important; */
margin-top:45px;
/* margin-left:20px;*/
}
#product_list div>div>div>h3{ /*Оформление заголовка "квадрата"*/
/**/
border-right:1px #FFB64F solid;
background-color:#FFB64F;
background-image:url("../images/t1_header.gif");
background-repeat:no-repeat;
color:white;
font-size:9pt;
display:block;
width:100%;
/* width:297px; */
/**/
padding:0;
padding-top:4px;
padding-bottom:4px;
margin:0;
margin-left:-3px;
margin-top:-45px;
margin-bottom:15px;
text-align:left;
/**/
}
#product_list div div div div a { /*Ссылка "Подробнее"*/
display:block;
margin-top:0.5em;
}
#product_list a img { /*Картинка товара*/
margin-top:15px;
margin-left:1.5em;
position:absolute;
}
#product_list div div div div span { /* Цена товара*/
color:#F7971D;
font-size:12pt;
font-weight:bold;
text-align:right !important;
display:block;
margin-right:0.2em;
margin-top:0.2em;
margin-bottom:0.4em;
}
#product_list div>div>div>h3>a{ /*Оформление текста заголовка "квадрата"*/
color:white;
font-size:12pt !important;
font-family:Verdana,Arial,Helvetica,sans-serif;
text-decoration:none !important;
position:relative;
left:-40px;
}
#product_list div>div>div>div { /*div-ы : описание, цена, количество, рейтинг товара */
padding-left:1.5em !important;
padding-right:0.5em;
width:auto !important;
margin-top:-0.4em;
[color="red"][b]margin-left:170px;[/b][/color]
margin-bottom:1em;
}
#product_list div div div div a { /*Ссылка "Подробнее"*/
display:block;
margin-top:0.5em;
}
#product_list a img { /*Картинка товара*/
[color="#FF0000"]float: left;[/color]
margin-top:15px;
margin-left:1.5em;
position:absolute;
}
#product_list div div div div span { /* Цена товара*/
color:#F7971D;
font-size:12pt;
font-weight:bold;
text-align:right !important;
display:block;
margin-right:0.2em;
margin-top:0.2em;
margin-bottom:0.4em;
}
Вот html
Edited by oseLink to comment
Share on other sites
6 answers to this question
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.