Bootstrap İç İçe Yorum Sistemi Örneği


startbootstrap sitesinden bulduğum bir iç içe yorum sistemi için işe yarayailecek bootstrap kod parçası örneğidir.

Ekran Görüntüsü

Kodlar
<!--Yorum Yazma Alanı-->
<div class="well">
	<h4>Leave a Comment:</h4>
	<form role="form">
		<div class="form-group">
			<textarea class="form-control" rows="3"></textarea>
		</div>
		<button type="submit" class="btn btn-primary">Submit</button>
	</form>
</div>

<!--Tek Kademeli Yorum-->
<div class="media">
	<a class="pull-left" href="#">
		<img class="media-object" src="http://placehold.it/64x64" alt="">
	</a>
	<div class="media-body">
		<h4 class="media-heading">Start Bootstrap
			<small>August 25, 2014 at 9:30 PM</small>
		</h4>
		Cras sit amet nibh libero, in gravida nulla. Nulla vel metus scelerisque ante sollicitudin commodo. Cras purus odio, vestibulum in vulputate at, tempus viverra turpis. Fusce condimentum nunc ac nisi vulputate fringilla. Donec lacinia congue felis in faucibus.
	</div>
</div>

<!--İç İçe Yorum-->
<div class="media">
	<a class="pull-left" href="#">
		<img class="media-object" src="http://placehold.it/64x64" alt="">
	</a>
	<div class="media-body">
		<h4 class="media-heading">Start Bootstrap
			<small>August 25, 2014 at 9:30 PM</small>
		</h4>
		Cras sit amet nibh libero, in gravida nulla. Nulla vel metus scelerisque ante sollicitudin commodo. Cras purus odio, vestibulum in vulputate at, tempus viverra turpis. Fusce condimentum nunc ac nisi vulputate fringilla. Donec lacinia congue felis in faucibus.
		<!-- Nested Comment -->
		<div class="media">
			<a class="pull-left" href="#">
				<img class="media-object" src="http://placehold.it/64x64" alt="">
			</a>
			<div class="media-body">
				<h4 class="media-heading">Nested Start Bootstrap
					<small>August 25, 2014 at 9:30 PM</small>
				</h4>
				Cras sit amet nibh libero, in gravida nulla. Nulla vel metus scelerisque ante sollicitudin commodo. Cras purus odio, vestibulum in vulputate at, tempus viverra turpis. Fusce condimentum nunc ac nisi vulputate fringilla. Donec lacinia congue felis in faucibus.
			</div>
		</div>
		<!-- End Nested Comment -->
	</div>
</div>

Yararlanılan Kaynaklar
https://startbootstrap.com/template-overviews/blog-post/


Bunlar da hoşunuza gidebilir...


Bir cevap yazın

E-posta hesabınız yayımlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir