Menu
Neler Yeni
Üye mesajlarında:
Filtreler

HTML Sayfası içinde html kodlarını nasıl gösterebilirim?

iamkirimli

iamkirimli

80+
Katılım
16 Eylül 2020
Mesajlar
146
Dahası  
Reaksiyon skoru
41
İsim
Mehmet Ali Kırımlı
CSS kodlarını unutmamak için kendim bakabileceğim bir sayfa yapıcam fakat html kodlarını sayfa içerisinde nasıl gösterebilirim? <p></p> veya herhangi bir tag içerisinde yazdığımda onları sayfa içinde normal bir kodmuş gibi gösteriyor ben onları yazı gibi göstermesini istiyorum.

mesela;

html dosyasına başka bir css dosyasını entegre etmek için <link rel="stylesheet" href="..."> kodu kullanılır

*<html>
<head>
<link rel="stylesheet" href="style.css">
</head>
<body>
<p>Merhaba!</p>
</body>
</html>

burda ki tagları kendi sayfa içi yapısı gibi görüyo öyle olmasını istemiyorum.
 
En İyi Cevap
SorryImSoBussy
iamkirimli yazmış:
CSS kodlarını unutmamak için kendim bakabileceğim bir sayfa yapıcam fakat html kodlarını sayfa içerisinde nasıl gösterebilirim? <p></p> veya herhangi bir tag içerisinde yazdığımda onları sayfa içinde normal bir kodmuş gibi gösteriyor ben onları yazı gibi göstermesini istiyorum.

mesela;

html dosyasına başka bir css dosyasını entegre etmek için <link rel="stylesheet" href="..."> kodu kullanılır

*<html>
<head>
<link rel="stylesheet" href="style.css">
</head>
<body>
<p>Merhaba!</p>
</body>
</html>

burda ki tagları kendi sayfa içi yapısı gibi görüyo öyle olmasını istemiyorum.
Devamı için tıklayın...
Bir yazı alanı oluşturmalısın. Editör içerisinde şayet text area create etmeden kod girişi yaparsan (direkt olarak body içerisine...
Tarihe göre sırala Oylara göre sırala
M

mmx1

80+
Katılım
24 Haziran 2021
Mesajlar
348
"<" bunu "&lt;" yada "&60;" ile değiştirerek ve ">" bunu "&gt;" yada "&62;" ile değiştirerek dener misin
Mesaj otomatik birleştirildi:

Oldu mu ?
 
Son düzenleme:
Upvote 0 Downvote
iamkirimli

iamkirimli

80+
Katılım
16 Eylül 2020
Mesajlar
146
Dahası  
Reaksiyon skoru
41
İsim
Mehmet Ali Kırımlı
  • Konu Sahibi Konu Sahibi
  • #4
mmx1 yazmış:
"<" bunu "&lt;" yada "&60;" ile değiştirerek ve ">" bunu "&gt;" yada "&62;" ile değiştirerek dener misin
Mesaj otomatik birleştirildi:

Oldu mu ?
Devamı için tıklayın...
şimdi deniyorum bir dakika
Mesaj otomatik birleştirildi:

mmx1 yazmış:
"<" bunu "&lt;" yada "&60;" ile değiştirerek ve ">" bunu "&gt;" yada "&62;" ile değiştirerek dener misin
Mesaj otomatik birleştirildi:

Oldu mu ?
Devamı için tıklayın...
evet işe yaradı teşekkür ederim ama hepsine aynı şeyi yazmak biraz zorlayabilir daha kolay bi yöntemi olmalı bence ama şu anlık bulamadım tekrardan teşekkürler yardımınız için :))
 
  • Beğen
Reaksiyonlar: mmx1
Upvote 0 Downvote
SorryImSoBussy

SorryImSoBussy

80+ Silver
Katılım
25 Ocak 2021
Mesajlar
3,247
En İyi Cevap
9
Dahası  
Reaksiyon skoru
1,986
İsim
HBE
iamkirimli yazmış:
CSS kodlarını unutmamak için kendim bakabileceğim bir sayfa yapıcam fakat html kodlarını sayfa içerisinde nasıl gösterebilirim? <p></p> veya herhangi bir tag içerisinde yazdığımda onları sayfa içinde normal bir kodmuş gibi gösteriyor ben onları yazı gibi göstermesini istiyorum.

mesela;

html dosyasına başka bir css dosyasını entegre etmek için <link rel="stylesheet" href="..."> kodu kullanılır

*<html>
<head>
<link rel="stylesheet" href="style.css">
</head>
<body>
<p>Merhaba!</p>
</body>
</html>

burda ki tagları kendi sayfa içi yapısı gibi görüyo öyle olmasını istemiyorum.
Devamı için tıklayın...
Bir yazı alanı oluşturmalısın. Editör içerisinde şayet text area create etmeden kod girişi yaparsan (direkt olarak body içerisine yazılan kod) sayfa içinde sayfa olarak algılanabilir hatta sitenin çalışmamasına dahi yol açabilir. En basiti bir div içerisine tablo oluşturup, kodları text olarak rahatlıkla share edebilirsin.

Örneğin;
HTML: 
<div class="col-sm-9 icerik">


    <h1>Tüm Kodlar</h1>


       HTML programlama dilinde kullanılan tüm kodlar aşağıda listelenmiştir:<br><br>


<table class="table table-striped">
<thead>
<tr><th>Kod</th>
<th>Açıklama</th>
<th>XHTML</th>
</tr></thead>
<tbody><tr>
<td>&lt;!--...--&gt;</td>
<td>Açıklama eklemek.</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;!DOCTYPE&gt;&nbsp;</td>
<td>Dosya türünü yazmak.</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;a&gt;</td>
<td>Bağlantı vermek.</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;abbr&gt;</td>
<td>Kısaltma.</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;acronym&gt;</td>
<td>Kısaltmayı açıklamak.</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;address&gt;</td>
<td>Adres vermek.</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;area&gt;</td>
<td>Resim üzerinde alan belirtmek.</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;b&gt;</td>
<td>Kalın yazmak.</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;base&gt;</td>
<td>Tüm bağlantılar için ana yolu bildirme.</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;bdo&gt;</td>
<td>Yazı yönünü bildirme.</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;big&gt;</td>
<td>Büyük yazmak.</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;blockquote&gt;</td>
<td>Alıntı yapmak.</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;body&gt;</td>
<td>İçeriğe başlangıcı bildirmek.</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;br&gt;</td>
<td>Satır atlamak.</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;button&gt;</td>
<td>Buton eklemek.</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;caption&gt;</td>
<td>Tablo başlığı belirtme.</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;center&gt;</td>
<td>Hizayı ortalar.</td>
<td>Yok</td>
</tr>
<tr>
<td>&lt;cite&gt;</td>
<td>Alıntı yapmak.</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;code&gt;</td>
<td>Bilgisayar kodu şeklinde yazmak.</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;col&gt;</td>
<td>Tablo sütununu belirtme.</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;colgroup&gt;</td>
<td>Tablo sütun gruplarını belirtme.</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;dd&gt;</td>
<td>Açıklama eklemek.</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;del&gt;</td>
<td>Üstü çizili yazı yazmak.</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;div&gt;</td>
<td>Dosyada alan belirtme.</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;dfn&gt;</td>
<td>Bir terim açıklamak.</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;dl&gt;</td>
<td>Terimler listesi.</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;dt&gt;</td>
<td>Terim açıklamak.</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;em&gt;</td>
<td>Vurgulu yazı.</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;fieldset&gt;</td>
<td>Alan belirleme.</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;form&gt;</td>
<td>Form kullanma.</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;frame&gt;</td>
<td>Alt pencere açmak (frame)</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;frameset&gt;</td>
<td>Alt pencereleri tanımlamaya başlamak.</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;h1&gt; to &lt;h6&gt;</td>
<td>Başlık (1-6 arası)</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;head&gt;</td>
<td>Dosya bilgilerini açıklama bölümü.</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;hr&gt;</td>
<td>Yatay çizgi çekmek.</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;html&gt;</td>
<td>HTML'ye başlamak.</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;i&gt;</td>
<td>Sağa yatık yazmak.</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;img&gt;</td>
<td>Resim eklemek.</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;input&gt;</td>
<td>Form nesnesi eklemek.</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;ins&gt;</td>
<td>Vurgu yapmak.</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;kbd&gt;</td>
<td>Kelime yazdırma.</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;label&gt;</td>
<td>Etiket belirleme.</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;legend&gt;</td>
<td>Bir alan için başlık belirleme.</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;li&gt;</td>
<td>Listeleme.</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;link&gt;</td>
<td>Dosyaya bağlantı verme.</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;map&gt;</td>
<td>Resim tanımlama.</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;meta&gt;</td>
<td>Dosya bilgisi tanımlama.</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;noscript&gt;</td>
<td>Script desteği yoksa yapılacaklar.</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;object&gt;</td>
<td>Bir obje ekleme (flash vs.)</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;ol&gt;</td>
<td>Numaralandırılmış liste ekleme.</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;optgroup&gt;</td>
<td>Seçim grubu.</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;option&gt;</td>
<td>Sürükle-bırak seçim listesi.</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;p&gt;</td>
<td>Paragraf.</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;param&gt;</td>
<td>Parametre bildirme.</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;pre&gt;</td>
<td>Formatlı yazı ekleme.</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;q&gt;</td>
<td>Küçük alıntılar için.</td>


</tbody></table><br><br>


    
<ul class="pager withspace">
  <li class="previous"><a href="script-kullanmak.html"><i class="glyphicon glyphicon-triangle-left"></i> Script Kullanmak</a></li>
  <li class="next"><a href="tum-fonksiyonlar.html"> Tüm Fonksiyonlar <i class="glyphicon glyphicon-triangle-right"></i></a></li>
</ul>


    </div>


Görüntü aşağıdaki gibi olacaktır;

1628503694589.png




Kodlar alıntıdır.
Kaynak: https://html.sitesi.web.tr/tum-kodlar.html
 
Upvote 0 Downvote
En İyi Cevap
iamkirimli

iamkirimli

80+
Katılım
16 Eylül 2020
Mesajlar
146
Dahası  
Reaksiyon skoru
41
İsim
Mehmet Ali Kırımlı
  • Konu Sahibi Konu Sahibi
  • #6
SorryImSoBussy yazmış:
Bir yazı alanı oluşturmalısın. Editör içerisinde şayet text area create etmeden kod girişi yaparsan (direkt olarak body içerisine yazılan kod) sayfa içinde sayfa olarak algılanabilir hatta sitenin çalışmamasına dahi yol açabilir. En basiti bir div içerisine tablo oluşturup, kodları text olarak rahatlıkla share edebilirsin.

Örneğin;
HTML: 
<div class="col-sm-9 icerik">


    <h1>Tüm Kodlar</h1>


       HTML programlama dilinde kullanılan tüm kodlar aşağıda listelenmiştir:<br><br>


<table class="table table-striped">
<thead>
<tr><th>Kod</th>
<th>Açıklama</th>
<th>XHTML</th>
</tr></thead>
<tbody><tr>
<td>&lt;!--...--&gt;</td>
<td>Açıklama eklemek.</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;!DOCTYPE&gt;&nbsp;</td>
<td>Dosya türünü yazmak.</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;a&gt;</td>
<td>Bağlantı vermek.</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;abbr&gt;</td>
<td>Kısaltma.</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;acronym&gt;</td>
<td>Kısaltmayı açıklamak.</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;address&gt;</td>
<td>Adres vermek.</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;area&gt;</td>
<td>Resim üzerinde alan belirtmek.</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;b&gt;</td>
<td>Kalın yazmak.</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;base&gt;</td>
<td>Tüm bağlantılar için ana yolu bildirme.</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;bdo&gt;</td>
<td>Yazı yönünü bildirme.</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;big&gt;</td>
<td>Büyük yazmak.</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;blockquote&gt;</td>
<td>Alıntı yapmak.</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;body&gt;</td>
<td>İçeriğe başlangıcı bildirmek.</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;br&gt;</td>
<td>Satır atlamak.</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;button&gt;</td>
<td>Buton eklemek.</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;caption&gt;</td>
<td>Tablo başlığı belirtme.</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;center&gt;</td>
<td>Hizayı ortalar.</td>
<td>Yok</td>
</tr>
<tr>
<td>&lt;cite&gt;</td>
<td>Alıntı yapmak.</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;code&gt;</td>
<td>Bilgisayar kodu şeklinde yazmak.</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;col&gt;</td>
<td>Tablo sütununu belirtme.</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;colgroup&gt;</td>
<td>Tablo sütun gruplarını belirtme.</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;dd&gt;</td>
<td>Açıklama eklemek.</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;del&gt;</td>
<td>Üstü çizili yazı yazmak.</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;div&gt;</td>
<td>Dosyada alan belirtme.</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;dfn&gt;</td>
<td>Bir terim açıklamak.</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;dl&gt;</td>
<td>Terimler listesi.</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;dt&gt;</td>
<td>Terim açıklamak.</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;em&gt;</td>
<td>Vurgulu yazı.</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;fieldset&gt;</td>
<td>Alan belirleme.</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;form&gt;</td>
<td>Form kullanma.</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;frame&gt;</td>
<td>Alt pencere açmak (frame)</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;frameset&gt;</td>
<td>Alt pencereleri tanımlamaya başlamak.</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;h1&gt; to &lt;h6&gt;</td>
<td>Başlık (1-6 arası)</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;head&gt;</td>
<td>Dosya bilgilerini açıklama bölümü.</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;hr&gt;</td>
<td>Yatay çizgi çekmek.</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;html&gt;</td>
<td>HTML'ye başlamak.</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;i&gt;</td>
<td>Sağa yatık yazmak.</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;img&gt;</td>
<td>Resim eklemek.</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;input&gt;</td>
<td>Form nesnesi eklemek.</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;ins&gt;</td>
<td>Vurgu yapmak.</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;kbd&gt;</td>
<td>Kelime yazdırma.</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;label&gt;</td>
<td>Etiket belirleme.</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;legend&gt;</td>
<td>Bir alan için başlık belirleme.</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;li&gt;</td>
<td>Listeleme.</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;link&gt;</td>
<td>Dosyaya bağlantı verme.</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;map&gt;</td>
<td>Resim tanımlama.</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;meta&gt;</td>
<td>Dosya bilgisi tanımlama.</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;noscript&gt;</td>
<td>Script desteği yoksa yapılacaklar.</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;object&gt;</td>
<td>Bir obje ekleme (flash vs.)</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;ol&gt;</td>
<td>Numaralandırılmış liste ekleme.</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;optgroup&gt;</td>
<td>Seçim grubu.</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;option&gt;</td>
<td>Sürükle-bırak seçim listesi.</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;p&gt;</td>
<td>Paragraf.</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;param&gt;</td>
<td>Parametre bildirme.</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;pre&gt;</td>
<td>Formatlı yazı ekleme.</td>
<td>Var</td>
</tr>
<tr>
<td>&lt;q&gt;</td>
<td>Küçük alıntılar için.</td>


</tbody></table><br><br>


   
<ul class="pager withspace">
  <li class="previous"><a href="script-kullanmak.html"><i class="glyphicon glyphicon-triangle-left"></i> Script Kullanmak</a></li>
  <li class="next"><a href="tum-fonksiyonlar.html"> Tüm Fonksiyonlar <i class="glyphicon glyphicon-triangle-right"></i></a></li>
</ul>


    </div>


Görüntü aşağıdaki gibi olacaktır;

Alıntıyı görüntüle



Kodlar alıntıdır.
Kaynak: https://html.sitesi.web.tr/tum-kodlar.html
Devamı için tıklayın...
teşekkürler ama aklımda ki sayfa tasarımıyla uyuşmuyor ama yine de bu yöntem için de teşekkürler :)
 
Upvote 0 Downvote
Giatros

Giatros

80+ Bronze
Katılım
9 Nisan 2020
Mesajlar
1,515
Dahası  
Reaksiyon skoru
674
Konum
Şükrü Saracoğlu
İsim
Fatih Altun
İlgilendiği Kategoriler
Futbol, Bilgisayar, Telefon
Instagram
fatihaltns
Discord
Giatros#4797
Upvote 0 Downvote
SorryImSoBussy

SorryImSoBussy

80+ Silver
Katılım
25 Ocak 2021
Mesajlar
3,247
En İyi Cevap
9
Dahası  
Reaksiyon skoru
1,986
İsim
HBE
iamkirimli yazmış:
Alıntıyı görüntüle

kaba taslak bu solda dersler sağda onların nasıl çalıştığına dair örnekler ve kodları (kırmızılar active olmaları)
Devamı için tıklayın...
Grid bir yapımı olacak? Örneğin; sol taraftaki menüden #1 seçilince sağ tarafında bir panel açılacak ve panelde tablodaki bilgiler gösterilecek. #2 tıklandığında 2 içerisinde girilen bilgiler. #3,#4 vb. şeklinde ilerleyecek?

Tüm sayfa yapısı bu görselden ibaret mi olacak? Yani bu görselde yer alan center table mıdır? Sayfa içerisinde mi gösterim yapılacak?
Mesaj otomatik birleştirildi:

HTML: 
<div class="header">
  <h1>Senin için Örnek Çalışma</h1>
</div>

<div class="row">

<div class="col-3 menu">
  <ul>
    <li>HTML</li>
    <li>CSS</li>
    <li>Asp.NET</li>
    <li>pyhton</li>
  </ul>
</div>

<div class="col-9">

  <h1>Senin İçin Örnek Çalışma</h1>

 <p>Bu alana CSS ile birlikte açılır tablo koymalısın. Soldan seçtikçe sağda tablo açsın yada girilmiş dinamik bir text gösterilsin.
    Akerdeon yapı da iş görür. Bu yapının ismi grid yapı. İnternette çok fazla örneği bulunuyor. </p>

  <p> Kod satırlarını inceledikçe anlayacaksın zaten :)
    Şimdiden kolay gelsin.</p>


Yukarıdaki kodu yapıştır bir html body içine. Sonra aç. Sanırım senin istediğin grid yapı buna benziyor.
 
Son düzenleme:
Upvote 0 Downvote
iamkirimli

iamkirimli

80+
Katılım
16 Eylül 2020
Mesajlar
146
Dahası  
Reaksiyon skoru
41
İsim
Mehmet Ali Kırımlı
SorryImSoBussy yazmış:
Grid bir yapımı olacak? Örneğin; sol taraftaki menüden #1 seçilince sağ tarafında bir panel açılacak ve panelde tablodaki bilgiler gösterilecek. #2 tıklandığında 2 içerisinde girilen bilgiler. #3,#4 vb. şeklinde ilerleyecek?

Tüm sayfa yapısı bu görselden ibaret mi olacak? Yani bu görselde yer alan center table mıdır? Sayfa içerisinde mi gösterim yapılacak?
Mesaj otomatik birleştirildi:

HTML: 
<div class="header">
  <h1>Senin için Örnek Çalışma</h1>
</div>

<div class="row">

<div class="col-3 menu">
  <ul>
    <li>HTML</li>
    <li>CSS</li>
    <li>Asp.NET</li>
    <li>pyhton</li>
  </ul>
</div>

<div class="col-9">

  <h1>Senin İçin Örnek Çalışma</h1>

 <p>Bu alana CSS ile birlikte açılır tablo koymalısın. Soldan seçtikçe sağda tablo açsın yada girilmiş dinamik bir text gösterilsin.
    Akerdeon yapı da iş görür. Bu yapının ismi grid yapı. İnternette çok fazla örneği bulunuyor. </p>

  <p> Kod satırlarını inceledikçe anlayacaksın zaten :)
    Şimdiden kolay gelsin.</p>


Yukarıdaki kodu yapıştır bir html body içine. Sonra aç. Sanırım senin istediğin grid yapı buna benziyor.
Devamı için tıklayın...
ben şu an zaten bootstrap ve cssle birlikte yapıyorum tek takıldığım nokta o kodları text halinde yazdırmaktı onu da çözdüm

1628505640339.png
 
Upvote 0 Downvote
Buraya cevap vermek için giriş yapmalı veya kayıt olmalısınız.

BENZER KONULAR

redflu
HTML CSS Yazı Ortalama
Cevaplar
1
Hit
310
naberr
N
Dx Muum
Mavi kısmı yukarıya nasıl çekebilirim
Cevaplar
3
Hit
365
B1L0
B1L0
Akagami no shanks
JavaScript Hava durumu kodumdaki hata nerede
2
Cevaplar
13
Hit
784
devops
D
Pişmaniye
HTML ve CSS Bilen biri yardım edebilir mi?
Cevaplar
3
Hit
465
2mApoo
2mApoo
_Hakk
HATAM NEREDE?(HTML,CSS,JS)
Cevaplar
2
Hit
3K
_Hakk
_Hakk
Yeni mesajlar Yeni Konu Aç      

SON KONULAR

En Son İçerikler

Çevrim içi üyeler

... ve 181 daha.
Toplam: 1,872 (üye: 206, ziyaretçi: 1,666)

Forum istatistikleri

Konular
1,037,621
Mesajlar
9,347,112
Üyeler
164,536
Son üye
Aury
Top Bottom