HTML5 Contenteditable Attribute'ü ile Değiştirilebilir CSS

Tue, 25 Nov 2014 03:11:49 +0200

contenteditable attribute’ü nedir?

HTML5 ile birlikte gelen attribute’lerden biri olan contenteditable, hangi elemente eklenmişse o elementin içeriğinin değiştirilebilir olmasını sağlıyor. Tamamen client tarafında yapılan bu değişiklikler herhangi bir yerde saklanmıyor ve sayfayı yenilediğimiz zaman kayboluyor. Contenteditable; true, false ve inherit olmak üzere 3 değer alabilir. Varsayılan değeri ise inherit.

Bir örnek vermek gerekirse:

<!DOCTYPE html>
<html lang="tr">
<head>
	<meta charset="UTF-8">
	<title>Contenteditable Örneği</title>
</head>
<body>
	<div class="title" contenteditable="true">Merhaba Dünya!</div>
</body>
</html>

Yukarıdaki örnekte, title class’ına sahip div’imize contenteditable="true" ekleyerek div’i değiştirilebilir hale getiriyoruz. Artık tarayıcımızda sayfayı açıp div’de değiştirmek istediğimiz yere tıklayarak içeriği değiştirebiliriz.

Css on Nazım Can Altınova

HTML5 Contenteditable Attribute'ü ile Değiştirilebilir CSS

contenteditable attribute’ü nedir?