Jak zmienic kolor stylu (tła)

Dyskusje na temat modyfikowania i tworzenia stylów do phpBB 3.0.x oraz spraw związanych z szablonami, motywami i zestawami obrazków.
Zablokowany
sa
Posty: 10
Rejestracja: 10 marca 2006, 21:34

Jak zmienic kolor stylu (tła)

Post autor: sa » 26 kwietnia 2012, 17:39

Witam, nie wiem jak mam zmienić kolor stronki.

Interesowała by mnie zmiana koloru:
1. Napisów
2. Tło białe
Załączniki
stronka.png
SS jak by to miało wyglądać
(125.53 KiB) Pobrany 1529 razy
Na górę
sa
Posty: 10
Rejestracja: 10 marca 2006, 21:34

Re: Jak zmienic kolor stylu (tła)

Post autor: sa » 26 kwietnia 2012, 17:56

oto moj plik.css

Kod: Zaznacz cały

/* General page style. The scroll bar colours only visible in IE5.5+ */
body { 
background-color:		#1c1c1c;
margin: 2px;
text-shadow: 1px 1px 1px #000; color: #fff;

}

.avatar { width: 35px; height: 35px; border: 1px solid #323232; padding: 3px;  -moz-border-radius: 5px; border-radius: 5px; }

.avatarr { width: 40px; height: 40px; border: 1px solid #323232; padding: 3px;  -moz-border-radius: 5px; border-radius: 5px; }


.dig {
-moz-border-radius-topright: 8; 
-moz-border-radius-topleft: 8; 
-webkit-border-radius-topleft: 8; 
-webkit-border-radius-topright: 8; 
border-top: 1px solid #444444;
border-right: 1px solid #444444;
border-left: 1px solid #444444; 
margin-top: -30px;
background-color:		#2f2f2f;
position: absolute; 
right: 53px;
 padding: 6px;
width: 45px; height: 22px;
}

/* General font families for common tags */
font,th,td,p			{ font-family: Verdana, Arial, Helvetica, sans-serif; }
a:link,a:active,a:visited	{ color : #fff; }
p, td			{ font-size : 11px; color : #cacaca; }
a:hover			{ text-decoration: underline; color : #f6ad4f; }
hr				{ height: 0px; border: solid #323232 0px; border-top-width: 1px; }

ol,ul { list-style:none; }

/* This is the border line & background colour round the entire page */
.bodyline {  }



.forumline .przycisk {
    position:absolute;
    right: 5px;

    vertical-align:middle;
    margin:0px;
    cursor: pointer;
}

.side{
	background-color: #658e3c;

	
	right: -15px;
margin-top: 25px;
text-align: center;	
	padding: 9px 0px;
	height: 11px;
	width: 13px;
	/*right: 4px;*/
	font-size: 13px;  font-family:  Helvetica, sans-serif;
	position: relative;
	outline: 0;
	border-radius: 0px 3px 3px 0px;
	-moz-border-radius: 0px 3px 3px 0px;
	-webkit-border-top-right-radius: 3px;
	-webkit-border-bottom-right-radius: 3px;
}


/* This is the outline round the main forum tables */
.forumline { background-color: #323232;  border: solid #1f1f1f 1px; }
.forumline1 {background-color: #323232;  border: solid #1f1f1f 1px; }
#header {border-bottom: 1px solid #272727;}

	#secondary_nav {
	overflow: hidden;
	color: #f6ad4f;

	font-family: Verdana, Arial, Helvetica, sans-serif; 
     font-size: 10px;
	padding: -5px 15px 7px 25px;
	clear: both;
	border-bottom: 1px solid #363636;
	border-top: 1px solid #363636;
	background: #1d1d1d url(images/secondary_nav.gif) repeat-x 0 0;
	font-weight: bold;
}

#ogolny 
{	
	width: auto !important;
}
.buttons, .clickedbuttons{
    width: 16px;
    height: 16px;
    display: block;
    cursor: pointer;
	font-size: 14px;
    margin-bottom: 5px;
}
.clear {
	clear:both;
}


.welcome {
	background: transparent url(images/bg-header.png) repeat-x top left;
	box-shadow: 0 1px 0 rgba(255,255,255, 0.1), inset 0 1px 15px rgba(0,0,0, 0.7);
	-webkit-box-shadow: 0 1px 0 rgba(255,255,255, 0.1), inset 0 1px 15px rgba(0,0,0, 0.7);
	-moz-box-shadow: 0 1px 0 rgba(255,255,255, 0.1), inset 0 1px 15px rgba(0,0,0, 0.7);
	padding: 15px;
	margin: 10px;
	border-radius: 6px 6px 6px 6px;
	-moz-border-radius: 6px 6px 6px 6px;
	-webkit-border-bottom-left-radius: 6px;
	-webkit-border-bottom-right-radius: 6px;
	-webkit-border-top-left-radius: 6px;
	-webkit-border-top-right-radius: 6px;
	color: #828282;
	text-shadow: -1px -1px 0 #000;
	font-size: 1.1em;
	line-height: 1.5em;
}

.welcome span {
	font-weight: bold;
	color: #ababab;
}

.welcome p {
	display: inline;
}



#user_bar{
	
height: 32px;
	font-weight: bold;
	font-size: 12px;
font-family: Helvetica, sans-serif;
border: 1px solid #7ca4c5;
	border-right: 0;
	position:relative;
	float:right;
	 
top: 40px;
	right: 35px;
	background: #57769a;
border-radius: 0px 3px 3px 0px;
	-moz-border-radius: 3px;
	
}		

#user_links a:hover{
	background-color: #6c89ac;
}




#user_links a{
	float: left;
	padding: 0px 10px;
	line-height: 32px;
	display: block;
	color: #fff;
	text-decoration: none;
	height: 32px;
	border-right: 1px solid #7ca4c5;
	background: #57769a url(images/gradient_bg.png) repeat-x 0 50%;
}

#primary_nav ul li a:link span,
	#primary_nav ul li a:visited span,
	#primary_nav ul li a:hover span,
	#primary_nav ul li a:active span {
		padding: 0px 12px 0px 7px;
		display: block;
		line-height: 35px;
		background: transparent url(images/tab.png) no-repeat top right;
	}
	
	#primary_nav ul li a:hover{
		background-position: 0 -43px;
	}
	#primary_nav ul li a:hover span{
		background-position: 100% -43px;
		color: #fff;
	}


#user_links{
	float: left;
	overflow: hidden;
	line-height: 32px;
	font-size: 0.9em;

}


/* HEADER */

h1, #content_jump {
	text-indent: -9999px;
	height: 0px;
	width: 0px;
}

#fora {width:95%; height:auto; padding:0; margin:0 auto; }



#banner{
	height: 115px;
	background: #212121 url(images/banner_bg.gif) repeat-x top;
}

#branding {
	background: url(images/top.png) no-repeat 0 0;
	height: 115px;
}

.quote{width:90%;margin:0 auto;padding:10px 0px}.quote .name{font-size:10px;margin-top:8px;margin-left:32px;font-family:Tahoma,sans-serif,arial,helvetica;color:#808080}

.quote .name span{font-size:13px;font-weight:bold;color:#fff}
.quote .bb{border:1px solid #1f1f1f;position:relative;font-size:11px;color:#fff;



background: #262626 url(images/row2alt.gif) repeat-x 0 100%; border-top-width: 1px; border-top-style: solid; border-top-color: #323232;


padding:10px;width:100%;-moz-border-radius:7px;border-radius:7px;-webkit-box-shadow:1px 1px 40px #202020;-moz-box-shadow:1px 1px 40px #202020;box-shadow:1px 1px 40px #202020}
.quote .quote 
.arrow{position:absolute;left:40px;bottom:-8px;background:transparent url() no-repeat scroll 0;width:15px;height:8px}
.image{position:absolute;right:5px;top:0px;background:transparent url(images/quote.png) no-repeat scroll 0;width:30px;height:30px}

/************************************************************************/
/* TOPIC/POST BUTTONS STYLES */


.topic_buttons li {
	background: transparent url(images/topic_button.png) no-repeat top left;
	
	float: left;
	font-weight: bold;
	text-shadow: #5e892c 1px 1px 1px;
font-family: Verdana, Arial, Helvetica, sans-serif; 
     font-size: 11px;
}


		.topic_buttons li:hover a {
			background: transparent url(images/topic_button.png) no-repeat 100% -48px;
			text-decoration: none;
		}	
	

		
		.topic_buttons li:hover {
		background: transparent url(images/topic_button.png) no-repeat 0 -48px;
	}
	
	
	.topic_buttons li a,
	.topic_buttons li span {
		text-decoration: none;
		color: #fff;
		font-size: 0.9em;
		display: block;
		margin: auto 0px auto 6px;
		outline: 0;
	}
	
	.topic_buttons li span {
		padding: 9px 12px 10px 3px;
	}
	
	.topic_buttons li a {
		background: transparent url(images/topic_button.png) no-repeat top right;
		padding: 9px 12px 9px 3px;
	}



/* Navigation */

#primary_nav {
	font-size: 10px;
	height: 45px;
position: relative;
margin-top: -45px;
font-family: Verdana, Arial, Helvetica, sans-serif; 
}

	#primary_nav ul{
		padding-left: 40px;
		list-style-type: none;
	 
}

	#primary_nav ul li{
		display:inline;
		margin:0;
		padding:0;
	}

	#primary_nav ul li a:link,
	#primary_nav ul li a:visited,
	#primary_nav ul li a:hover,
	#primary_nav ul li a:active {
		color: #d1d1d1;
		text-decoration: none;
		float:left;
		padding-left: 5px;
		font-weight: bold;
		text-shadow: #070707 0px -1px 0px;
		background: transparent url(images/tab.png) no-repeat top left;
		margin-left: 1px;
		outline: none;
	}
	

	#primary_nav ul li a:link span,
	#primary_nav ul li a:visited span,
	#primary_nav ul li a:hover span,
	#primary_nav ul li a:active span {
		padding: 0px 12px 0px 7px;
		display: block;
		line-height: 35px;
		background: transparent url(images/tab.png) no-repeat top right;
	}
	
	#primary_nav ul li a:hover{
		background-position: 0 -43px;
	}
	#primary_nav ul li a:hover span{
		background-position: 100% -43px;
		color: #fff;
	}



#border {
border: 1px solid #536e84;
-webkit-border-top-right-radius: 6px; 
-webkit-border-top-left-radius: 6px; 
-khtml-border-radius-topright: 20px;
-khtml-border-radius-topleft: 20px;
-moz-border-radius-topright: 45px;
-moz-border-radius-topleft: 45px;
}

#borderrr {
border: 1px solid #658e3c;

}


#borderr {
border: 1px solid #658e3c;
-webkit-border-top-right-radius: 6px; 
-webkit-border-top-left-radius: 6px; 
-khtml-border-radius-topright: 20px;
-khtml-border-radius-topleft: 20px;
-moz-border-radius-topright: 45px;
-moz-border-radius-topleft: 45px;
}

#maintest {
	font-size: 13px;  font-family:  Helvetica, sans-serif;
	margin: 0 0 0 15px;
	float: left;
        margin-top: 10;
        color: #fff;
        text-shadow: #395f92 0px -1px 0px;
}

#maintestt {
	
	float: right;
	cursor: pointer;
       margin: 10 15 0 0px;
}


th.ha {
background:	#2f2f2f;
height: 27px;
border: 0px;
color:			#cacaca; font-size: 11px; font-family:  Helvetica, sans-serif;
border-top-width: 1px; border-top-style: solid; border-top-color: #323232;
}

td.haa {
background:	#2f2f2f;
height: 27px;
border: 0px;
border-top-width: 1px; border-top-style: solid; border-top-color: #323232;

}


.header_left{
        background: url(images/header_left.png) no-repeat 0 0;
        min-height: 38px;
}

.header_right{
        background: url(images/header_right.png) no-repeat 100% 0;
        min-height: 38px;
}

.maintitle_base{
        background: #4d6b88 url(images/header_bg.png) repeat-x 0 0;
        min-height: 38px;

        font-family:Verdana; font-weight:bold; font-size:11px; color:#ffffff;
}

.headerr_left{
        background: url(images/header_left_g.png) no-repeat 0 0;
        min-height: 38px;
}

.headerr_right{
        background: url(images/header_right_g.png) no-repeat 100% 0;
        min-height: 38px;
}

.maintitlee_base{
        background: #4d6b88 url(images/header_bg_g.png) repeat-x 0 0;
        min-height: 38px;

        font-family:Verdana; font-weight:bold; font-size:11px; color:#ffffff;
}




/* Main table cell colours and backgrounds */
td.row1 { background: #292929 url(images/row2.gif) repeat-x 0 100%; border-top-width: 1px; border-top-style: solid; border-top-color: #323232; }
td.row2 { background: #262626 url(images/row2alt.gif) repeat-x 0 100%; border-top-width: 1px; border-top-style: solid; border-top-color: #323232;  }
td.row3 { background: #292929 url(images/row2.gif) repeat-x 0 100%; border-top-width: 1px; border-top-style: solid; border-top-color: #323232; }
td.row4 { background: #292929 url(images/row2.gif) repeat-x 0 100%; border-top-width: 1px; border-top-style: solid; border-top-color: #323232; }
td.row5 { background: #262626 url(images/row2alt.gif) repeat-x 0 100%; border-top-width: 1px; border-top-style: solid; border-top-color: #323232;  }

td.row6 { background: #292929 url(images/row2.gif) repeat-x 0 100%; border-top-width: 1px; border-top-style: solid; border-top-color: #323232; border: 1px solid #658e3c; border-radius:5px;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;}



td.row_helped {  background: #292929 url(images/row2.gif) repeat-x 0 100%; border-top-width: 1px; border-top-style: solid; border-top-color: #323232; }

/*
	This is for the table cell above the Topics, Post & Last posts on the index.php page
	By default this is the fading out gradiated silver background.
	However, you could replace this with a bitmap specific for each forum
*/
td.rowpic {
background-color: #FFFFFF;
background-image: url('images/cellpic2.jpg');
background-repeat: repeat-y; height: 22px;
}

/* Header cells - the blue and silver gradient backgrounds */
th {
color:			#fff; font-size: 11px; font-weight: bold;
text-shadow: #395f92 0px -1px 0px;
background-color:	#fff;
 background: #4d6b88 url(images/header_bg.png) repeat-x 0 0;
        height: 38px;
}


td.catHead,td.catSides,td.catLeft,td.catRight,td.catBottom {
background:	#2f2f2f; border-style: solid; height: 28px;
}

/*
	Setting additional nice inner borders for the main table cells.
	The names indicate which sides the border will be on.
	Don't worry if you don't understand this, just ignore it :-)
*/
td.cat,td.catHead,td.catBottom { background:	#2f2f2f; height: 22px; }
th.thHead,th.thSides,th.thLeft,th.thRight,th.thBottom {
font-weight: bold; border: #FFFFFF; height: 28px;
}

th.thCornerL,th.thTop,th.thCornerR {color: #fff; font-size: 70%; font-weight: bold; 
background-color: #fff;  background: #4d6b88 url(images/header_bg.png) repeat-x 0 0;
        height: 38px; text-shadow: #395f92 0px -1px 0px;}

td.row3Right,td.spaceRow { background-color: #212121;  border-top-width: 1px; border-top-style: solid; border-top-color: #444444; }

th.thHead,td.catHead			{ font-size: 12px; border-width: 0px; }
th.thSides,td.catSides,td.spaceRow	{ border-width: 0px; }
th.thRight,td.catRight,td.row3Right	{ border-width: 0px; }
th.thLeft,td.catLeft			{ border-width: 0px; }
th.thBottom,td.catBottom		{ border-width: 0px; }
th.thTop				{ border-width: 0px; }
th.thCornerL				{ border-width: 0px; }
th.thCornerR				{ border-width: 0px; }

/* The largest text used in the index page title and toptic title etc. */
.maintitle {
font-weight: bold; font-size: 22px; font-family: "Trebuchet MS",Verdana, Arial, Helvetica, sans-serif;
text-decoration: none; line-height : 120%; color : #cacaca;
}

/* General text */
.gen						{ font-size : 12px; }
.genmed					{ font-size : 11px; }
.gensmall					{ font-size : 10px; }
.gen,.genmed,.gensmall			{ color : #cacaca; }
a.gen,a.genmed,a.gensmall			{ color: #fff; text-decoration: none; }
a.gen:hover,a.genmed:hover,a.gensmall:hover	{ color: #f6ad4f; text-decoration: underline; }

/* The register, login, search etc links at the top of the page */
.mainmenu		{ font-size : 11px; color : #cacaca; }
a.mainmenu		{ text-decoration: none; color : #fff; }
a.mainmenu:hover	{ text-decoration: underline; color : #f6ad4f; }

/* Forum category titles */
.cattitle		{ font-weight: bold; font-size: 12px ; letter-spacing: 1px; color : #fff;}
a.cattitle		{ text-decoration: none; color : #fff; }
a.cattitle:hover	{ text-decoration: underline; }

/* Forum title: Text and link to the forums used in: index.php */
.forumlink		{ font-weight: bold; font-size: 12px; color : #fff; }
a.forumlink		{ text-decoration: none; color : #fff; }
a.forumlink:hover	{ text-decoration: underline; color : #f6ad4f; }

/* Used for the navigation text, (Page 1,2,3 etc) and the navigation bar when in a forum */
.nav		{ font-weight: bold; font-size: 11px; color : #000000;}
a.nav	{ text-decoration: none; color : #fff; }
a.nav:hover	{ text-decoration: underline; }

/* titles for the topics: could specify viewed link colour too */
.topictitle,h1,h2	{ font-weight: bold; font-size: 11px; color : #cacaca; }
a.topictitle:link	{ text-decoration: none; color : #fff; }
a.topictitle:visited	{ text-decoration: none; color : #fff; }
a.topictitle:hover	{ text-decoration: underline; color : #f6ad4f; }

/* Name of poster in viewmsg.php and viewtopic.php and other places */
.name { font-size : 11px; color : #cacaca; text-decoration: none;}

/* Location, number of posts, post date etc */
.postdetails		{ font-size : 10px; color : #cacaca; }

/* The content of the posts (body of text) */
.postbody		{ font-size : 12px; line-height: 18px; }
a.postlink:link	{ text-decoration: none; color : #fff; }
a.postlink:visited	{ text-decoration: none; color : #fff; }
a.postlink:hover	{ text-decoration: underline; color : #f6ad4f; }

/* Quote & Code blocks */


/* Copyright and bottom info */
.copyright		{ font-size : 10px; color: #444444; font-family: Verdana, Arial, Helvetica, sans-serif; }
a.copyright		{ text-decoration: none; color : #fff; }
a.copyright:hover	{ text-decoration: underline; color : #f6ad4f; }

/* Form elements */

form { margin: 0; }
form { display: inline; }

input,textarea, select {
color : #686868;
font: normal 11px Verdana, Arial, Helvetica, sans-serif;
}

/* The text input fields background colour */
input.post, textarea.post, select			{ 
background: transparent url() repeat-x top left;
color: #9c9c9c;
	font: 11px verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif;
	
	padding:4px 5px;
	outline:0;
	border-radius:3px;
	-moz-border-radius:3px;
	-webkit-border-radius:3px;
	border: 1px solid #464646;
 }
input.post2, textarea.post2, select	{ 
background: transparent url() repeat-x top left;
color: #9c9c9c;
	font: 11px verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif;
	
	padding:4px 5px;
	outline:0;
	border-radius:3px;
	-moz-border-radius:3px;
	-webkit-border-radius:3px;
	border: 1px solid #464646;
}
input						{ text-indent : 2px; }

/* The buttons used for bbCode styling in message post */
input.button {
background: transparent url() repeat-x top left;
color: #9c9c9c;
	font: 11px verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif;
	
	padding:4px 5px;
	outline:0;
	border-radius:3px;
	-moz-border-radius:3px;
	-webkit-border-radius:3px;
	border: 1px solid #464646;
cursor:			pointer;
}

/* The main submit button option */
input.mainoption {
background: transparent url() repeat-x top left;
color: #9c9c9c;
	font: 11px verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif;
	
	padding:4px 5px;
	outline:0;
	border-radius:3px;
	-moz-border-radius:3px;
	-webkit-border-radius:3px;
	border: 1px solid #464646;
cursor:			pointer;
}

/* None-bold submit button */
input.liteoption {
background: transparent url() repeat-x top left;
color: #9c9c9c;
	font: 11px verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif;
	
	padding:4px 5px;
	outline:0;
	border-radius:3px;
	-moz-border-radius:3px;
	-webkit-border-radius:3px;
	border: 1px solid #464646;
cursor:			pointer;
}

/* The main submit button option */
input.mainoption {
background: transparent url() repeat-x top left;
color: #9c9c9c;
	font: 11px verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif;
	
	padding:4px 5px;
	outline:0;
	border-radius:3px;
	-moz-border-radius:3px;
	-webkit-border-radius:3px;
	border: 1px solid #464646;
cursor:			pointer;


}

/* None-bold submit button */
input.liteoption {
background: transparent url() repeat-x top left;
color: #9c9c9c;
	font: 11px verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif;
	
	padding:4px 5px;
	outline:0;
	border-radius:3px;
	-moz-border-radius:3px;
	-webkit-border-radius:3px;
	border: 1px solid #464646;
cursor:			pointer;


}
/* This is the line in the posting page which shows the rollover
	help line. This is actually a text box, but if set to be the same
	colour as the background no one will know ;)
*/
.helpline { background-color: #DEE3E7; border-style: none; }

/* Highlight bad words for moderators instead of censoring them */
span.badwordhighlight { background-color: #FFFF00; }

.topbkg { background: #dbe3ee url(images/cellpic_bkg.jpg) repeat-x }
.topnav { font-size:10px;background: #e5ebf3 url(images/cellpic_nav.gif) repeat-x;color:#f6ad4f;
height: 21px; white-space: nowrap; text-align: center; border: 0px solid #91a0ae; border-width: 1px 0 1px 0; }

.pm { font-size: 11px; text-decoration: none; color: #FF0000; } 

.table0
{
	background-color : #EFEFEF;
	border-bottom-color : #dedede;
	border-bottom-style : solid;
	border-bottom-width : 1;
	border-left-color : #fefefe;
	border-left-style : solid;
	border-left-width : 1px;
	border-right-color : #dedede;
	border-right-style : solid;
	border-right-width : 1px;
	border-top-color : #fefefe;
	border-top-style : solid;
	border-top-width : 1px;
	color : #000000;
	font-size : 10px;
}

.pagination {
	color: #666;
	font-size: 10px;
	font-weight: bold;
	padding: 3px;
    padding-bottom: 4px;
	cursor: pointer;
	text-decoration: none;
}
.pagination a, .pagination a:visited, .pagination a:active {
	background-color: #EAEBEB;
	color: #000;
	border-color: #D4D7DA;
	border: #D4D7DA 1px solid;
	padding: 1px;
	text-decoration: none;
}
.pagination a:hover {
	background-color: #FFF;
	color: #666;
	border-color: #EAECEF;
	border: #EAECEF 1px solid;
	text-decoration: none;
	padding: 1px;
}

/* Import the fancy styles for IE only (NS4.x doesn't use the @import function) */
@import url("formIE.css");
Na górę
Zablokowany

Wróć do „Pomoc”