M2M - poradnik jak zmienic style

342 views
255 views

Published on

0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
342
On SlideShare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
1
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

M2M - poradnik jak zmienic style

  1. 1. Jak zmienić style CSS w widgetach Money2Money?
  2. 2. 01 Ostylowanie widgetu zestawień .combination_box .box { ... } .combination_box .box, .combination_box .box h2 { ... } .combination_box .ul-1 li { ... } .combination_box .ul-2 li a { ... } .combination_box .imp_link1 { ... } www.money2money.com.pl .combination_box .blok { ... } 2
  3. 3. 01 Ostylowanie widgetu zestawień Aby zmienić domyślny wygląd zestawień należy wygenerować kod z zaznaczeniem „Wyłącz style CSS”. 3 www.money2money.com.pl
  4. 4. 01 Następnie kopiujemy kod i wklejamy go na stronę. W celu ustawienia wyglądu kliknij w link „Pobierz domyślny kod CSS”. Otworzy się okienko z kodem, który należy skopiować. Ostylowanie widgetu zestawień 4 www.money2money.com.pl Skopiowany kod należy wstawić u siebie na stronie pomiędzy znacznikami <style> lub dodać do zewnętrznego pliku css. Oczywiście kod ten możesz dostosować do własnych potrzeb.
  5. 5. 02 Domyślne style CSS .combination_box .box, .combination_box .box .h2 { zoom:1 } .combination_box .box ul, .combination_box .box li { list-style: none; } .combination_box .box img { border:0; } .combination_box .box { padding: 10px; font:400 14px Arial; border: 1px solid #ddd; margin-bottom: 1em; background: -moz-linear-gradient(top, rgba(234,234,234,0.65) 0%, rgba(255,255,255,0) 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(234,234,234,0.65)), color-stop(100%,rgba(255,255,255,0))); background: -webkit-linear-gradient(top, rgba(234,234,234,0.65) 0%,rgba(255,255,255,0) 100%); background: -o-linear-gradient(top, rgba(234,234,234,0.65) 0%,rgba(255,255,255,0) 100%); background: -ms-linear-gradient(top, rgba(234,234,234,0.65) 0%,rgba(255,255,255,0) 100%); background: linear-gradient(to bottom, rgba(234,234,234,0.65) 0%,rgba(255,255,255,0) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a6eaeaea', endColorstr='#00ffffff',GradientType=0 ); } www.money2money.com.pl 5
  6. 6. 02 Domyślne style CSS .combination_box .blok { padding:0; margin-bottom: 10px; border-bottom: 1px solid #ccc; } .combination_box .logotyp img { line-height:0; float:left; margin:0 10px 10px; } .combination_box .h2 { padding:26px 0 0 0; font:700 16px Arial; margin: 0 0 12px; min-height: 53px; border-bottom: 1px solid #eee; } .combination_box .ul-1 { clear: both; padding: 0; margin: 0 0 1em; } .combination_box .ul-1 li { background: url(http://direct.money.pl/d/new_template/default/i/li_1.gif) 0 8px no-repeat; font: 400 12px/18px Arial; padding: 0 0 0 10px; } www.money2money.com.pl .combination_box .ul-2 { clear:both; padding:0; margin:0 0 5px; } 6
  7. 7. 02 Domyślne style CSS .combination_box .ul-2 li { display: inline-block; margin-right: 10px; } .combination_box .ul-2 li a { font: 700 12px/18px Arial; color: #fff; text-decoration: none; display: inline-block; background: #777; padding: 5px 15px; margin-bottom: 5px; border-radius: 2px; } .combination_box .ul-2 li a:hover { background:#999; } .combination_box .imp_link1 { float: left; text-decoration: none; color: #333; font:700 12px/18px Arial; margin-right: 10px; } .combination_box br { clear:both; height:1px; line-height:0; } www.money2money.com.pl .combination_box .m2m_combination_porownanie a { background: #777777; border-radius: 2px; color: #FFFFFF; 6
  8. 8. 02 Domyślne style CSS } display: inline-block; font: 700 12px/18px Arial; margin-bottom: 5px; padding: 5px 15px; text-decoration: none; float: right; .combination_box .box1.pad20.chatBox { padding: 0 20px 1em; } .combination_box .box1.pad20.chatBox img { width:100%;} 6 www.money2money.com.pl
  9. 9. Masz wątpliwości? Pytania? Zapraszamy do kontaktu: m2m@firma.money.pl

×