{"id":414,"date":"2026-01-26T11:26:08","date_gmt":"2026-01-26T11:26:08","guid":{"rendered":"https:\/\/www.webmobkey.com\/blog\/?p=414"},"modified":"2026-01-28T08:16:59","modified_gmt":"2026-01-28T08:16:59","slug":"css-nedir-en-kapsamli-css-kodlari-rehberi-tablolu","status":"publish","type":"post","link":"https:\/\/www.webmobdesign.com\/blog\/tr\/css-nedir-en-kapsamli-css-kodlari-rehberi-tablolu\/","title":{"rendered":"CSS Nedir? En Kapsaml\u0131 CSS Kodlar\u0131 Rehberi (Tablolu)"},"content":{"rendered":"\n

CSS (Cascading Style Sheets), web sitelerinin tasar\u0131m\u0131n\u0131 ve g\u00f6r\u00fcn\u00fcm\u00fcn\u00fc kontrol etmek i\u00e7in kullan\u0131lan bir stil dilidir. Bu yaz\u0131da CSS\u2019te en \u00e7ok kullan\u0131lan t\u00fcm temel kodlar\u0131<\/strong>, anlamlar\u0131 ve \u00f6rnekleriyle birlikte tablo halinde<\/strong> bulacaks\u0131n.<\/p>\n\n\n\n

\n\n\n\n

1. CSS Selectors (Se\u00e7iciler)<\/h2>\n\n\n\n
Selector<\/th>A\u00e7\u0131klama<\/th>\u00d6rnek<\/th><\/tr><\/thead>
*<\/code><\/td>T\u00fcm elemanlar\u0131 se\u00e7er<\/td>* { margin: 0; }<\/code><\/td><\/tr>
div<\/code><\/td>Belirli HTML etiketi<\/td>div { color: red; }<\/code><\/td><\/tr>
.class<\/code><\/td>Class se\u00e7ici<\/td>.box { padding: 10px; }<\/code><\/td><\/tr>
#id<\/code><\/td>ID se\u00e7ici<\/td>#header { height: 60px; }<\/code><\/td><\/tr>
element, element<\/code><\/td>\u00c7oklu se\u00e7im<\/td>h1, h2 { color: blue; }<\/code><\/td><\/tr>
element element<\/code><\/td>\u0130\u00e7 i\u00e7e se\u00e7im<\/td>div p { color: green; }<\/code><\/td><\/tr>
element > element<\/code><\/td>Direkt \u00e7ocuk<\/td>ul > li { list-style: none; }<\/code><\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n\n
\n\n\n\n

2. Metin (Text) CSS Kodlar\u0131<\/h2>\n\n\n\n
Property<\/th>A\u00e7\u0131klama<\/th>\u00d6rnek<\/th><\/tr><\/thead>
color<\/code><\/td>Yaz\u0131 rengi<\/td>color: red;<\/code><\/td><\/tr>
font-size<\/code><\/td>Yaz\u0131 boyutu<\/td>font-size: 16px;<\/code><\/td><\/tr>
font-family<\/code><\/td>Yaz\u0131 tipi<\/td>font-family: Arial;<\/code><\/td><\/tr>
font-weight<\/code><\/td>Kal\u0131nl\u0131k<\/td>font-weight: bold;<\/code><\/td><\/tr>
text-align<\/code><\/td>Hizalama<\/td>text-align: center;<\/code><\/td><\/tr>
text-decoration<\/code><\/td>Alt \u00e7izgi vb.<\/td>text-decoration: underline;<\/code><\/td><\/tr>
line-height<\/code><\/td>Sat\u0131r aral\u0131\u011f\u0131<\/td>line-height: 1.5;<\/code><\/td><\/tr>
letter-spacing<\/code><\/td>Harf aral\u0131\u011f\u0131<\/td>letter-spacing: 2px;<\/code><\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n\n
\n\n\n\n

3. Box Model (Kutu Modeli)<\/h2>\n\n\n\n
Property<\/th>A\u00e7\u0131klama<\/th>\u00d6rnek<\/th><\/tr><\/thead>
width<\/code><\/td>Geni\u015flik<\/td>width: 300px;<\/code><\/td><\/tr>
height<\/code><\/td>Y\u00fckseklik<\/td>height: 200px;<\/code><\/td><\/tr>
padding<\/code><\/td>\u0130\u00e7 bo\u015fluk<\/td>padding: 20px;<\/code><\/td><\/tr>
margin<\/code><\/td>D\u0131\u015f bo\u015fluk<\/td>margin: 10px;<\/code><\/td><\/tr>
border<\/code><\/td>Kenarl\u0131k<\/td>border: 1px solid black;<\/code><\/td><\/tr>
box-sizing<\/code><\/td>Kutu hesab\u0131<\/td>box-sizing: border-box;<\/code><\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n\n
\n\n\n\n

4. Arka Plan (Background) CSS Kodlar\u0131<\/h2>\n\n\n\n
Property<\/th>A\u00e7\u0131klama<\/th>\u00d6rnek<\/th><\/tr><\/thead>
background-color<\/code><\/td>Arka plan rengi<\/td>background-color: #fff;<\/code><\/td><\/tr>
background-image<\/code><\/td>Arka plan g\u00f6rseli<\/td>background-image: url(img.jpg);<\/code><\/td><\/tr>
background-size<\/code><\/td>G\u00f6rsel boyutu<\/td>background-size: cover;<\/code><\/td><\/tr>
background-position<\/code><\/td>Konum<\/td>background-position: center;<\/code><\/td><\/tr>
background-repeat<\/code><\/td>Tekrar<\/td>background-repeat: no-repeat;<\/code><\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n\n
\n\n\n\n

5. Flexbox CSS Kodlar\u0131<\/h2>\n\n\n\n
Property<\/th>A\u00e7\u0131klama<\/th>\u00d6rnek<\/th><\/tr><\/thead>
display<\/code><\/td>Flex ba\u015flat\u0131r<\/td>display: flex;<\/code><\/td><\/tr>
flex-direction<\/code><\/td>Y\u00f6n<\/td>flex-direction: row;<\/code><\/td><\/tr>
justify-content<\/code><\/td>Yatay hizalama<\/td>justify-content: center;<\/code><\/td><\/tr>
align-items<\/code><\/td>Dikey hizalama<\/td>align-items: center;<\/code><\/td><\/tr>
gap<\/code><\/td>Eleman aral\u0131\u011f\u0131<\/td>gap: 10px;<\/code><\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n\n
\n\n\n\n

6. Position (Konumland\u0131rma)<\/h2>\n\n\n\n
Property<\/th>A\u00e7\u0131klama<\/th>\u00d6rnek<\/th><\/tr><\/thead>
position<\/code><\/td>Konum t\u00fcr\u00fc<\/td>position: relative;<\/code><\/td><\/tr>
top<\/code><\/td>\u00dcstten<\/td>top: 10px;<\/code><\/td><\/tr>
left<\/code><\/td>Soldan<\/td>left: 20px;<\/code><\/td><\/tr>
z-index<\/code><\/td>Katman s\u0131ras\u0131<\/td>z-index: 10;<\/code><\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n\n
\n\n\n\n

7. Pseudo Class & Elements<\/h2>\n\n\n\n
Kod<\/th>A\u00e7\u0131klama<\/th>\u00d6rnek<\/th><\/tr><\/thead>
:hover<\/code><\/td>\u00dczerine gelince<\/td>a:hover { color: red; }<\/code><\/td><\/tr>
:active<\/code><\/td>T\u0131klan\u0131nca<\/td>button:active { }<\/code><\/td><\/tr>
:focus<\/code><\/td>Odaklan\u0131nca<\/td>input:focus { }<\/code><\/td><\/tr>
::before<\/code><\/td>\u00d6ncesi<\/td>p::before { }<\/code><\/td><\/tr>
::after<\/code><\/td>Sonras\u0131<\/td>div::after { }<\/code><\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n\n
\n\n\n\n

8. Responsive (Media Query)<\/h2>\n\n\n
\n@media (max-width: 768px) {\n  body {\n    background-color: lightgray;\n  }\n}\n\n<\/pre><\/div>\n\n\n
9. CSS Grid Kodlar\u0131<\/h2>\n\n\n\n
Property<\/th>A\u00e7\u0131klama<\/th>\u00d6rnek<\/th><\/tr><\/thead>
display<\/code><\/td>Grid ba\u015flat\u0131r<\/td>display: grid;<\/code><\/td><\/tr>
grid-template-columns<\/code><\/td>S\u00fctun yap\u0131s\u0131<\/td>grid-template-columns: 1fr 1fr;<\/code><\/td><\/tr>
grid-template-rows<\/code><\/td>Sat\u0131r yap\u0131s\u0131<\/td>grid-template-rows: auto;<\/code><\/td><\/tr>
gap<\/code><\/td>Bo\u015fluk<\/td>gap: 20px;<\/code><\/td><\/tr>
grid-column<\/code><\/td>S\u00fctun konumu<\/td>grid-column: 1 \/ 3;<\/code><\/td><\/tr>
grid-row<\/code><\/td>Sat\u0131r konumu<\/td>grid-row: 1 \/ 2;<\/code><\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n\n
\n\n\n\n
10. Transform CSS Kodlar\u0131<\/h2>\n\n\n\n
Property<\/th>A\u00e7\u0131klama<\/th>\u00d6rnek<\/th><\/tr><\/thead>
transform<\/code><\/td>D\u00f6n\u00fc\u015ft\u00fcrme<\/td>transform: rotate(45deg);<\/code><\/td><\/tr>
translate<\/code><\/td>Ta\u015f\u0131ma<\/td>transform: translateX(20px);<\/code><\/td><\/tr>
scale<\/code><\/td>\u00d6l\u00e7ekleme<\/td>transform: scale(1.2);<\/code><\/td><\/tr>
skew<\/code><\/td>E\u011fme<\/td>transform: skew(10deg);<\/code><\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n\n
\n\n\n\n
11. Transition (Ge\u00e7i\u015f Efektleri)<\/h2>\n\n\n\n
Property<\/th>A\u00e7\u0131klama<\/th>\u00d6rnek<\/th><\/tr><\/thead>
transition<\/code><\/td>Genel ge\u00e7i\u015f<\/td>transition: all 0.3s;<\/code><\/td><\/tr>
transition-property<\/code><\/td>\u00d6zellik<\/td>transition-property: color;<\/code><\/td><\/tr>
transition-duration<\/code><\/td>S\u00fcre<\/td>transition-duration: 0.5s;<\/code><\/td><\/tr>
transition-timing-function<\/code><\/td>E\u011fri<\/td>ease, linear<\/code><\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n\n
\n\n\n\n
12. Animation (Animasyonlar)<\/h2>\n\n\n\n
Property<\/th>A\u00e7\u0131klama<\/th>\u00d6rnek<\/th><\/tr><\/thead>
@keyframes<\/code><\/td>Animasyon tan\u0131m\u0131<\/td>@keyframes move {}<\/code><\/td><\/tr>
animation-name<\/code><\/td>Ad<\/td>animation-name: move;<\/code><\/td><\/tr>
animation-duration<\/code><\/td>S\u00fcre<\/td>2s<\/code><\/td><\/tr>
animation-iteration-count<\/code><\/td>Tekrar<\/td>infinite<\/code><\/td><\/tr>
animation-delay<\/code><\/td>Gecikme<\/td>1s<\/code><\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n\n
\n\n\n\n
13. Overflow & Visibility<\/h2>\n\n\n\n
Property<\/th>A\u00e7\u0131klama<\/th>\u00d6rnek<\/th><\/tr><\/thead>
overflow<\/code><\/td>Ta\u015fma kontrol\u00fc<\/td>overflow: hidden;<\/code><\/td><\/tr>
overflow-x<\/code><\/td>Yatay<\/td>overflow-x: auto;<\/code><\/td><\/tr>
overflow-y<\/code><\/td>Dikey<\/td>overflow-y: scroll;<\/code><\/td><\/tr>
visibility<\/code><\/td>G\u00f6r\u00fcn\u00fcrl\u00fck<\/td>visibility: hidden;<\/code><\/td><\/tr>
opacity<\/code><\/td>Saydaml\u0131k<\/td>opacity: 0.5;<\/code><\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n\n
\n\n\n\n
14. Liste & Tablo CSS Kodlar\u0131<\/h2>\n\n\n\n
Liste<\/h3>\n\n\n\n
Property<\/th>A\u00e7\u0131klama<\/th>\u00d6rnek<\/th><\/tr><\/thead>
list-style<\/code><\/td>Liste tipi<\/td>list-style: none;<\/code><\/td><\/tr>
list-style-type<\/code><\/td>\u0130\u015faret<\/td>circle, square<\/code><\/td><\/tr>
list-style-position<\/code><\/td>Konum<\/td>inside<\/code><\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n\n
Tablo<\/h3>\n\n\n\n
Property<\/th>A\u00e7\u0131klama<\/th>\u00d6rnek<\/th><\/tr><\/thead>
border-collapse<\/code><\/td>Kenarl\u0131k<\/td>collapse<\/code><\/td><\/tr>
border-spacing<\/code><\/td>Bo\u015fluk<\/td>10px<\/code><\/td><\/tr>
caption-side<\/code><\/td>Ba\u015fl\u0131k<\/td>top<\/code><\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n\n
\n\n\n\n
15. Cursor & Kullan\u0131c\u0131 Etkile\u015fimi<\/h2>\n\n\n\n
Property<\/th>A\u00e7\u0131klama<\/th>\u00d6rnek<\/th><\/tr><\/thead>
cursor<\/code><\/td>\u0130mle\u00e7<\/td>cursor: pointer;<\/code><\/td><\/tr>
user-select<\/code><\/td>Metin se\u00e7imi<\/td>user-select: none;<\/code><\/td><\/tr>
pointer-events<\/code><\/td>Etkile\u015fim<\/td>pointer-events: none;<\/code><\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n\n
\n\n\n\n
16. CSS Variables (De\u011fi\u015fkenler)<\/h2>\n\n\n\n
Kod<\/th>A\u00e7\u0131klama<\/th>\u00d6rnek<\/th><\/tr><\/thead>
--degisken<\/code><\/td>De\u011fi\u015fken tan\u0131m\u0131<\/td>--main-color: red;<\/code><\/td><\/tr>
var()<\/code><\/td>Kullan\u0131m<\/td>color: var(--main-color);<\/code><\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n
\n:root {\n  --primary: #3498db;\n}\n\n<\/pre><\/div>\n\n\n
\n\n\n\n
17. CSS Functions (Fonksiyonlar)<\/h2>\n\n\n\n
Fonksiyon<\/th>A\u00e7\u0131klama<\/th>\u00d6rnek<\/th><\/tr><\/thead>
calc()<\/code><\/td>Hesaplama<\/td>width: calc(100% - 50px);<\/code><\/td><\/tr>
clamp()<\/code><\/td>Min-max<\/td>font-size: clamp(14px, 2vw, 20px);<\/code><\/td><\/tr>
min()<\/code><\/td>Minimum<\/td>width: min(500px, 100%);<\/code><\/td><\/tr>
max()<\/code><\/td>Maksimum<\/td>height: max(300px, 50vh);<\/code><\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n\n
\n\n\n\n
18. Object & Image CSS Kodlar\u0131<\/h2>\n\n\n\n
Property<\/th>A\u00e7\u0131klama<\/th>\u00d6rnek<\/th><\/tr><\/thead>
object-fit<\/code><\/td>G\u00f6rsel uyumu<\/td>cover, contain<\/code><\/td><\/tr>
object-position<\/code><\/td>Konum<\/td>center<\/code><\/td><\/tr>
aspect-ratio<\/code><\/td>Oran<\/td>16 \/ 9<\/code><\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n\n
\n\n\n\n
19. Modern CSS (Yeni Nesil)<\/h2>\n\n\n\n
Property<\/th>A\u00e7\u0131klama<\/th>\u00d6rnek<\/th><\/tr><\/thead>
aspect-ratio<\/code><\/td>En-boy oran\u0131<\/td>1 \/ 1<\/code><\/td><\/tr>
scroll-behavior<\/code><\/td>Kayd\u0131rma<\/td>smooth<\/code><\/td><\/tr>
backdrop-filter<\/code><\/td>Arka plan blur<\/td>blur(10px)<\/code><\/td><\/tr>
mix-blend-mode<\/code><\/td>Kar\u0131\u015f\u0131m<\/td>multiply<\/code><\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n\n
Harika! O zaman Modern CSS (Yeni Nesil) ba\u015fl\u0131\u011f\u0131ndan devam ederek<\/strong>, eksik kalan ileri ve \u00f6zel CSS \u00f6zelliklerini tablo halinde ekliyorum. B\u00f6ylece rehber tam kapsay\u0131c\u0131 ve g\u00fcncel<\/strong> hale gelecek.<\/p>\n\n\n\n
\n\n\n\n
20. CSS Filter (Filtreler)<\/h2>\n\n\n\n
Property \/ Fonksiyon<\/th>A\u00e7\u0131klama<\/th>\u00d6rnek<\/th><\/tr><\/thead>
filter<\/code><\/td>G\u00f6rsel efekt uygular<\/td>filter: blur(5px);<\/code><\/td><\/tr>
blur()<\/code><\/td>Bulan\u0131kla\u015ft\u0131rma<\/td>filter: blur(3px);<\/code><\/td><\/tr>
brightness()<\/code><\/td>Parlakl\u0131k<\/td>filter: brightness(150%);<\/code><\/td><\/tr>
contrast()<\/code><\/td>Kontrast<\/td>filter: contrast(120%);<\/code><\/td><\/tr>
grayscale()<\/code><\/td>Gri tonlama<\/td>filter: grayscale(50%);<\/code><\/td><\/tr>
sepia()<\/code><\/td>Sepya efekti<\/td>filter: sepia(60%);<\/code><\/td><\/tr>
saturate()<\/code><\/td>Doygunluk<\/td>filter: saturate(200%);<\/code><\/td><\/tr>
hue-rotate()<\/code><\/td>Renk tonu<\/td>filter: hue-rotate(90deg);<\/code><\/td><\/tr>
invert()<\/code><\/td>Negatif renk<\/td>filter: invert(100%);<\/code><\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n\n
\n\n\n\n
21. CSS Clip \/ Mask \/ Shape<\/h2>\n\n\n\n
Property \/ Fonksiyon<\/th>A\u00e7\u0131klama<\/th>\u00d6rnek<\/th><\/tr><\/thead>
clip-path<\/code><\/td>Eleman\u0131 \u00f6zel \u015fekle k\u0131rpar<\/td>clip-path: circle(50% at 50% 50%);<\/code><\/td><\/tr>
polygon()<\/code><\/td>\u00c7okgen \u015fekil<\/td>clip-path: polygon(50% 0%, 0% 100%, 100% 100%);<\/code><\/td><\/tr>
inset()<\/code><\/td>D\u00f6rt kenar\u0131 k\u0131rp<\/td>clip-path: inset(10px 20px 10px 20px);<\/code><\/td><\/tr>
circle()<\/code><\/td>Daire<\/td>clip-path: circle(40% at 50% 50%);<\/code><\/td><\/tr>
ellipse()<\/code><\/td>Elips<\/td>clip-path: ellipse(50% 30% at 50% 50%);<\/code><\/td><\/tr>
mask-image<\/code><\/td>Maske ile g\u00f6r\u00fcn\u00fcrl\u00fck<\/td>mask-image: url(mask.png);<\/code><\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n\n
\n\n\n\n
22. Multi-Column Layout (S\u00fctun D\u00fczeni)<\/h2>\n\n\n\n
Property<\/th>A\u00e7\u0131klama<\/th>\u00d6rnek<\/th><\/tr><\/thead>
column-count<\/code><\/td>S\u00fctun say\u0131s\u0131<\/td>column-count: 3;<\/code><\/td><\/tr>
column-gap<\/code><\/td>S\u00fctun aras\u0131 bo\u015fluk<\/td>column-gap: 20px;<\/code><\/td><\/tr>
column-rule<\/code><\/td>S\u00fctun aras\u0131 \u00e7izgi<\/td>column-rule: 1px solid black;<\/code><\/td><\/tr>
column-width<\/code><\/td>S\u00fctun geni\u015fli\u011fi<\/td>column-width: 150px;<\/code><\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n\n
\n\n\n\n
23. Perspective \/ 3D Transform<\/h2>\n\n\n\n
Property \/ Fonksiyon<\/th>A\u00e7\u0131klama<\/th>\u00d6rnek<\/th><\/tr><\/thead>
perspective<\/code><\/td>3D derinlik<\/td>perspective: 1000px;<\/code><\/td><\/tr>
perspective-origin<\/code><\/td>Derinlik kayna\u011f\u0131<\/td>perspective-origin: 50% 50%;<\/code><\/td><\/tr>
transform: rotateX()<\/code><\/td>X ekseninde d\u00f6nd\u00fcrme<\/td>transform: rotateX(45deg);<\/code><\/td><\/tr>
transform: rotateY()<\/code><\/td>Y ekseninde d\u00f6nd\u00fcrme<\/td>transform: rotateY(30deg);<\/code><\/td><\/tr>
transform: rotateZ()<\/code><\/td>Z ekseninde d\u00f6nd\u00fcrme<\/td>transform: rotateZ(60deg);<\/code><\/td><\/tr>
transform-style: preserve-3d<\/code><\/td>3D \u00e7ocuk elemanlar<\/td>transform-style: preserve-3d;<\/code><\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n\n
\n\n\n\n
26. CSS Content & Quotes<\/h2>\n\n\n\n
Property \/ Pseudo<\/th>A\u00e7\u0131klama<\/th>\u00d6rnek<\/th><\/tr><\/thead>
content<\/code><\/td>Pseudo-element i\u00e7erik<\/td>p::before { content: \"\u26a1\"; }<\/code><\/td><\/tr>
quotes<\/code><\/td>Al\u0131nt\u0131 stili<\/td>quotes: \"\u201c\" \"\u201d\" \"\u2018\" \"\u2019\";<\/code><\/td><\/tr>
counter-reset<\/code><\/td>Saya\u00e7 ba\u015flat<\/td>counter-reset: section;<\/code><\/td><\/tr>
counter-increment<\/code><\/td>Saya\u00e7 art\u0131r<\/td>counter-increment: section;<\/code><\/td><\/tr>
counter()<\/code><\/td>Saya\u00e7 kullan\u0131m\u0131<\/td>content: counter(section);<\/code><\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n\n
\n\n\n\n
27. CSS Functions Detayl\u0131<\/h2>\n\n\n\n
Fonksiyon<\/th>A\u00e7\u0131klama<\/th>\u00d6rnek<\/th><\/tr><\/thead>
rgb()<\/code><\/td>RGB renk<\/td>color: rgb(255,0,0);<\/code><\/td><\/tr>
rgba()<\/code><\/td>RGB + Alpha<\/td>color: rgba(0,0,0,0.5);<\/code><\/td><\/tr>
hsl()<\/code><\/td>Hue Saturation Light<\/td>color: hsl(120, 50%, 50%);<\/code><\/td><\/tr>
hsla()<\/code><\/td>HSL + Alpha<\/td>color: hsla(240, 100%, 50%, 0.7);<\/code><\/td><\/tr>
linear-gradient()<\/code><\/td>Do\u011frusal ge\u00e7i\u015f<\/td>background: linear-gradient(to right, red, yellow);<\/code><\/td><\/tr>
radial-gradient()<\/code><\/td>Dairesel ge\u00e7i\u015f<\/td>background: radial-gradient(circle, red, yellow);<\/code><\/td><\/tr>
conic-gradient()<\/code><\/td>Konik ge\u00e7i\u015f<\/td>background: conic-gradient(red, yellow, green);<\/code><\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n\n
\n\n\n\n
<\/p>\n","protected":false},"excerpt":{"rendered":"
CSS (Cascading Style Sheets), web sitelerinin tasar\u0131m\u0131n\u0131 ve g\u00f6r\u00fcn\u00fcm\u00fcn\u00fc kontrol etmek i\u00e7in kullan\u0131lan bir stil dilidir. … CSS Nedir? En Kapsaml\u0131 CSS Kodlar\u0131 Rehberi (Tablolu)<\/span>Read more<\/a><\/p>\n","protected":false},"author":1,"featured_media":416,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[51],"tags":[89],"class_list":["post-414","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-web-tr","tag-yazilim"],"_links":{"self":[{"href":"https:\/\/www.webmobdesign.com\/blog\/wp-json\/wp\/v2\/posts\/414","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.webmobdesign.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.webmobdesign.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.webmobdesign.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.webmobdesign.com\/blog\/wp-json\/wp\/v2\/comments?post=414"}],"version-history":[{"count":1,"href":"https:\/\/www.webmobdesign.com\/blog\/wp-json\/wp\/v2\/posts\/414\/revisions"}],"predecessor-version":[{"id":415,"href":"https:\/\/www.webmobdesign.com\/blog\/wp-json\/wp\/v2\/posts\/414\/revisions\/415"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.webmobdesign.com\/blog\/wp-json\/wp\/v2\/media\/416"}],"wp:attachment":[{"href":"https:\/\/www.webmobdesign.com\/blog\/wp-json\/wp\/v2\/media?parent=414"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.webmobdesign.com\/blog\/wp-json\/wp\/v2\/categories?post=414"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.webmobdesign.com\/blog\/wp-json\/wp\/v2\/tags?post=414"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}