InícioData/hora atual: 28.04.24 7:14
1 Resultado encontrado para icones-footer
Construção de footer
Cole este código para que funcione.Para diminuir, acesse #icones-footer li
Em width e height você coloca a mesma quantidade de px. Creio que 35px ficará bom.
- Código:
<!-- BEGIN html_validation -->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<body>
<div>
<div>
<div>
<div>
<div>
<div>
<ul>
<li>
<!-- END html_validation -->
</li>
</ul>
<!-- BEGIN switch_footer_links -->
<ul>
<li>
<!-- BEGIN footer_link -->
<!-- BEGIN switch_separator --> | <!-- END switch_separator -->
{switch_footer_links.footer_link.FOOTER_LINK_SEPARATOR}<a name="bottom" class="copyright" href="{switch_footer_links.footer_link.U_FOOTER_LINK_HREF}" rel="{switch_footer_links.footer_link.FOOTER_LINK_REL}" target="{switch_footer_links.footer_link.FOOTER_LINK_TARGET}" title="{switch_footer_links.footer_link.L_FOOTER_LINK_TITLE}">{switch_footer_links.footer_link.L_FOOTER_LINK_TEXT}</a>
<!-- END footer_link -->
</li>
</ul>
<!-- END switch_footer_links -->
</div>
<br />
<p class="center">
<strong>{ADMIN_LINK}</strong>
</p>
</div>
{PROTECT_FOOTER}
</div>
</div>
</div>
</div>
<div id='subscribers'>
<div class="num1" id='catalog1'>
<p><font color="#A3AAAE"><font size="3px"><strong>© WEBGRAFIC - Todos os Direitos Reservados</strong></font><br>
Este tema foi construído pelo WEBGRAFIC com a utilização de alguns utilitários<br>dos fóruns WEBTOOLS e WASD a cópia total ou parcial de qualquer conteúdo do fórum é proíbida.</p></div>
<div id='icones-footer'>
<ul>
<li class="seta-icone" title="Topo da Página" onclick="$('html,body').animate({scrollTop: $('#top').offset().top}, 2000);"></li>
<a href="https://facebook.com/Undeath5" target="_blank"><li title="Facebook" class="facebook-icone"></li></a>
<a href="https://twitter.com/Undeath5" target="_blank"><li title="Twitter" class="twitter-icone"></li></a>
</ul>
</div>
</div><style>
#icones-footer{
list-style-type: none;
float: right;
margin-right: 3%;
margin-top: 21px;
}
#icones-footer li {
float: left;
display: inline-block;
margin-left: 10px;
width:35px; /* MUDE O TAMANHO AQUI */
height:35px; /* E AQUI TAMBÉM */
opacity: 0.8;
transition: 0.3s;
background-size: contain;
}
#icones-footer li:hover{
opacity:1.0;
}
.seta-icone {
background: url("http://i.imgur.com/cxhUelO.png") no-repeat;
}
.seta-icone:hover {
background: url("http://i.imgur.com/phMFS9N.png") no-repeat;
}
.twitter-icone {
background: url("http://i.imgur.com/KqHAp6d.png") no-repeat;
}
.twitter-icone:hover {
background: url("http://i.imgur.com/KqHAp6d.png") no-repeat;
}
.facebook-icone {
background: url("http://i.imgur.com/JhHZbmy.png") no-repeat;
}
.facebook-icone:hover {
background: url('http://i.imgur.com/e1Kn1Zr.png');
}
.num1 h3::before {
content: "\f129 ";
font-family: "fontawesome";
font-weight: 100;
}
.num2 h3::before {
content: "\f1e0 ";
font-family: "fontawesome";
font-weight: 100;
}
.num3 h3::before {
content: "\f0c1 ";
font-family: "fontawesome";
font-weight: 100;
}
.num4 h3::before {
content: "\f1f9 ";
font-family: "fontawesome";
font-weight: 100;
}
#subscribers h3 {
padding: 10px 10px 0px 0px;
color: #C3C3C3;
display: block;
font-family: "Trebuchet MS","Helvetica Neue",Helvetica,Arial,sans-serif;
font-size: 17px;
text-transform: uppercase;
border-bottom: 1px solid;
margin-bottom: 5px;
}
#catalog3 {
float: left;
margin-left: 20px;
padding-right: 50px;
height: 100px;}
#catalog2 {
float: left;
margin-left: 20px;
padding-right: 50px;
height: 100px;
}
#catalog1 {
float: left;
padding-right: 50px;
height: 100px;
margin-left: 3%;
margin-top: 21px;
}
#subscribers {
height: 100px;
width: auto;
padding: 20px;
background: #2A2C33;
border-top: 3px solid #D69200;
}
#subbox {
padding: 10px;
border: 1px solid #D2D2D3;
color: #d2d2d2;
}
#subbutton {
padding: 10px;
color: #fff;
font-weight: 800;
background: #0091d6;
}
div#catalog2 img {
width: 241px;
height: 100px;
}
.teammembers { padding: 0px; margin: 0px; }
ul.teammembers li img { height: 60px;
width: 63px;
border-radius: 50%;
-moz-border-radius: 50%;}
ul.teammembers li {
display: block;
padding: 0px;
margin: 0px;
float: left;
margin-right: 22px;
filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale"); /* Firefox 10+, Firefox on Android */
filter: gray; /* IE6-9 */
-webkit-filter: grayscale(100%); /* Chrome 19+, Safari 6+, Safari 6+ iOS */
}
ul.teammembers li img:hover {
filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'1 0 0 0 0, 0 1 0 0 0, 0 0 1 0 0, 0 0 0 1 0\'/></filter></svg>#grayscale");
-webkit-filter: grayscale(0%);}
.post-body h2 {
font-size: 30px;
font-weight: 600;
color: #0091d6;
margin: 0px;
line-height: 35px;
}
</style>
<!-- BEGIN switch_facebook_login -->
<div id="fb-root"></div>
<script type="text/javascript">
FB.init({
appId : {switch_facebook_login.FACEBOOK_APP_ID},
cookie : true,
xfbml : true,
oauth : true,
version : 'v2.3'
});
(function(d, s, id){
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) {return;}
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/en_US/sdk.js";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
</script>
<!-- END switch_facebook_login -->
<!-- BEGIN switch_facebook_logout_TMP -->
<script type="text/javascript">
//<![CDATA[
FB.Event.subscribe('auth.logout', function(response) {
if ($('a#logout'))
{
var lien_redir = $('a#logout').attr('href');
if ($('a#logout').attr('href') && $('a#logout').attr('href') != '')
{
document.location.href = 'http://{switch_facebook_logout.SERVER_NAME}/' + lien_redir;
}
}
});
$(document).ready( function() {
$('a#logout').click( function() {
FB.logout();
} );
} );
//]]>
</script>
<!-- END switch_facebook_logout_TMP -->
<script type="text/javascript">
//<![CDATA[
fa_endpage();
//]]>
</script>
</body>
</html>
- em 02.01.16 6:13
- Procurar em: Questões resolvidas sobre HTML e BBCode
- Tópico: Construção de footer
- Respostas: 19
- Vistos: 1192
Facebook
Twitter
Youtube
