Skocz do zawartości

  • 👋 Witaj na MPCForum!

    Przeglądasz forum jako gość, co oznacza, że wiele świetnych funkcji jest jeszcze przed Tobą! 😎

    • ✅ Pełny dostęp do działów i ukrytych treści
    • ✅ Możliwość pisania i odpowiadania w tematach
    • ✅ System prywatnych wiadomości
    • ✅ Zbieranie reputacji i rozwijanie swojego profilu
    • ✅ Członkostwo w jednej z największych społeczności graczy

    👉 Dołączenie zajmie Ci mniej niż minutę – a zyskasz znacznie więcej!

    Zarejestruj się teraz

Jak zrobić logo na stronie ?

BuRaK xx

Przez BuRaK xx
w Kosz

Rekomendowane odpowiedzi

BuRaK xx Bywalec

BuRaK xx

Opublikowano
Bywalec

BuRaK xx

Opublikowano

Witam mam problem ponieważ kolega pomagał mi robić stronę a teraz nie wiem jak zrobić logo a nie wiem co ma do rzeczy wogóle do kodu ta część 

<div id="header-wrapper">
	<div id="header" class="container">
		<div id="logo">
        	<span class="icon icon-cog"></span>

Mógłby mi ktoś pomóc ? Logo to taka jakby śrubka a nie wiem jak to zmienić :C chciałbym coś ala diament :)

Tu macie kod css jest trochę długi więc w spoilerze

 

 

html, body{
height: 100%;
}


body
{
margin: 0px;
padding: 0px;
background: #2056ac;
font-family: 'Questrial', sans-serif;
font-size: 12pt;
color: rgba(0,0,0,.6);
}




h1, h2, h3
{
margin: 0;
padding: 0;
color: #404040;
}


p, ol, ul
{
margin-top: 0;
}


ol, ul
{
padding: 0;
list-style: none;
}


p
{
line-height: 180%;
}


strong
{
}


a
{
color: #2056ac;
}


a:hover
{
text-decoration: none;
}




.container
{
margin: 0px auto;
width: 1200px;
}




/*********************************************************************************/
/* Form Style                                                                    */
/*********************************************************************************/


form
{
}


form label
{
display: block;
text-align: left;
margin-bottom: 0.5em;
}


form .submit
{
margin-top: 2em;
line-height: 1.5em;
font-size: 1.3em;
}


form input.text,
form select,
form textarea
{
position: relative;
-webkit-appearance: none;
display: block;
border: 0;
background: #fff;
background: rgba(255,255,255,0.75);
width: 100%;
border-radius: 0.50em;
margin: 1em 0em;
padding: 1.50em 1em;
box-shadow: inset 0 0.1em 0.1em 0 rgba(0,0,0,0.05);
border: solid 1px rgba(0,0,0,0.15);
-moz-transition: all 0.35s ease-in-out;
-webkit-transition: all 0.35s ease-in-out;
-o-transition: all 0.35s ease-in-out;
-ms-transition: all 0.35s ease-in-out;
transition: all 0.35s ease-in-out;
font-size: 1em;
outline: none;
}


form input.text:hover,
form select:hover,
form textarea:hover
{
}


form input.text:focus,
form select:focus,
form textarea:focus
{
box-shadow: 0 0 2px 1px #E0E0E0;
background: #fff;
}


form textarea
{
min-height: 12em;
}


form .formerize-placeholder
{
color: #555 !important;
}


form ::-webkit-input-placeholder
{
color: #555 !important;
}


form :-moz-placeholder
{
color: #555 !important;
}


form ::-moz-placeholder
{
color: #555 !important;
}


form :-ms-input-placeholder
{
color: #555 !important;
}


form ::-moz-focus-inner
{
border: 0;
}




/*********************************************************************************/
/* Image Style                                                                   */
/*********************************************************************************/


.image
{
display: inline-block;
border: 1px solid rgba(0,0,0,.1);
}


.image img
{
display: block;
width: 100%;
}


.image-full
{
display: block;
width: 100%;
margin: 0 0 3em 0;
}


.image-left
{
float: left;
margin: 0 2em 2em 0;
}


.image-centered
{
display: block;
margin: 0 0 2em 0;
}


.image-centered img
{
margin: 0 auto;
width: auto;
}


/*********************************************************************************/
/* List Styles                                                                   */
/*********************************************************************************/


ul.style1
{
}




/*********************************************************************************/
/* Social Icon Styles                                                            */
/*********************************************************************************/


ul.contact
{
margin: 0;
padding: 2em 0em 0em 0em;
list-style: none;
}


ul.contact li
{
display: inline-block;
padding: 0em 0.10em;
font-size: 1em;
}


ul.contact li span
{
display: none;
margin: 0;
padding: 0;
}


ul.contact li a
{
color: #FFF;
}


ul.contact li a:before
{
display: inline-block;
background: #4C93B9;
width: 40px;
height: 40px;
line-height: 40px;
text-align: center;
color: rgba(255,255,255,1);
}




/*********************************************************************************/
/* Button Style                                                                  */
/*********************************************************************************/


.button
{
display: inline-block;
margin-top: 2em;
padding: 0.8em 2em;
background: #64ABD1;
line-height: 1.8em;
letter-spacing: 1px;
text-decoration: none;
font-size: 1em;
color: #FFF;
}


.button:before
{
display: inline-block;
background: #8DCB89;
margin-right: 1em;
width: 40px;
height: 40px;
line-height: 40px;
border-radius: 20px;
text-align: center;
color: #272925;
}


.button-small
{
}


/*********************************************************************************/
/* Heading Titles                                                                */
/*********************************************************************************/


.title
{
margin-bottom: 3em;
}


.title h2
{
font-size: 2.8em;
}


.title .byline
{
font-size: 1.1em;
color: #6F6F6F#;
}


/*********************************************************************************/
/* Header                                                                        */
/*********************************************************************************/


#header-wrapper
{
overflow: hidden;
background: #2056ac;
}


#header
{
text-align: center;
}


/*********************************************************************************/
/* Logo                                                                          */
/*********************************************************************************/
#logo
{
padding: 8em 0em 4em 0em;
}


#logo h1
{
display: block;
margin-bottom: 0.20em;
padding: 0.20em 0.9em;
font-size: 3.5em;
}


#logo a
{
text-decoration: none;
color: #FFF;
}


#logo span
{
text-transform: uppercase;
font-size: 2.90em;
color: rgba(255,255,255,1);
}


#logo span a
{
color: rgba(255,255,255,0.8);
}






/*********************************************************************************/
/* Menu                                                                          */
/*********************************************************************************/


#menu
{
height: 60px;
}


#menu ul
{
display: inline-block;
padding: 0em 2em;
text-align: center;
}


#menu li
{
display: inline-block;
}


#menu li a, #menu li span
{
display: inline-block;
padding: 0em 1.5em;
text-decoration: none;
font-size: 0.90em;
font-weight: 600;
text-transform: uppercase;
line-height: 60px;
outline: 0;
color: #FFF;
}


#menu li:hover a, #menu li.active a, #menu li.active span
{
background: #FFF;
border-radius: 7px 7px 0px 0px;
color: #2056ac;
}


#menu .current_page_item a
{
}




/*********************************************************************************/
/* Banner                                                                        */
/*********************************************************************************/


#banner
{
padding-top: 5em;
}


/*********************************************************************************/
/* Wrapper                                                                       */
/*********************************************************************************/




.wrapper
{
overflow: hidden;
padding: 0em 0em 5em 0em;
background: #FFF;
}


#wrapper1
{
background: #FFF;
}


#wrapper2
{
overflow: hidden;
background: #F3F3F3;
padding: 5em 0em;
text-align: center;
}


#wrapper3
{
}


#wrapper4
{
}


/*********************************************************************************/
/* Welcome                                                                       */
/*********************************************************************************/


#welcome
{
overflow: hidden;
width: 1000px;
padding: 6em 100px 0em 100px;
text-align: center;
}


#welcome .content
{
padding: 0em 8em;
}


#welcome .title h2
{
}


#welcome a,
#welcome strong
{
}


/*********************************************************************************/
/* Page                                                                          */
/*********************************************************************************/


#page-wrapper
{
overflow: hidden;
background: #2F1E28;
padding: 3em 0em 6em 0em;
text-align: center;
}


#page
{
}


/*********************************************************************************/
/* Content                                                                       */
/*********************************************************************************/


#content
{
float: left;
width: 700px;
padding-right: 100px;
border-right: 1px solid rgba(0,0,0,.1);
}


/*********************************************************************************/
/* Sidebar                                                                       */
/*********************************************************************************/


#sidebar
{
float: right;
width: 350px;
}


/*********************************************************************************/
/* Footer                                                                        */
/*********************************************************************************/


#footer
{
overflow: hidden;
padding: 5em 0em;
background: #E3F0F7;
text-align: center;
}






#footer .fbox1,
#footer .fbox2,
#footer .fbox3
{
float: left;
width: 320px;
padding: 0px 40px 0px 40px;
}


#footer .icon
{
display: block;
margin-bottom: 1em;
font-size: 3em;
}




#footer .title span
{
color: rgba(255,255,255,0.4);
}


/*********************************************************************************/
/* Copyright                                                                     */
/*********************************************************************************/


#copyright
{
overflow: hidden;
padding: 5em 0em;
border-top: 20px solid rgba(255,255,255,0.08);
text-align: center;
}


#copyright p
{
letter-spacing: 1px;
font-size: 0.90em;
color: rgba(255,255,255,0.6);
}


#copyright a
{
text-decoration: none;
color: rgba(255,255,255,0.8);
}


/*********************************************************************************/
/* Newsletter                                                                    */
/*********************************************************************************/


#newsletter
{
overflow: hidden;
padding: 8em 0em;
background: #EDEDED;
text-align: center;
}


#newsletter .title h2
{
color: rgba(0,0,0,0.8);
}


#newsletter .content
{
width: 600px;
margin: 0px auto;
}


/*********************************************************************************/
/* Portfolio                                                                     */
/*********************************************************************************/


#portfolio
{
overflow: hidden;
padding-top: 5em;
border-top: 1px solid rgba(0,0,0,0.2);
}


#portfolio .box
{
text-align: center;
color: rgba(0,0,0,0.5);
}


#portfolio h3
{
display: block;
padding-bottom: 1em;
font-size: 1em;
color: rgba(0,0,0,0.6);
}


#portfolio .title
{
text-align: center;
}


#portfolio .title h2
{
color: rgba(0,0,0,0.8);
}


.column1,
.column2,
.column3,
.column4
{
width: 282px;
}


.column1,
.column2,
.column3
{
float: left;
margin-right: 24px;
}


.column4
{
float: right;
}


/*********************************************************************************/
/* Three Columns                                                                 */
/*********************************************************************************/


#three-column
{
overflow: hidden;
margin-top: 5em;
padding-top: 1em;
border-top: 1px solid rgba(0,0,0,0.2);
text-align: center;
}


#three-column h2
{
margin: 1em 0em;
font-size: 1.5em;
font-weight: 700;
}


#three-column .icon
{
position: relative;
display: block;
margin: 0px auto 0.80em auto;
background: none;
line-height: 150px;
font-size: 4em;
width: 150px;
height: 150px;
border-radius: 100px;
border: 6px solid #67128F;
text-align: center;
color: #FFF;


}


#three-column #tbox1,
#three-column #tbox2,
#three-column #tbox3
{
float: left;
width: 320px;
padding: 80px 40px 80px 40px;
}


#three-column .title
{
text-align: center;
}


#three-column .title h2
{
font-size: 1.60em;
}


#three-column .title .byline
{
padding-top: 0.50em;
font-size: 0.90em;
color: #858585;
}


#three-column .arrow-down
{
border-top-color: #292929;
}




ul.tools
{
margin: 0;
padding: 0em 0em 0em 0em;
list-style: none;
}


ul.tools li
{
display: inline-block;
padding: 0em .2em;
font-size: 4em;
}


ul.tools li span
{
display: none;
margin: 0;
padding: 0;
}


ul.tools li a
{
color: #FFF;
}


ul.tools li a:before
{
display: inline-block;
background: #1ABC9C;
width: 120px;
height: 120px;
border-radius: 50%;
line-height: 120px;
text-align: center;
color: #FFFFFF;
}

 

 

33eHdSv.png

"Apetytu nie mam, nie muszę dużo zjeść
A na przykład twoja łydka przypomina kurzą pierś
Usiądź gdzieś nad miską, naprawdę to banał
Po prostu się skup i tnij poniżej kolana"

BuRaK xx Bywalec

BuRaK xx

Opublikowano
Bywalec

BuRaK xx

  • Autor
Opublikowano

Niechciałbym podawać całego kodu ponieważ strona jest już prawie skończona a niechciałbym aby ktoś go wykorzystał

 

@ Edit 

 

kod css dodałem do pierwszego postu a reszta w kodzie html to nic znaczącego

 

@Edit 2 

 

aha i przydałaby mi się jeszcze pomoc z wstawieniem favicon :)

33eHdSv.png

"Apetytu nie mam, nie muszę dużo zjeść
A na przykład twoja łydka przypomina kurzą pierś
Usiądź gdzieś nad miską, naprawdę to banał
Po prostu się skup i tnij poniżej kolana"

gredier Znawca

gredier

Opublikowano
Znawca

gredier

Opublikowano

Co mam po tym wywnioskować? Widać podstaw nie znasz... To nie jest CSS... Tylko HTML... Masz podać kod CSS odpowiedzialny za tego diva

Tworzę strony internetowe.

Sklepy Minecraft, CMS-y, fora itp.

BuRaK xx Bywalec

BuRaK xx

Opublikowano
Bywalec

BuRaK xx

  • Autor
Opublikowano

Chodzi ci o coś takiego ? 

#header-wrapper
	{
		overflow: hidden;
		background: #2056ac;
	}

#header
	{
		text-align: center;
	}

/*********************************************************************************/
/* Logo                                                                          */
/*********************************************************************************/
	#logo
	{
		padding: 8em 0em 4em 0em;
	}
	
	#logo h1
	{
		display: block;
		margin-bottom: 0.20em;
		padding: 0.20em 0.9em;
		font-size: 3.5em;
	}
	
	#logo a
	{
		text-decoration: none;
		color: #FFF;
	}
	
	#logo span
	{
		text-transform: uppercase;
		font-size: 2.90em;
		color: rgba(255,255,255,1);
	}

	#logo span a
	{
		color: rgba(255,255,255,0.8);
	}

Jeżeli chodzi o coś innego to jeżeli możesz powiedz mi gdzie mogę to znaleźć :)

 

 

@Edit temat do zamknięcia już skumałem o co chodzi i sam poprawiłem :)

33eHdSv.png

"Apetytu nie mam, nie muszę dużo zjeść
A na przykład twoja łydka przypomina kurzą pierś
Usiądź gdzieś nad miską, naprawdę to banał
Po prostu się skup i tnij poniżej kolana"

Zarchiwizowany

Ten temat przebywa obecnie w archiwum. Dodawanie nowych odpowiedzi zostało zablokowane.

Tematy
×
×
  • Dodaj nową pozycję...