Jak zmienić style CSS w widgetach Money2Money?3 01 Ostylowanie widgetu zestawień Aby zmienić...

9
Jak zmienić style CSS w widgetach Money2Money?

Transcript of Jak zmienić style CSS w widgetach Money2Money?3 01 Ostylowanie widgetu zestawień Aby zmienić...

  • Jak zmienić style CSS w widgetach Money2Money?

  • 2

    01Ostylowanie widgetu zestawień

    www.money2money.com.pl

    .combination_box .box { ... }

    .combination_box .blok { ... }

    .combination_box .box, .combination_box .box h2 { ... }

    .combination_box .ul-2 li a { ... }

    .combination_box .ul-1 li { ... }

    .combination_box .imp_link1 { ... }

  • 3

    01Ostylowanie widgetu zestawień

    www.money2money.com.pl

    Aby zmienić domyślny wygląd zestawień należy wygenerować kod z zaznacze-niem „Wyłącz style CSS”.

  • 01Ostylowanie widgetu zestawień

    www.money2money.com.pl

    4

    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ć.

    Skopiowany kod należy wstawić u siebie na stronie pomiędzy znacznikami lub dodać do zewnętrznego pliku css. Oczywiście kod ten możesz dostosować do własnych potrzeb.

  • 5

    02Domyś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( startColor-str='#a6eaeaea', endColorstr='#00ffffff',GradientType=0 );}

    www.money2money.com.pl

    .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/defaul-t/i/li_1.gif) 0 8px no-repeat; font: 400 12px/18px Arial; padding: 0 0 0 10px;}

    .combination_box .ul-2 { clear:both; padding:0; margin:0 0 5px; }

    .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;}

    .combination_box .m2m_combination_porownanie a { background: #777777; border-radius: 2px; color: #FFFFFF;

    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%;}

  • 02Domyślne style CSS

    www.money2money.com.pl

    6

    .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( startColor-str='#a6eaeaea', endColorstr='#00ffffff',GradientType=0 );}

    .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/defaul-t/i/li_1.gif) 0 8px no-repeat; font: 400 12px/18px Arial; padding: 0 0 0 10px;}

    .combination_box .ul-2 { clear:both; padding:0; margin:0 0 5px; }

    .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;}

    .combination_box .m2m_combination_porownanie a { background: #777777; border-radius: 2px; color: #FFFFFF;

    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%;}

  • .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( startColor-str='#a6eaeaea', endColorstr='#00ffffff',GradientType=0 );}

    .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/defaul-t/i/li_1.gif) 0 8px no-repeat; font: 400 12px/18px Arial; padding: 0 0 0 10px;}

    .combination_box .ul-2 { clear:both; padding:0; margin:0 0 5px; }

    02Domyślne style CSS

    www.money2money.com.pl

    .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;}

    .combination_box .m2m_combination_porownanie a { background: #777777; border-radius: 2px; color: #FFFFFF;

    6

    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%;}

  • .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( startColor-str='#a6eaeaea', endColorstr='#00ffffff',GradientType=0 );}

    .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/defaul-t/i/li_1.gif) 0 8px no-repeat; font: 400 12px/18px Arial; padding: 0 0 0 10px;}

    .combination_box .ul-2 { clear:both; padding:0; margin:0 0 5px; }

    .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;}

    .combination_box .m2m_combination_porownanie a { background: #777777; border-radius: 2px; color: #FFFFFF;

    02Domyślne style CSS

    www.money2money.com.pl

    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

  • Zapraszamy do kontaktu: [email protected]

    Masz wątpliwości? Pytania?