Yazar |
Mesaj |
-
wwebw
Aktif Üye
|
19.02.2010, 14:24 (UTC) Mesaj konusu: Formları şekillendirmek |
|
|
1- Yorum Kısmını Şekillendirmek:
1.Adım: Öncelikle yorumların sitemizdeki kodu bu şekildedir;
<form method="POST" action="index.htm#comment">
<table>
<tbody>
<tr style="text-align: left;"><td>İsminiz:</td><td><input type="text" style="width: 150px;" name="modulenter[name]" value=""/></td></tr>
<tr style="text-align: left;"><td>E-mail adresiniz:</td><td><input type="text" style="width: 150px;" name="modulenter[email]" value=""/></td></tr>
<tr style="text-align: left;"><td>Siteniz:</td><td><input type="text" style="width: 150px;" name="modulenter[url2]" value=""/></td></tr>
<tr style="text-align: left;"><td>Mesajın:</td><td><textarea style="width: 250px; height: 100px;" rows="" name="modulenter[text]" id="kommentartext"/></td></tr>
</tbody>
</table>
</form>
2.Adım: Biz burdaki "form"u şekillendirecez...(Bir arkaplan resmi hazırlamamız gerekir.Benim kullandığım: http://img16.imageshack.us/img16/894/yorumkis.gif)
Bunu için bir css kodu hazırlayalım;
Kod: form {
background: url(ArkaplanResimUrl'si) no-repeat ;
padding: 1px;
border: 1px dashed red;
margin-right: 1px}
Bu kodu css kısmına yapıştıralım ve bakalım ne olucak
Bizimki bur resim
Tam Boyut: http://img16.imageshack.us/img16/894/yorumkis.gif
2-Yorum Arkaplanını şekillendirmek:
Bu kodu tasarım üstüne ekle yorumunuz bizim ki gibi olsun. Yani YORUMUNUZ İÇİN TEŞEKKÜRLER.GÖRÜŞÜNÜZ BİZİM İÇİN ÇOK DEĞERLİ.
Kod: <style> #kommentartext { background-image:url(http://img.webme.com/pic/b/bilgi-world/commentt2.jpg); } </style>
Ama siz bu resimi değiştirip yenisini koyabilirsiniz:
http://img.webme.com/pic/b/bilgi-world/commentt2.jpg bunun yerine kendi urlnizi yazabilirsiniz..
3-=>Kutucukları Renklendirme:
Bu kod sayesinde Z.Defteri,Yorum ve Iletişim extralarındaki yorum bölümü hariç butonların renklenmesini sağlayacaktır..
[img]http://img45.xooimage.com/files/8/7/e/ders-181df83.png[img/]
Sitemizdeki Kod:
Kod: <style type="text/css"> input { color: #551A8B; border: 2px dashed #551A8B; padding: 2px; background-image: url(http://img23.xooimage.com/files/6/8/5/yorumkutucuk-181dce6.gif); margin-right: 1px; font-family:Tahoma, "Century Gothic"; font-size:15px; } </style>
Düzelterek Eklemeniz gereken Kod:
Kod: <style type="text/css"> input { color: #Yazı Rengi; border: Kenar Büyüklüğü px dashed #Kenarlık Rengi; padding: Yükseklik px; background-image: url(Arkaplan Resimi); margin-right: 1px; font-family:Tahoma, "Century Gothic"; font-size:Yazı Boyutupx; } </style>
4-Kod Alanını Şekillendirmek:
Kod: table.edit_main_table{width: 100% !important;}
td.edit_main_tr{width: 100% !important;}
table.edit_second_table{width: 100% !important;}
td.edit_header_full{width: 100% !important;}
td.edit_header_full table{width: 100% !important;}
table.edit_third_table{width: 100% !important;}
td.edit_navi_headbg{width: 15% !important;}
table.edit_rechts_tabelle{width: 100% !important;}
td.edit_rechts_bottom{width: 15% !important;}
td.edit_rechts_cbg{width:100%;}
-->
hr { border: 0;
border-top: 1px solid #000;
color: white;}
tt {
background: #F2F2F2 ;
border: dotted 1px #D7D7D7;
padding: 5px 5px 5px 5px;
font-size:12px
}
code {
margin : 4px 8px;
padding : 8px;
text-align : left;
display : block;
overflow : auto;
font : 500 1em/1.5em 'Lucida Console', 'courier new', monospace;
background: #f8f4f1 url(Buraya Sağ Üst Tarafa Gelecek Olan Resim Url) right top no-repeat;
border : 1px dashed #D7C3C3;
}
Ardından resim urlsi bölümünede resminizin url adresini ekleyiniz..
Ardındanda kodu eklemek için şu resmi takip edin.
[img]http://img.webme.com/pic/w/wwebw/untitled.bmp[img/]
NOT: RESİM ALINTIDIR.KENDİMİZE AİT DEĞİLDİR..
Yukarıdaki gibi Computer Code yi tıklayıp; Yazımızı yazdıktan sonra işlem tamamdır.. |
|
↑
|
|
|
-
wwebw
Aktif Üye
|
19.02.2010, 16:19 (UTC) Mesaj konusu: |
|
|
16 görüntü 0 yorum.. |
|
↑
|
|
|
-
roportajtr
Acemi Üye
|
19.02.2010, 16:25 (UTC) Mesaj konusu: |
|
|
Çok Yararlı Bir Paylaşım.Çok Teşekkürler. ______________ |
|
↑
|
|
|
-
wwebw
Aktif Üye
|
19.02.2010, 16:52 (UTC) Mesaj konusu: |
|
|
Tşk.. |
|
↑
|
|
|
-
my-tubee
Aktif Üye
Konum: Kayseri...
|
19.02.2010, 17:00 (UTC) Mesaj konusu: |
|
|
teşekkürler.. ______________ |
|
↑
|
|
|
-
hyperend
Uzman Üye
|
19.02.2010, 18:20 (UTC) Mesaj konusu: |
|
|
dostum bunların hepsini ben paylaştım xd
şu kodu n bile ice blue tasarım kullanırken kaynaktan alındıgı bellidir..
Kod: table.edit_main_table{width: 100% !important;}
td.edit_main_tr{width: 100% !important;}
table.edit_second_table{width: 100% !important;}
td.edit_header_full{width: 100% !important;}
td.edit_header_full table{width: 100% !important;}
table.edit_third_table{width: 100% !important;}
td.edit_navi_headbg{width: 15% !important;}
table.edit_rechts_tabelle{width: 100% !important;}
td.edit_rechts_bottom{width: 15% !important;}
td.edit_rechts_cbg{width:100%;}
-->
hr { border: 0;
border-top: 1px solid #000;
color: white;}
tt {
background: #F2F2F2 ;
border: dotted 1px #D7D7D7;
padding: 5px 5px 5px 5px;
font-size:12px
}
code {
margin : 4px 8px;
padding : 8px;
text-align : left;
display : block;
overflow : auto;
font : 500 1em/1.5em 'Lucida Console', 'courier new', monospace;
background: #f8f4f1 url(Buraya Sağ Üst Tarafa Gelecek Olan Resim Url) right top no-repeat;
border : 1px dashed #D7C3C3;
}
asadas en baştaki table kodları ice blue tasarımını genişletmk için kullanılır... ayrıca kod alanı ile ilgisi yoktu.. ha ayrıca bu kod alanı değildir...kod alanını şekillendirmek değildir. bunu biz yaratıyoruz zaten..
+hr seçicisini ne işi orda demicem ben kodyum zaten...konuyu kilitleyin lütfen ______________ Özel mesajlara bakmıyorum bile... |
|
↑
|
|
|
-
wwebw
Aktif Üye
|
19.02.2010, 20:48 (UTC) Mesaj konusu: |
|
|
Olabilir bir def daha paylaşıyım dedim |
|
↑
|
|
|
-
hyperend
Uzman Üye
|
20.02.2010, 08:14 (UTC) Mesaj konusu: |
|
|
wwebw yazmış: Olabilir bir def daha paylaşıyım dedim
asdas saçmalama :S bu verdiklerinde gereksiz kodlar var...ben paylaştım hem bunları :S ______________ Özel mesajlara bakmıyorum bile... |
|
↑
|
|
|
-
my-tubee
Aktif Üye
Konum: Kayseri...
|
20.02.2010, 08:17 (UTC) Mesaj konusu: |
|
|
hyperend yazmış: wwebw yazmış: Olabilir bir def daha paylaşıyım dedim
asdas saçmalama :S bu verdiklerinde gereksiz kodlar var...ben paylaştım hem bunları :S
haklısın kardeş sen paylaşmıştın.. ______________ |
|
↑
|
|
|
-
mega-ipek
Bedava-Sitem Bağımlısı
|
20.02.2010, 08:41 (UTC) Mesaj konusu: |
|
|
Forum Kirliliği ______________ |
|
↑
|
|
|
-
my-tubee
Aktif Üye
Konum: Kayseri...
|
20.02.2010, 09:08 (UTC) Mesaj konusu: |
|
|
mega-ipek yazmış: Forum Kirliliği
xD ______________ |
|
↑
|
|
|
-
ibrahmgun
Uzman Üye
|
20.02.2010, 09:48 (UTC) Mesaj konusu: |
|
|
Boş boş mesajlar yazıp forumu kirletmeyin...
Ayrıca bu konu paylaşılmıştır...Arama bölümünde araştırmanız gerekirdi... |
|
↑
|
|
|
-
wwebw
Aktif Üye
|
20.02.2010, 11:33 (UTC) Mesaj konusu: |
|
|
Eyy bidaa olmas.. |
|
↑
|
|
|
-
toplistly
Aktif Üye
|
20.02.2010, 11:55 (UTC) Mesaj konusu: |
|
|
güzelmiş wwebw |
|
↑
|
|
|
|