Mesaje : 416 Varsta : 25 Localizare : Seini
| Subiect: Design elegant pentru citate Mier Apr 30, 2014 2:11 pm |
|
| Bun gasit, In acest tutorial am sa va arat cum puteti realizat un aspect elegant pentru citatele forumului dvs. Tutorialul se aplica versiunilor de forum phpBB3, punBB si Invision, deci haideti sa incepem. Adaugati in: Panou de administrare => Afisare => Imagini si culori => Culori => Foaie de stil css Demonstratie punBB: [Trebuie sa fiti înscris şi conectat pentru a vedea această imagine]PunBB : - Cod:
-
/* Aspect citate pentru forumurile punBB */ .postmain blockquote{ background:none; border:0!important; position:relative; overflow:hidden; min-height:35px!important; margin:10px 0; padding:11px 0 6px 10px; font-size:14px; line-height:18px; color:#504536; font-family:Georgia; font-style:italic; } .postmain blockquote div { margin-top:7px; margin-left:6px; -moz-border-radius:8px; -khtml-border-radius:8px; -webkit-border-radius:8px; border-radius:8px; border:solid 1px #D5DEE5; background:url(http://i58.servimg.com/u/f58/14/80/95/87/spback10.png) bottom left repeat-x #FFF; max-width:91%; padding:15px 20px 10px 23px; position:relative; } .postmain blockquote div:before { content:''; background:url(http://i58.servimg.com/u/f58/14/80/95/87/openq10.png) top left no-repeat transparent; position:absolute; width:16px; height:16px; top:15px; left:3px; } .postmain blockquote div:after { content:''; position:absolute; z-index:100; background:url(http://i58.servimg.com/u/f58/14/80/95/87/closeq10.png) top left no-repeat transparent; width:16px; height:16px; right:4px; bottom:4px; } .postmain blockquote div cite { font-style:normal; font-weight:700; display:block; font-size:13px; color:#fff; background:url(http://i58.servimg.com/u/f58/14/80/95/87/qhm10.png) top left repeat-x transparent; height:32px; position:absolute; z-index:100; top:-15px; text-shadow:#000 1px 1px; left:0px; } .postmain blockquote div cite:before { content:''; position:absolute; z-index:-1; background:url(http://i58.servimg.com/u/f58/14/80/95/87/qho10.png) no-repeat 0 0 transparent; width:31px; height:38px!important; left:-13px; top:0; } .postmain blockquote div cite:after { content:''; background:url(http://i58.servimg.com/u/f58/14/80/95/87/qhc10.png) no-repeat 0 0 transparent; position:absolute; right:-10px; width:10px; height:32px; top:0; } Demonstratie invision si phpBB3: [Trebuie sa fiti înscris şi conectat pentru a vedea această imagine]Invision: - Cod:
-
/* Aspect citate pentru forumurile invision */ blockquote{ background:none; border:0!important; min-height:35px!important; padding:14px 30px 5px 8px; font-size:14px; line-height:17px; color:#504536; font-family:Georgia; font-style:italic; } blockquote div { border-radius:8px; border:solid 1px #B38000; background:url(http://i58.servimg.com/u/f58/14/80/95/87/7699510.jpg) bottom left repeat-x #FFFEF9; max-width:92%; padding:10px 20px 10px 20px; position:relative; } blockquote div:before { content:''; background:url(http://i58.servimg.com/u/f58/14/80/95/87/openq12.png) top left no-repeat transparent; position:absolute; width:11px; height:11px; top:15px; left:3px; } blockquote div:after { content:''; position:absolute; z-index:100; background:url(http://i58.servimg.com/u/f58/14/80/95/87/closeq12.png) top left no-repeat transparent; width:11px; height:11px; right:4px; bottom:2px; }
blockquote div cite { font-style:normal; font-weight:700; display:block; font-size:13px; color:#000; background:url(http://i58.servimg.com/u/f58/14/80/95/87/qhm_210.png) top left repeat-x transparent; height:32px; position:absolute; z-index:100; top:-10px; text-shadow:#fff 1px 1px; left:27px; } blockquote div cite:before { content:''; position:absolute; z-index:-1; background:url(http://i58.servimg.com/u/f58/14/80/95/87/qho_210.png) no-repeat 0 0 transparent; width:31px; height:38px!important; left:-31px; top:0px; } blockquote div cite:after { content:''; background:url(http://i58.servimg.com/u/f58/14/80/95/87/qhc_210.png) no-repeat 0 0 transparent; position:absolute; right:-10px; top:0px; width:10px; height:32px; } PhpBB3: - Cod:
-
/* Aspect citate pentru forumurile phpBB3 */ blockquote blockquote,blockquote blockquote blockquote { background:none; border:0!important; } blockquote{ background:none; border:0!important; position:relative; overflow:hidden; min-height:35px!important; margin:10px 0; padding:14px 0 10px 8px; font-size:14px; line-height:18px; color:#504536; font-family:Georgia; font-style:italic; } blockquote div { margin-top:7px; margin-left:6px; -moz-border-radius:8px; -khtml-border-radius:8px; -webkit-border-radius:8px; border-radius:8px; border:solid 1px #B38000; background:url(http://i58.servimg.com/u/f58/14/80/95/87/7699510.jpg) bottom left repeat-x #FFFEF9; max-width:92%; padding:10px 20px 10px 20px; position:relative; } blockquote div:before { content:''; background:url(http://i58.servimg.com/u/f58/14/80/95/87/openq12.png) top left no-repeat transparent; position:absolute; width:11px; height:11px; top:15px; left:3px; } blockquote div:after { content:''; position:absolute; z-index:100; background:url(http://i58.servimg.com/u/f58/14/80/95/87/closeq12.png) top left no-repeat transparent; width:11px; height:11px; right:4px; bottom:2px; } blockquote div cite { font-style:normal; font-weight:700; display:block; font-size:13px; color:#000; background:url(http://i58.servimg.com/u/f58/14/80/95/87/qhm11.png) top left repeat-x transparent; */ height:32px; line-height:24px; position:absolute; z-index:100; top: -18px; text-shadow:#fff 1px 1px; left:0px; } blockquote div cite:before { content:''; position:absolute; z-index:-1; background:url(http://i58.servimg.com/u/f58/14/80/95/87/qho11.png) no-repeat 0 0 transparent; width:31px; height:38px!important; left:-13px; top:0; } blockquote div cite:after { content:''; background:url(http://i58.servimg.com/u/f58/14/80/95/87/qhc11.png) no-repeat 0 0 transparent; position:absolute; right:-10px; width:10px; height:32px; }
Si asta a fost tot! |
|