CSS'de \"visible\" (görünür) özelliği, bir öğenin görünür veya gizli olmasını kontrol eder. Bu özellik, \"visibility\" özelliği olarak da bilinir. \"visibility\" özelliği, öğenin görünür olup olmadığını belirlemek için kullanılır. \"visible\" değeri öğenin görünür olduğunu, \"hidden\" değeri ise öğenin gizlendiğini belirtir. Örnek Olarak: ``` .hidden { visibility: hidden; } ``` Yukarıdaki örnek kod, \"hidden\" sınıfına sahip tüm öğelerin görünürlüğünü gizler. Bu nedenle, HTML belgesinde aşağıdaki öğe gizlenecektir: ```
Bu öğe gizlenecek.
``` Aynı şekilde, \"visible\" özelliği de bir öğenin görünürlüğünü ayarlamak için kullanılabilir. Örneğin: ``` .visible { visibility: visible; } ``` Yukarıdaki örnek kod, \"visible\" sınıfına sahip tüm öğelerin görünürlüğünü ayarlar. Bu nedenle, HTML belgesinde aşağıdaki öğe görünür olacak: ```
Bu öğe görünür olacak.
``` Ayrıca, \"visible\" özelliği, \"display\" özelliği gibi diğer CSS özellikleriyle birlikte kullanılabilir. Örneğin: ``` .hidden { display: none; visibility: hidden; } ``` Yukarıdaki örnek kod, \"hidden\" sınıfına sahip tüm öğelerin hem gizlenmesini hem de görünürlüğünü gizlemesini sağlar. Bu nedenle, HTML belgesinde aşağıdaki öğe hiçbir şekilde görünmeyecektir: ```
Bu öğe gizlenecek.
``` Bir başka kullanım örneği de, bir öğenin önceden yüklenmesinin istenmesini ve ardından kullanıcının bir eylem yapmasını gerektiren bir işlemle görünür hale getirilmesidir. Örneğin: ``` #hidden-button { visibility: hidden; } #show-button:hover + #hidden-button { visibility: visible; } ``` Yukarıdaki örnek kod, \"hidden-button\" adlı öğeyi varsayılan olarak gizler. Ancak, \"show-button\" adlı bir öğenin üzerine fare ile geldiğinde, \"hidden-button\" öğesi görünür hale gelecektir. Bu nedenle, HTML belgesinde aşağıdaki öğeler kullanılabilir: ```