CSS'i WEB SAYFASINA EKLEMEK

HTML sayfalarımıza css uzantı Dosyalarımızı eklemenin iki yöntemi vardır. Ayrıca css kodlarını HTML sayfalarımızda kullanmanında iki yöntemi vardır.

1. YÖNTEM Kod içinde (inline style)


HTML <p> Etiketimizde görelim:

<p style="color:blue">Bu bir parağraftır</p>

Tüm css komutlarını kodların içine direk uygulamak önerilen bir kodlama şekli değildir. Özel durumlarda kullanılır.

2. YÖNTEM <style> Elemanı kullanarak


<head> bölümüne <style> Etiketi ekleyerek arasına css kodları yazılır.


<html>

<head>

<style type="text/css" >

p{color:red;}

<style>

</head>

Birinci Yönteme göre Etiket ile css birbirinden ayrıştırılmış oluyor.

3.YÖNTEM Harici css Dosya kullanımı


Bu kullanımda css kodlarımızı xxx.css uzantılı bir dosya kaydederiz.Dosyanın ismi önemli değil uzantı (.css) olsun.

Deneme.css oluşturalım


p{color:red}

i{color:blue}

Daha sonra bu Deneme.css Dosyasını websayfamıza ekleyelim.


<head>

< link rel="stylesheet" type="text/css" href="deneme.css"/>

</head>

Bu yöntemle oluşturduğumuz (.css) uzantlı dosyayı tüm sayfalara ekliyebiliriz. Arama motorları (google vb.) bu yöntemi dikkate alıyor yani seo için uygun bir yöntem.

4. YÖNTEM @ import ile Eklemek




<style="text/css">

@import "Deneme.css";

</style>

EmirhanateÅŸ 09/12/2021

hocam harici bir css uzantılı bir css dosyası oluşturdum ama css dosyam microsoft edge beta ile açılıyor bu sorunu nasıl halledebilirim.

yönetici 09/12/2021

Emirhan sorunu anlamadım. Yukardaki gibi eklediysen beta filan farketmez tüm tarayıcılarda çalışır.
Lütfen konu haricinde soru sormayın cevaplanmayacaktır. Yorumunuz onaylandıktan sonra yayınlanacaktır. Lütfen Yukarıda ki mesajları okuyun tekrar aynı soruları sormayın.

1404

KATEGORÄ°
  • HTML
  • CSS
  • PHP
  • JQUERY
  • PHOTOSHOP
  • JavaScript
  • Web Dünyası
  • Linux
  • MÄ°THRÄ°L FRAMEWORK
  • Laravel
  • Git
  • React
POPÃœLER MAKALE
  • HTML LÄ°NK(BaÄŸlantı)EKLEME - LÄ°NK VERME
  • HTML YAZI VE RESÄ°M ORTALAMA
  • HTML RESME LÄ°NK VERME
  • HTML FORM OLUÅžTURMA
  • CSS YATAY MENÃœ YAPIMI
  • HTML RESÄ°M EKLEME
  • CSS (BOYUT) GENÄ°ÅžLÄ°K VE YÃœKSEKLÄ°K (Width-Height)
  • HTML DÄ°V ve SPAN NEDÄ°R?
  • HTML ARKAPLANA MÃœZÄ°K EKLEME
  • KALÄ°TE KAYBETMEDEN RESÄ°MLERÄ° BÃœYÃœTME
ETÄ°KET
WEBCEBİR © 2013 Tüm hakları saklıdır.