Búsqueda en el Foro:
Buscar


« Ver tema anterior :: Ver siguiente tema »  
Autor Mensaje
Mensaje06-07-2012, 01:21 (UTC)    
Título del mensaje: Como cambiar color de fondo de web en CSS

Hola, quiero cambiar el color de fondo de mi web y no se como hacerlo
ya probé por medio de una url y no se cambia. Quiero cambiarlo de blanco a negro o gris,
espero que me puedan ayudar.

ACLARO: Es una plantilla de http://templatecss.es.tl/


Texto por encima de la página:
Cita:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//ES" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns='http://www.w3.org/1999/xhtml' xmlns:b='http://www.google.com/2005/gml/b' xmlns:data='http://www.google.com/2005/gml/data' xmlns:expr='http://www.google.com/2005/gml/expr'>
<head>
<link type='text/css' rel='stylesheet' href='http://www.blogger.com/static/v1/widgets/129348724-widget_css_bundle.css' />
<link rel="stylesheet" type="text/css" href="http://www.blogger.com/dyn-css/authorization.css?targetBlogID=555572411457400387&zx=73e1aff5-c4f2-4713-a3c7-00bc8ba45fa1"/>
<style type="text/css">#navbar-iframe { display:block }
</style>
<!--[if IE 7]> <style> span#prev {display:none} span#next {display:none} </style> <![endif]-->
<script type='text/javascript'>var thumbnail_mode = "float-left" ;
summary_noimg = 250;
summary_img = 250;
img_thumb_height = 300;
img_thumb_width = 575;
</script>
<script type='text/javascript'>
//<![CDATA[
function removeHtmlTag(strx,chop){
if(strx.indexOf("<")!=-1)
{
var s = strx.split("<");
for(var i=0;i<s.length;i++){
if(s[i].indexOf(">")!=-1){
s[i] = s[i].substring(s[i].indexOf(">")+1,s[i].length);
}
}
strx = s.join("");
}
chop = (chop < strx.length-1) ? chop : strx.length-2;
while(strx.charAt(chop-1)!=' ' && strx.indexOf(' ',chop)!=-1) chop++;
strx = strx.substring(0,chop-1);
return strx+' ';
}
function createSummaryAndThumb(pID){
var div = document.getElementById(pID);
var imgtag = "";
var img = div.getElementsByTagName("img");
var summ = summary_noimg;
imgtag = '<span style="float:left; margin:0px;"><img src="http://2.bp.blogspot.com/_M_YCe5AWy0o/TNVZHuVcl2I/AAAAAAAAAuE/qkp1YzqUheI/s1600/without+image" width="'+img_thumb_width+'px" height="'+img_thumb_height+'px"/></span>';
if(img.length>=1) {
imgtag = '<p><img src="'+img[0].src+'" width="'+img_thumb_width+'px" height="'+img_thumb_height+'px"/></p>';
summ = summary_img;
}
var summary = imgtag + '<p>' + removeHtmlTag(div.innerHTML,summ) + '</p>';
div.innerHTML = summary;
}
//]]>
</script>
<script type="text/javascript">
if (window.jstiming) window.jstiming.load.tick('headEnd');
</script></head>
<body>
<div class='navbar section' id='navbar'><div class='widget Navbar' id='Navbar1'><script type="text/javascript">
function setAttributeOnload(object, attribute, val) {
if(window.addEventListener) {
window.addEventListener("load",
function(){ object[attribute] = val; }, false);
} else {
window.attachEvent('onload', function(){ object[attribute] = val; });
}
}
function showRelatedContent(args) {
var el = document.getElementById('related-iframe');
if (el.parentNode.style.display != 'none') {
el.parentNode.style.display = 'none';
document.onclick = showRelatedContent.prevOnClick;
return;
}

var match = /(?:^[?]|&)c=([0-9]+)(?:&|(?!.))/.exec(args);
if (match !== null) {
document.getElementById('related-loading').style.left = match[1] + 'px';
el.style.left = Math.max(0, match[1] - parseInt(el.width) / 2) + 'px';
}
el.src = "http://www.blogger.com"
+ '/related-content.g?q='
+ window.location.href
+ '&id=' + "555572411457400387";
el.parentNode.style.display = 'block';
showRelatedContent.prevOnClick = document.onclick;

// Hide related-content dropdown when clicking anywhere but on it.
document.onclick = function() {
var el = document.getElementById('related-iframe');
if (el.parentNode.style.display != 'none') {
el.parentNode.style.display = 'none';
}
document.onclick = showRelatedContent.prevOnClick;
};
}
</script>
<div></div></div></div>
<div id='header'>
<div id='subscription_box'>
<a href='#'><img alt='RSS' src='http://2.bp.blogspot.com/_dZM2bJJMfBs/TQ7TTcw_DiI/AAAAAAAABVQ/WwedK-kUpY0/s000/rss_icon.png'/></a>
<a href='#'><img alt='Twitter' src='http://3.bp.blogspot.com/_dZM2bJJMfBs/TQ7TTu6M1HI/AAAAAAAABVU/w-dvS9hzMlw/s000/twitter_icon.png'/></a>
<a href='#'><img alt='Facebook' src='http://3.bp.blogspot.com/_dZM2bJJMfBs/TQ7TT0SEX9I/AAAAAAAABVY/5mUVczztK6s/s000/facebook.png'/></a>
<a href='#'><img alt='youtube' src='http://2.bp.blogspot.com/_dZM2bJJMfBs/TQ7TULu40SI/AAAAAAAABVc/hmfs9aYf1yQ/s000/youtube_icon.png'/></a>
</div>
<!-- begin logo & tagline -->
<div id='logoTag'>
<div id='logo'>
<h1><a href='#'>Zapatos Comodoro</a></h1>
</div>

<div id='tagline' style='width:400px'>
Tu Mejor Elección
</div>
</div>
<!-- end logo & tagline -->
<div class='clear'></div>
<!-- begin top menu -->
<div id='topMenu'>
<a href='http://zapatos-comodoro.es.tl/' id='home'></a>

<div id='topLinks'>
<ul>
<li><a href='http://zapatos-comodoro.es.tl/Inicio.htm' title=''>Inicio</a></li>
<li><a href='http://zapatos-comodoro.es.tl/Contacto.htm' title=''>Contacto</a></li>
</ul>
</div>
<!-- begin search box -->
<form action='#' id='searchform' method='get'>
<input id='s' name='q' onblur='if(this.value==\'\'){this.value=\'search site\'};' onfocus='if(this.value==\'search site\'){this.value=\'\'};' type='text'/>
<input id='searchsubmit' type='submit' value=''/>
</form>

<!-- end search box --></div><!-- end top menu --></div><!-- end header -->
<!-- begin wrapper -->
<div id='wrapper'>
<!-- begin content -->
<div class='clearfix' id='content'>
<!-- begin contentLeft -->
<div id='contentLeft'>
<div class='main section' id='main'><div class='widget Blog' id='Blog1'>



Texto por debajo de la página:
Cita:

<!-- end colRight -->
</div>
<!-- end sidebarBox -->
<!-- begin footer -->
</div>
<div id='footer'>
<div class='aligncenter'>Copyright © Zapatos Comodoro | <strong><font color="orange">Template Adapted By <a href='http://templatecss.es.tl/'>TEmplatECSS</a> | Powered By <a href='http://templatecss.es.tl/'>TEmplatECSS</a> | Hosted At <a href="http://es.tl/">PwG</a></font></strong></div><div class='clear'></div>
</div>
<!-- end content -->
<!-- end wrapper -->
<!-- end footer -->
</body>
</html>



CSS-Code
sin Style Tags:

Cita:

table {margin-left:auto;margin-right:auto;}

#pre_header {display: none;}
#post_header {display: none;}
#header_container {display: none;}
lli.nav_element{display: none;}
li.nav_element a{display: none;}
h1#title{display: none;}
h2#title span {display: none;}
#title {display: none;}
#nav_container {display:none;}

/*
<---------------Template By TEmplatECSS.es.tl--------------->
*/


/*
------------------------------------------------------
Name : Reezy Mag
------------------------------------------------------*/
#navbar-iframe{display:none;}
body#layout #slideshow{display:none}
body#layout #home{display:none}
* { margin: 0; padding: 0; }
/*----------------------------------------------------
{--------} Generic {--------}
----------------------------------------------------*/
body{
font-weight:normal;
font-family: Arial, Helvetica, sans-serif;
font-size:12px;
color:#636363;
margin:0;
padding:0;
line-height:135%;
background-image:url(images/bodybg.jpg);
}
ul {
list-style:none;
}
a {
text-decoration:none;
border:none;
outline:none;
color:#9b0505;
}
a:hover {
border:none;
text-decoration:underline;
}
img{
border:none;
outline:none;
}
a:focus {
outline:none;
}
p {
margin:3px 0 12px 0;
line-height:20px;
}
/*----------------------------------------------------
{--------} Layout Structure {--------}
----------------------------------------------------*/
#wrapper {
margin:0 auto;
background-image:url(http://2.bp.blogspot.com/_dZM2bJJMfBs/TQ7TPyB73II/AAAAAAAABUY/9jmAOsJb18s/s000/wrapper_bg.png);
width: 1000px;
padding-top: 20px;
margin-top: 30px;
}
/*----------------------------------------------------
{--------} Header {--------}
----------------------------------------------------*/
#header {
background:url(http://2.bp.blogspot.com/_dZM2bJJMfBs/TQ7TQJ5mH0I/AAAAAAAABUc/OMvKBfDLyL4/s000/header_bg.png);
height: 155px;
width: 980px;
margin:0 auto;
position:relative;
z-index:9;
}
/*----------------------------------------------------
{--------} Content {--------}
----------------------------------------------------*/
#content {
margin:0 auto;
padding:0 0 20px;
width:980px;
}
/*----------------------------------------------------
{--------} Content Left {--------}
----------------------------------------------------*/
#contentLeft {
float:left;
margin:5px 0 0 0;
padding:10px 0 0 0;
width:645px;
}
/*----------------------------------------------------
{--------} Logo {--------}
----------------------------------------------------*/
#logoTag {
float:left;
height: 60px;
margin-top: 45px;
margin-left: 30px;
}
#logoTag #logo {
background:url(images/bk_logo_left.png) no-repeat;
float:left;
}
#logoTag #logoImg {
background:none;
padding:0;
float:left;
padding-top:3px;
padding-right:10px;
}
#logoTag #logoImg img {
border:none;
}
#logoTag #logo h1 a {
display:block;
background:url(images/bk_logo_right.png) 100% 0 no-repeat;
font-family: Tahoma,Arial;
font-size: 45px;
color:#ff0000;
float:left;
line-height:100%;
font-weight:normal;
text-transform: uppercase;
margin-top: 10px;
text-shadow: 1px 1px #252525;
}
#logoTag #logo h1 a:hover{
text-decoration:none;
}
#logoTag #tagline {
clear:both;
color:#fff;
float:left;
font:12px Arial;
padding:0;
width:300px;
text-transform: uppercase;
}
/*----------------------------------------------------
{--------} Top Bar {--------}
----------------------------------------------------*/
#top-bar {
height:32px;
padding:0;
width:980px;
}
/*----------------------------------------------------
{--------} Ad Header {--------}
----------------------------------------------------*/
.ad-header {
float:right;
margin:0;
}
/*----------------------------------------------------
{--------} Top Menu {--------}
----------------------------------------------------*/
#topMenu {
position: absolute; top: 148px; left: -13px;
background: url(http://1.bp.blogspot.com/_dZM2bJJMfBs/TQ7TQfxyT0I/AAAAAAAABUg/6xxG2sB_JaE/s000/menu_bg.png);
width: 1005px; height: 58px;
margin: 0 auto;
z-index: 10;
}
#topLinks {
margin-left: 15px;
float: left;
}
/*----------------------------------------------------
{--------} Home Button {--------}
----------------------------------------------------*/
#home {
background-image:url(http://1.bp.blogspot.com/_dZM2bJJMfBs/TQ7TQvTmUXI/AAAAAAAABUk/Z1ocfie1iKQ/s000/home_icon.png);
width: 35px; height: 35px;
display: block;
float: left;
text-indent: -9999px;
margin: 8px 0 0 10px;
}
#topLinks ul li {
display: block;
float: left;
text-transform: uppercase;
font-family: Arial, Helvetica, sans-serif;
font-size: 14px;
line-height: 50px;
padding: 0 10px;
}
#topLinks ul li a {
color: #fff;
line-height: 50px;
display: block;
float: left;
font-weight: normal;
}
#topLinks .current_page_item a {text-decoration: underline;}
#topLinks .current_page_item {}
/*----------------------------------------------------
{--------} Social Link {--------}
----------------------------------------------------*/
#socialLinks {
background:url("images/c-socials-bg.png") no-repeat scroll 0 0 transparent;
float:right;
height:151px;
margin:0;
padding:26px 0 0 8px;
position:fixed;
right:0;
text-align:right;
top:40%;
width:50px;
}
#socialLinks a {
display:block;
float:left;
padding-right:10px;
border:none;
}
#socialLinks a img {
border:medium none;
margin:0 0 10px;
}
/*----------------------------------------------------
{--------} Subscriber Box {--------}
----------------------------------------------------*/
#subscription_box {position: absolute; top: 0; right: 0;}
#subscription_box img { margin: 0 10px 15px 0;}
#subscription_border_bottom {
background-image:url(images/subscription_border_bottom.jpg);
width: 272px; height: 28px;
}
/*----------------------------------------------------
{--------} Content Left Elements {--------}
----------------------------------------------------*/
.searchQuery, #archive-title {
margin: 0 0 15px 18px;
}
.searchQuery strong, #archive-title strong {
font-size:14px;
color:#9b0505;
}
/*----------------------------------------------------
{--------} Content Title {--------}
----------------------------------------------------*/
#contentLeft h1 {
margin:0 0 15px 0;
padding:0;
font-family:Tahoma, "Times New Roman", Times, serif;
font-size:24px;
line-height:110%;
text-decoration:none;
font-weight:normal;
}
/*----------------------------------------------------
{--------} Alignment {--------}
----------------------------------------------------*/
.alignleft {
float:left;
margin:5px 15px 5px 0;
}
.alignright {
float:right;
margin:5px 0 5px 15px;
}
/*----------------------------------------------------
{--------} Content Left Image {--------}
----------------------------------------------------*/
#contentLeft img, #contentLeft a img {
padding:0;
margin:0;
}
/*----------------------------------------------------
{--------} Post Box {--------}
----------------------------------------------------*/
#contentLeft .postBox {
float:left;
margin:0 0 15px 0;
padding:0 0 10px;
position:relative;
width:580px;
color: #6d6d6d;
margin-left: 18px;
padding: 20px;
background: #fff;
border: 1px solid #d5d5d5;
font-family: Arial, Helvetica, sans-serif; font-size: 13px;
}
/*----------------------------------------------------
{--------} Post Page {--------}
----------------------------------------------------*/
.postPage {
color: #6d6d6d;
margin-left: 18px;
padding: 20px;
background: #fff;
border: 1px solid #d5d5d5;
margin-bottom: 25px;
}
/*----------------------------------------------------
{--------} Post Date {--------}
----------------------------------------------------*/
#contentLeft .postDate {
background:url(http://3.bp.blogspot.com/_dZM2bJJMfBs/TQ7TQrKeQ3I/AAAAAAAABUo/6ZBQzjC9SIc/s000/date_icon.png);
background-repeat: no-repeat;
width: 63px; height: 76px;
position: absolute; top: 10px; left: -63px;
text-align: center;
color: #414040;
padding: 13px 0 0 7px;
}
/*-----------------------------------------------------------
{--------} Post Day,Month,Year {--------}
-------------------------------------------------------------*/
.postDate .day {font-size: 27px;}
.postDate .month {font-size: 14px;}
.postDate .year {font-size: 12px;}
/*----------------------------------------------------
{--------} Posting {--------}
----------------------------------------------------*/
.posting{
float:left;
}
/*----------------------------------------------------
{--------} Post Date {--------}
----------------------------------------------------*/
.post-date {
background:url("images/v-post-date-bg.png") repeat scroll 0 0 transparent;
color:#FFFFFF;
height:79px;
left:-63px;
padding:43px 10px 0 0;
position:absolute;
text-align:center;
top:25px;
width:96px;
z-index:9999;
}
/*----------------------------------------------------
{--------} Comment {--------}
----------------------------------------------------*/
.comm {
color:#f3ccfc;
font-size:22px;
font-weight:bold;
margin:20px 0 0;
}
.comm span{
color:#f3ccfc;
font-size:10px;
}
/*----------------------------------------------------
{--------} Author {--------}
----------------------------------------------------*/
.author span{
font-size:10px;
text-transform:uppercase;
font-weight:normal;
}
.author {
color:#f3ccfc;
font-size:12px;
font-weight:bold;
margin:11px 0 0;
}
/*----------------------------------------------------
{--------} AAA {--------}
----------------------------------------------------*/
.aaa{
padding:0 1px;
}
/*-----------------------------------------------5-------
{--------} Top Post Rounded {--------}
--------------------------------------------------------*/
.rounded-post-top{
background:url('images/bo-post-top-rounded.gif') no-repeat;
width:610px;
height:14px;
}
/*--------------------------------------------------------
{--------} Bottom Post Rounded {--------}
----------------------------------------------------------*/
.rounded-post-bottom{
background:url('images/bo-post-bottom-rounded.gif') no-repeat;
width:610px;
height:14px;
margin:0 0 20px 0;
}
/*----------------------------------------------------
{--------} Post Arrow {--------}
----------------------------------------------------*/
.post-arrow {
background:url("images/bo-post-arrow.gif") no-repeat scroll 0 0 transparent;
height:14px;
left:-24px;
position:absolute;
top:28px;
width:24px;
}
/*-------------------------------------------------------
{--------} Read More Button {--------}
--------------------------------------------------------*/
.post-readmore-btn{
margin:15px 0 0 0;
float:right;
}
.post-readmore-btn a{
display:block;
width:123px;
height:37px;
text-indent:-10000px;
}
/*----------------------------------------------------
{--------} Post Entry {--------}
----------------------------------------------------*/
.entry {max-width:575px;
float:left;
line-height: 20px;
padding: 0px 0px 0px 0px;
text-align: justify;line-height: 20px;
font-family: Arial, Verdana;
font-size: 14px;color: #555;
overflow:hidden;
display:inline;
}
/*----------------------------------------------------
{--------} Post Entry Image {--------}
----------------------------------------------------*/
.entry img {
padding: 6px;
background: #000;
max-width:575px;
}
/*----------------------------------------------------
{--------} Post Box Date {--------}
----------------------------------------------------*/
#contentLeft .postBox .date{
float:left;
width:47px;
height:50px;
text-align:center;
padding-right:25px;
}
#contentLeft .postBox .date .month{
color:#ccc;
font-size:10px;
text-transform:uppercase;
padding-bottom:5px;
}
#contentLeft .postBox .date .day {
font-size:20px;
color:#fff;
font-weight:bold;
line-height:130%;
}
/*----------------------------------------------------
{--------} Post Title {--------}
----------------------------------------------------*/
#contentLeft h1 {
border:medium none;
width: 100%;
font-family: "Lao UI",Arial,Verdana;
color: #414040;
font-size:29px;
text-transform: uppercase;
}
#contentLeft h1 a {
padding:0;
font-family: "Lao UI",Arial,Verdana;
color: #414040;
line-height:110%;
text-decoration:none;
font-weight:normal;
border:none;
}
#contentLeft .postBox h1 a:hover{
color:#282828;
}
/*----------------------------------------------------
{--------} Mata Data {--------}
----------------------------------------------------*/
.metadata {
text-transform: uppercase;
color: #979797;
font-size: 12px;
margin-bottom: 10px;
}
.meta-arrow {
height:4px;
left:19px;
position:absolute;
top:-4px;
width:7px;
}
/*----------------------------------------------------
{--------} Read More Link {--------}
----------------------------------------------------*/
#contentLeft .postBox a.more-link {
display:block;
width:90px;
height:24px;
text-align:center;
clear:both;
border:none;
line-height:22px;
margin-top:10px;
}
/*----------------------------------------------------
{--------} Post Social {--------}
----------------------------------------------------*/
#contentLeft .social p {
margin:0 0 10px 0;
}
#contentLeft .social a {
border:none;
}
#contentLeft .social a img {
padding:5px;
border:none;
background:none;
}
#contentLeft .social a:hover img {
}
#contentLeft .social strong {
color:#9b0505;
}
.social {
margin:30px 0 10px;
}
/*----------------------------------------------------
{--------} Banner {--------}
----------------------------------------------------*/
.banner {
float:left;
margin:0 0 0 7px;
}
.banner a {
float:left;
margin:0 20px 20px 0;
}
.banner .right-ad{
margin:0;
}
/*--------------------------------------------------------
{--------} Subscription Box {--------}
---------------------------------------------------------*/
#subscription_box {
padding: 10px 10px 0 10px;
}
#subscription_box img {
margin: 0 10px 15px 0;
}
#subscription_border_bottom {
background-image:url(images/subscription_border_bottom.jpg);
width: 272px; height: 28px;
}
/*--------------------------------------------------------
{--------} Ads 1 {--------}
---------------------------------------------------------*/
.ads1 {
float:right;
margin:55px 20px 0 0;
}
/*--------------------------------------------------------
{--------} Search Forms {--------}
---------------------------------------------------------*/
#searchform {
position:absolute; top: 10px; right: 0;
width:190px;
}
#searchform input {
background:url(http://3.bp.blogspot.com/_dZM2bJJMfBs/TQ7TQz0FZKI/AAAAAAAABUs/TpEP5VhP19k/s000/searchbox_bg.png);
border:medium none;
color:#fff;
float:left;
font-size:12px;
padding:9px 3px 9px 15px;
width:130px;
font-family: Arial, Helvetica, sans-serif;
font-size: 11px;
}
#searchform input#searchsubmit {
background:url(http://3.bp.blogspot.com/_dZM2bJJMfBs/TQ7TRLHc9-I/AAAAAAAABUw/6y-8c39Qf1U/s000/searchbutton.png);
border:medium none;
cursor:pointer;
height:32px;
margin:0;
padding:0;
width:32px;
}
/*----------------------------------------------------
{--------} Sidebar {--------}
----------------------------------------------------*/
#sidebar-wrapper {
float:right;
margin:15px 20px 0 0;
padding:12px 0 0 0;
position:relative;
width:305px;
background: #fff;
border: 1px solid #d5d5d5;
}
/*--------------------------------------------
{--------} Sidebar Title {--------}
--------------------------------------------*/
.sidebar h2 {
color:#414040;
font:normal 19px "Lao UI",Arial,Tahoma,Helvetica,serif;
text-transform:uppercase;
background-image:url(http://4.bp.blogspot.com/_dZM2bJJMfBs/TQ7TRXF4fKI/AAAAAAAABU0/eRVGKtxCCAc/s000/sidebar_title_bg.png);
background-repeat: no-repeat;
width: 265px; height: 26px;
padding: 6px 0 0 25px;
}
/*--------------------------------------------
{--------} Sidebar Widget {--------}
--------------------------------------------*/
.sidebar .widget {
margin: 0 auto;
position:relative;
width:280px;
padding-left: 3px;
color: #8b8b8b;
}
/*----------------------------------------------------------
{--------} Sidebar Widget Content {--------}
-----------------------------------------------------------*/
.sidebar .widget-content {
padding: 5px 10px;
margin-bottom:20px;
}
.sidebar ul {
list-style-type: none;
margin: 0 5px ;
padding: 0;
}
.sidebar li {
color:#6f6f6f;
text-decoration: none;
padding: 0px 0px 0px 0px;
display:block;
border-bottom:1px solid #eee;
list-style-type:none;
line-height:28px;
}
.sidebar li a:link, .sidebar li a:visited {
color:#6f6f6f;;
text-decoration: none;
}
.sidebar li a:hover {
color: #0a65bd;
}
#sidebar ul li a{
margin:0;
padding: 0 0 0 20px;
line-height: 20pt;
list-style-type: square;
background:url(http://4.bp.blogspot.com/_dZM2bJJMfBs/TQ7TRZz0oVI/AAAAAAAABU4/gO-naF7quNY/s000/bullet.png) no-repeat 0 3px;
}
/*----------------------------------------------------------
{--------} Sidebar Widget Image {--------}
-----------------------------------------------------------*/
.sidebar img {
padding: 3px;
border: 1px solid #d5d5d5;
margin: 0 10px 0px 0;
}
/*----------------------------------------------------
{--------} Sidebar Label {--------}
----------------------------------------------------*/
#Label1 ul li{
float: left;
width: 48%;
}
#Label2 ul li{
float: left;
width: 46%;
}
/*----------------------------------------------------
{--------} Blog Archiv {--------}
----------------------------------------------------*/
#BlogArchive1_ArchiveMenu {
border:1px solid #eee;
color:#6f6f6f;;
text-decoration: none;
margin-left:0px;
margin-top:5px;
padding:10px;
width:260px;
}
/*----------------------------------------------------
{--------} Popular Post {--------}
----------------------------------------------------*/
.item-thumbnail {
display:none;
}
/*----------------------------------------------------
{--------} Profile {--------}
----------------------------------------------------*/
#Profile1{
margin-bottom:10px;
}
.profile-link {
display:none;
}
/*--------------------------------------------------------
{--------} Clearing {--------}
---------------------------------------------------------*/
.clearfix:after {
content: ".";
display:block;
height: 0;
clear: both;
visibility: hidden;
}
.clearfix {
display: block;
}
/*--------------------------------------------------------
{--------} Hide From IE Mac {--------}
---------------------------------------------------------*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/*--------------------------------------------------------
{--------} Clear {--------}
---------------------------------------------------------*/
.clear {
clear: both;
}
/*--------------------------------------------------------
{--------} No clear {--------}
---------------------------------------------------------*/
.noclear {
clear: none;
}
/*----------------------------------------------------------
{--------} Thumbnail Background {--------}
------------------------------------------------------------*/
.thumbnail_bg {
background-color: #8f8f8f;
width: 575px; height: 255px;
}
/*--------------------------------------------------------
{--------} Post image Preloader {--------}
---------------------------------------------------------*/
.post-image-prelaoder {
float:left;
margin:0;
width:575px;
height:255px;
margin: -3px 0 0 -3px !important;
}
/*--------------------------------------------------------
{--------} EEE {--------}
---------------------------------------------------------*/
.eee {
float:left;
margin:5px 0 10px;
position:relative;
}
/*--------------------------------------------------------
{--------} Big Comment {--------}
---------------------------------------------------------*/
.big-comm {
background:url("images/bt-post-comm.png") no-repeat scroll 0 0 transparent;
float:right;
height:39px;
margin:0;
padding:3px 5px 0 0;
text-align:center;
width:46px;
}
.big-comm a {
color:#4C4C4C;
display:block;
font:20px Tahoma,Arial,Helvetica,sans-serif;
text-align:center;
text-decoration:none;
text-shadow:1px 1px #FFFFFF;
}
.big-comm a:hover{
text-decoration:none;
color:#404040;
}
/*--------------------------------------------------------
{--------} Slide Show {--------}
---------------------------------------------------------*/
.clearfix:after {visibility: hidden;display: block;font-size: 0;content: " ";clear: both;height: 0;}
* html .clearfix { zoom: 1; } /* IE6 */
*:first-child+html .clearfix { zoom: 1; } /* IE7 */
#slideshow {
margin:0 auto;
position:relative;
width:945px;
height:280px;
background: #fff;
border: 1px solid #d5d5d5;
background-repeat: no-repeat;
margin-top: 20px;
}
#slider {
float:left;
}
.slider-post p{
margin:0;
}
.featured-post{width:945px; background: none !important; height: 280px;}
.slider-image {
width: 924px; height: 262px;
position: relative;
margin: 5px 0 0 7px;
}
.slider-image img { border: 3px solid #fff5e4;}
.slider-post {
color:#fff;
font-size:110% !important;
line-height:1.8em;
font-family: Arial, Helvetica, sans-serif;
font-size: 14px;
position: absolute; top: 140px; left: 20px;
width: 875px; height: 120px;
background-image:url(http://1.bp.blogspot.com/_dZM2bJJMfBs/TQ7TR7__MjI/AAAAAAAABU8/SDlmvhGjo2U/s000/transp_bg.png);
padding: 0 15px;
}
.slider-post h2 {margin: 10px 0 5px 0; line-height: 40px;}
.slider-post h2 a{
color:#fff;
font-family: "Lao UI", Tahoma, Arial;
font-size: 23px; font-weight: normal;
}
.slider-post-meta {background:none repeat scroll 0 0 #113D64;color:#fff;font-size:11px;margin:5px 0 15px;padding:5px;line-height:1.2em}
.slider-post-meta a {color:#BDE9FB;font-style:normal}
.slider-post-meta a:hover {color:#F9D7A4}
.slider_readmore {
background-image:url(images/readmore.png);
display: block;
width: 131px; height: 72px;
line-height: 72px;
text-align: center;
float: right;
margin-top: 20px;
}
.slider_readmore a {font-family: Arial; font-size: 13px; font-weight: bold; color: #540d1c; text-shadow: 1px 1px #ecb873;}
#slider-nav {
bottom:-34px;
position:absolute;
right:47%;
z-index:9;
margin:3px 0 14px;
}
#slider-nav a {
background:url("images/bo-slider-nav.png") no-repeat scroll 0 0 transparent;
display:block;
float:left;
height:21px;
margin-right:1px;
text-indent:-9999px;
width:15px;
}
#featured_tag {
background-image:url(http://4.bp.blogspot.com/_dZM2bJJMfBs/TQ7TR7vzBkI/AAAAAAAABVA/jtQNATRg2vM/s000/featured_tah.png);
width: 33px; height: 77px;
position: absolute; top: -5px; left: 20px;
z-index: 10;
}
div#slider-nav a.activeSlide {background: url(images/bo-slider-nav-active.png) no-repeat;}
.slider-arrow {
position:absolute;
top: 0;
z-index:999;
}
span#prev, span#next{display:block;height:19px;position:absolute;text-indent:-9999px;top:100px;width:63px;}
span#prev {
background:url(http://4.bp.blogspot.com/_dZM2bJJMfBs/TQ7TSKoKNFI/AAAAAAAABVE/auZXntBdvZ8/s000/slider_prev.png) no-repeat scroll 0 0 transparent;
height:76px;
left:-63px;
width:63px;
}
span#next {
background:url(http://3.bp.blogspot.com/_dZM2bJJMfBs/TQ7TSmphhfI/AAAAAAAABVI/-s7j4wzqViw/s000/slider_next.png) no-repeat scroll 0 0 transparent;
height:76px;
left:945px;
width:63px;
}
/*--------------------------------------------------------
{--------} Read More {--------}
---------------------------------------------------------*/
a.readmore span {
display:block;
height:34px;
padding:0 5px 0 10px;
}
.readmore{
background:#F4F9FB;display:block;float:
right;height:34px;line-height:34px;
margin:8px 10px 0 0;
padding-right:9px;
text-shadow: 0 -1px 1px rgba(0,0,0,0.25);
-moz-border-radius:15px;
-khtml-border-radius: 15px;
-webkit-border-radius: 15px;
border-radius: 15px;
-moz-box-shadow: 1px 1px 1px #D5D5D5 inset;
box-shadow: 1px 1px 1px #D5D5D5 inset;
-webkit-box-shadow: 1px 1px 1px #D5D5D5 inset;
}
.readmore:hover{
background:#113D64;
text-shadow:1px 1px 1px #357BC5;color:#fff
}
.socials_btn{
clear:both;
}
/*--------------------------------------------------------
{--------} Essential Style {--------}
---------------------------------------------------------*/
.sf-menu, .sf-menu * {
margin: 0;
padding: 0;
list-style: none;
}
.sf-menu {
line-height: 1.0;
}
.sf-menu ul {
position: absolute;
top: -999em;
width: 10em; /* left offset of submenus need to match (see below) */
}
.sf-menu ul li {
width: 100%;
}
.sf-menu li:hover {
visibility: inherit; /* fixes IE7 'sticky bug' */
}
.sf-menu li {
float: left;
position: relative;
}
.sf-menu a {
display: block;
position: relative;
}
.sf-menu li:hover ul,
.sf-menu li.sfHover ul {
left: 0;
top: 2.5em; /* match top ul list item height */
z-index: 99;
}
ul.sf-menu li:hover li ul,
ul.sf-menu li.sfHover li ul {
top: -999em;
}
ul.sf-menu li li:hover ul,
ul.sf-menu li li.sfHover ul {
left: 10em; /* match ul width */
top: 0;
}
ul.sf-menu li li:hover li ul,
ul.sf-menu li li.sfHover li ul {
top: -999em;
}
ul.sf-menu li li li:hover ul,
ul.sf-menu li li li.sfHover ul {
left: 10em; /* match ul width */
top: 0;
}
/*--------------------------------------------------------
{--------} Demo Skin {--------}
---------------------------------------------------------*/
.sf-menu {
float: left;
margin-bottom: 1em;
}
.sf-menu a {
border-left: 1px solid #fff;
border-top: 1px solid #CFDEFF;
padding: .75em 1em;
text-decoration:none;
}
.sf-menu a, .sf-menu a:visited { /* visited pseudo selector so IE6 applies text colour*/
color: #13a;
}
.sf-menu li {
}
.sf-menu li li {
background: #AABDE6;
}
.sf-menu li li li {
background: #9AAEDB;
}
/*--------------------------------------------------------
{--------} Arrows {--------}
---------------------------------------------------------*/
.sf-menu a.sf-with-ul {
padding-right: 2.25em;
min-width: 1px; /* trigger IE7 hasLayout so spans position accurately */
}
.sf-sub-indicator {
position: absolute;
display: block;
right: .75em;
top: 1.05em; /* IE6 only */
width: 10px;
height: 10px;
text-indent: -999em;
overflow: hidden;
background: url('../images/arrows-ffffff.png') no-repeat -10px -100px; /* 8-bit indexed alpha png. IE6 gets solid image only */
}
a > .sf-sub-indicator { /* give all except IE6 the correct values */
top: .8em;
background-position: 0 -100px; /* use translucent arrow for modern browsers*/
}
/* apply hovers to modern browsers */
a:focus > .sf-sub-indicator,
a:hover > .sf-sub-indicator,
a:active > .sf-sub-indicator,
li:hover > a > .sf-sub-indicator,
li.sfHover > a > .sf-sub-indicator {
background-position: -10px -100px; /* arrow hovers for modern browsers*/
}
/* point right for anchors in subs */
.sf-menu ul .sf-sub-indicator { background-position: -10px 0; }
.sf-menu ul a > .sf-sub-indicator { background-position: 0 0; }
/* apply hovers to modern browsers */
.sf-menu ul a:focus > .sf-sub-indicator,
.sf-menu ul a:hover > .sf-sub-indicator,
.sf-menu ul a:active > .sf-sub-indicator,
.sf-menu ul li:hover > a > .sf-sub-indicator,
.sf-menu ul li.sfHover > a > .sf-sub-indicator {
background-position: -10px 0; /* arrow hovers for modern browsers*/
}
/*---------------------------------------------------------------
{--------} Shadow For All But IE6 {--------}
----------------------------------------------------------------*/
.sf-shadow ul {
background: url('../images/shadow.png') no-repeat bottom right;
padding: 0 8px 9px 0;
-moz-border-radius-bottomleft: 17px;
-moz-border-radius-topright: 17px;
-webkit-border-top-right-radius: 17px;
-webkit-border-bottom-left-radius: 17px;
}
.sf-shadow ul.sf-shadow-off {
background: transparent;
}
/*--------------------------------------------------
{--------} Footer {--------}
---------------------------------------------------*/
#footer {
background:url('http://1.bp.blogspot.com/_dZM2bJJMfBs/TQ7TS9jpSpI/AAAAAAAABVM/IpeT-wgm1rk/s000/r-footer-bg.png') no-repeat top;
color:#868686;
font-size:11px;
margin:0 auto;
padding:20px 0 15px;
position:relative;
width:1000px;
text-align: center;
}
#footerLinks {
position:absolute;
top:12px;
right:0;
}
/*----------------------------------------------------
{--------} Comment {--------}
----------------------------------------------------*/
#commentsbox {
margin-left:5px;
padding:10px;
}
/*----------------------------------------------------------
{--------} Comment Answer Box Title {--------}
-----------------------------------------------------------*/
h3#comments{
font-weight: bold;
font-size: 20px;
padding: 0;
margin: 0 0 15px 0;
padding: 10px;
display: block;
background: #fff;
border: 1px solid #DFDFDF;
-moz-border-radius: 4px;
-khtml-border-radius: 4px;
-webkit-border-radius: 4px;
border-radius: 4px;
}
/*----------------------------------------------------------
{--------} Comment Answer Box Ordered {--------}
-----------------------------------------------------------*/
ol.commentlist {
margin:0px 0 0;
clear:both;
overflow:hidden;
list-style:none;
}
/*----------------------------------------------------------
{--------} Comment Answer Box Ordered List {--------}
-----------------------------------------------------------*/
ol.commentlist li {
margin:5px 0;
line-height:18px;
padding:10px;
border: 1px solid #DFDFDF;
background:#fff;
}
/*-----------------------------------------------------------------------------
{--------} Comment Answer Box Ordered List Comment Author{--------}
-------------------------------------------------------------------------------*/
ol.commentlist li .comment-author {
color:#555;
}
/*----------------------------------------------------------------------------------
{--------} Comment Answer Box Ordered List Comment Author Link A Visited{--------}
----------------------------------------------------------------------------------*/
ol.commentlist li .comment-author a:link,ol.commentlist li .comment-author a:visited{
color:#555;
font-weight:bold;
text-decoration:none !important;
}
/*---------------------------------------------------------------
{--------} Comment Answer Box List Author Fn {--------}
----------------------------------------------------------------*/
ol.commentlist li .comment-author .fn {
color:#555;
}
/*----------------------------------------------------------
{--------} Comment Answer Box Cite Fn {--------}
-----------------------------------------------------------*/
cite.fn{
color:#555;
font-style:normal;
}
/*-------------------------------------------------------------------------
{--------} Comment Answer Box Ordered List Avatar {--------}
--------------------------------------------------------------------------*/
ol.commentlist li .comment-author .avatar{
float:right;
border:1px solid #413E45;
background:#413E45;
padding:3px;
}
/*--------------------------------------------------------------------
{--------} Comment Answer Box Ordered List Mata {--------}
---------------------------------------------------------------------*/
ol.commentlist li .comment-meta{
font-size:10px;
}
/*--------------------------------------------------------------------
{--------} Comment Answer Box Ordered List Commentmata Data {--------}
---------------------------------------------------------------------*/
ol.commentlist li .comment-meta .commentmetadata{
color:#000;
}
/*--------------------------------------------------------------------
{--------} Comment Answer Box Ordered List Mata A {--------}
---------------------------------------------------------------------*/
ol.commentlist li .comment-meta a {
color:#666;
text-decoration:none !important;
}
/*------------------------------------------------------------------------
{--------} Comment Answer Box Ordered List Paragraph {--------}
--------------------------------------------------------------------------*/
ol.commentlist li p {
line-height:22px;
margin-top:5px;
color:#999;
font-size:12px;
}
/*--------------------------------------------------------------------
{--------} Comment Answer Box Ordered List Odd {--------}
---------------------------------------------------------------------*/
ol.commentlist li.odd {
}
/*--------------------------------------------------------------------
{--------} Comment Answer Box Ordered List Even {--------}
---------------------------------------------------------------------*/
ol.commentlist li.even {
}
/*--------------------------------------------------------------------
{--------} Comment Answer Box Ordered List Children {--------}
---------------------------------------------------------------------*/
ol.commentlist li ul.children {
list-style:none;
margin:1em 0 0;
text-indent:0;
}
/*--------------------------------------------------------------------
{--------} Comment Answer Box Ordered List Depth {--------}
---------------------------------------------------------------------*/
ol.commentlist li ul.children li.depth-2 {
margin:0 0 0px 50px;
}
/*--------------------------------------------------------------------
{--------} Comment Answer Box Ordered List Depth {--------}
---------------------------------------------------------------------*/
ol.commentlist li ul.children li.depth-3 {
margin:0 0 0px 50px;
}
/*--------------------------------------------------------------------
{--------} Comment Answer Box Ordered List Depth {--------}
---------------------------------------------------------------------*/
ol.commentlist li ul.children li.depth-4 {
margin:0 0 0px 50px;
}
/*--------------------------------------------------------------------
{--------} Comment Answer Box Ordered List Depth {--------}
---------------------------------------------------------------------*/
ol.commentlist li ul.children li.depth-5 {
margin:0 0 0px 50px;
}
/*----------------------------------------------------
{--------} Comment Answer Box Nav {--------}
-----------------------------------------------------*/
.comment-nav{
padding:5px ;
height:20px;
}
/*------------------------------------------------------------------
{--------} Comment Answer Box Nav Link A Visited {--------}
--------------------------------------------------------------------*/
.comment-nav a:link,.comment-nav a:visited{
color:#E73540;
}
/*----------------------------------------------------------------------
{--------} Comment Answer Box Avatar Image Container {--------}
------------------------------------------------------------------------*/
.avatar-image-container {
float:right;
border: 1px solid #ddd;
padding: 4px;
height:32px;
width:32px;
}
/*----------------------------------------------------------------------
{--------} Comment Answer Box Image Container Image {--------}
-----------------------------------------------------------------------*/
.avatar-image-container img {
background:url(http://www.opendrive.com/files/6532718_pabxK/avatar.png) no- repeat;
height:32px;
width:32px;
}
/*----------------------------------------------------
{--------} Comment Writing Box {--------}
----------------------------------------------------*/
#respond{
padding:10px 10px ;
margin:10px 0px;
border: 1px solid #DFDFDF;
background:#fff;
}
/*------------------------------------------------------
{--------} Comment Writing Box Title {--------}
-------------------------------------------------------*/
#respond h3 {
font-weight: bold;
font-size: 20px;
padding: 0;
margin: 0 0 15px 0;
padding: 10px;
display: block;
background: #fff;
border: 1px solid #DFDFDF;
-moz-border-radius: 4px;
-khtml-border-radius: 4px;
-webkit-border-radius: 4px;
border-radius: 4px;
}
/*-------------------------------------------------------------
{--------} Comment Writing Box Comment Form {--------}
--------------------------------------------------------------*/
#commentform {
padding:10px 20px;
}
/*-------------------------------------------------------------
{--------} Comment Writing Box Comment Form A {--------}
--------------------------------------------------------------*/
#commentform a {
color:#E73540;
}
/*--------------------------------------------------------------------
{--------} Comment Writing Box Comment Form Paragraph {--------}
---------------------------------------------------------------------*/
#commentform p{
margin:5px 0px ;
color:#999;
}
/*-------------------------------------------------------------
{--------} Comment Writing Box Respond {--------}
--------------------------------------------------------------*/
#respond label{
display:block;
padding:5px 0;
color:#999;
}
/*----------------------------------------------------------------------
{--------} Comment Writing Box Respond Label Small {--------}
-----------------------------------------------------------------------*/
#respond label small {
font-size:10px;
}
/*-------------------------------------------------------------
{--------} Comment Writing Box Respond Input {--------}
--------------------------------------------------------------*/
#respond input {
margin-bottom:10px;
padding:5px 5px;
margin:0 10px 10px 0;
background:#fff;
border:1px solid #ddd;
color:#555;
}
/*-------------------------------------------------------------
{--------} Comment Writing Box Input {--------}
--------------------------------------------------------------*/
#commentform input{
width:50%;
}
/*-------------------------------------------------------------
{--------} Comment Writing Box Respond Submit {--------}
--------------------------------------------------------------*/
#respond input#commentSubmit {
width:100px;
padding:3px 5px;
background:#444;
border:1px solid #222;
color:#fff;
margin:10px 0px;
cursor:pointer;
}
/*-------------------------------------------------------------------
{--------} Comment Writing Box Respond Text Area {--------}
--------------------------------------------------------------------*/
textarea#comment{
border:none;
background:#fff;
border:1px solid #ddd;
width:70%;
margin:10px 0px 0px 0px;
padding:5px 5px;
color:#555;
}

-->
Mensaje06-07-2012, 10:24 (UTC)    
Título del mensaje: Re: Como cambiar color de fondo de web en CSS

hola, la parte para cambiar el color de fondo es:
Cita:
body{
font-weight:normal;
font-family: Arial, Helvetica, sans-serif;
font-size:12px;
color:#636363;
margin:0;
padding:0;
line-height:135%;
background-image:url(images/bodybg.jpg);


logicamente debes subir la imagen, debe empezar por http, y terminar por el tipo de formato, jpg, png, gif
______________

>las cuestiones de problemas con webs se atienden en el foro.
>Ticket a: ayuda@paginawebgratis.es -- Reportes a: support-es@webme.com
Mensaje06-07-2012, 22:44 (UTC)    
Título del mensaje: Re: Como cambiar color de fondo de web en CSS

javidj escribió:
hola, la parte para cambiar el color de fondo es:
Cita:
body{
font-weight:normal;
font-family: Arial, Helvetica, sans-serif;
font-size:12px;
color:#636363;
margin:0;
padding:0;
line-height:135%;
background-image:url(images/bodybg.jpg);


logicamente debes subir la imagen, debe empezar por http, y terminar por el tipo de formato, jpg, png, gif


Gracias, me sirvio
Mostrar mensajes anteriores:   


Powered by phpBB © 2001, 2005 phpBB Group