5.00 / 1 oy

CSS ile renkli kutu çizmek

Herkese merhaba, sitede yer alan tutorial içeriklerini görünce ben de özenerek kendi çapımda katkı sağlamak istedim ve önce biraz css, sonra da php üzerine uygulamalı makaleler paylaşacağım. Paylaşımlarımı, yazar arkadaşlar arasından yazılım ile ilgili olanların da kod olarak katılım sağlamak isterlerse diye soru formatında paylaşacağım. İleride lazım olduğunda bkz referansı verebilmek için de temel css konularından giriş yapıyorum. Cloudflare konusunda yazdığım ilk yazıma da Cloudflare Nedir ve Nasıl Kullanılır? linkinden erişebilirsiniz.

Not: Aynı konuda birden fazla başlık oluşturmamak için önden arama yaparak başlık açıyorum. Yazmayı planladığım ya da ilgili konularda link paylaşımı da yapacağım.

İlk CSS uygulamamızda Internal CSS ile bir div'e arka plan rengi verelim ve bu yazının içinde de body'den kalıtsal olarak yazı rengini miras alalım.

css renkli kutu

Kodlar (HTML+CSS):

<!DOCTYPE html>
<html>

<head>
<title>CSS Kutu</title>

<style>
body{color:#ffffff}
.kutu{
	background-color:green;
	width:100px;
	height:80px;
}
</style>
</head>

<body>
	<div class="kutu">
	Merhaba kutucuk
	</div>
</body>

</html>

Edit: sonrki yazım için bkz: Google Fonts Siteye Nasıl Eklenir?

CSS konusunda flexbox yaklaşımını benimseyenler için aşağıdaki bağlantılara bakmalarını öneriyorum.

bkz: CSS Flexbox flex Özelliği Nedir ve Nasıl Kullanılır?

bkz: CSS Flexbox Nedir ve Nasıl Kullanılır?

bkz: CSS Flexbox Flex-Direction Nedir ve Nasıl Kullanılır?

bkz: CSS Flexbox Flex-Wrap Nedir ve Nasıl Kullanılır?

bkz: CSS Flexbox Flex-Flow Nedir ve Nasıl Kullanılır?

bkz: CSS Flexbox Justify-Content Nedir ve Nasıl Kullanılır?

PhpCoder

09.02.2021 00:17

Bu soru henüz yanıtlanmamış.

Bu soruya sadece kayıtlı kullanıcılar yanıt yazabilirler. Yanıt yazmak için lütfen giriş yapınız.

Reitix
CSS ile renkli kutu çizmek

İnternet sitemizdeki deneyiminizi iyileştirmek için çerezler kullanıyoruz. Bu siteye giriş yaparak çerez kullanımını kabul etmiş sayılıyorsunuz. Daha fazla bilgi.