Bildirim
Psdyi htmlye çevirmek
Bu Konudaki Kullanıcılar:
2 Misafir (1 Mobil) - 1 Masaüstü,
1 Mobil
1 Mobil
Giriş
Mesaj
-
-
Hemşerimsin ama kusura bakma. Güzel kardeşim internette var mı diyeceğine internete yazsana Fireworks dersleri diye
.
Neyse. CSS dediğin şey, HTML üzerindeki şekillendirme yükünü almak, aynı şekillendirmeyi birden fazla HTML belgesine uygulayabilmek ve bir HTML belgesinin belli bir elemanını ya da aynı şekilendirme özelliği taşıması gereken birden fazla elemanını şekillendirmek için kullanılan stil dosyalarına denir. HTML biliyorsan öğrenmesi basittir.
Açıklama pek açıklayıcı olmayabilir. Hemen örnekleyelim.
Bu dosyamıza index.html diyelim.
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>CSS Kullanımı</title>
<!--<link ... diye başlayan kısma dikkat -->
<link rel="stylesheet" type="text/css" href="style.css" />
<!--css dosyasını html dosyasına bağladık -->
</head>
<body>
<h1>CSS Derslerine Hoşgeldiniz (Bu bir H1 elementidir.)</h1>
<p id="id_nedir">ID bir HTML elementinin eşsiz kimliği olup aynı ID, aynı belge içerisinde bir başka HTML elementine verilemez (Bu 'id_nedir' ID'li bir P elementidir)</p>
<p class="class_nedir">CLASS, ID gibi yine bir HTML elementinin kimliği olup eşsiz değildir ve aynı CLASS birden fazla HTML elementine verilebilir. (Bu 'class_nedir' CLASS'lı bir P elementidir)</p>
<h3 class="class_nedir">Gördüğünüz gibi, son iki paragraf aynı CLASS ismine, dolayısı ile, CSS dosyasında tanımlandığı üzere aynı yazı rengine sahiptir. (Bu da 'class_nedir' CLASS'lı bir H3 elementidir)</h3>
</body>
</html>
Bu dosyamız da about_us.html olsun
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>CSS Kullanımı</title>
<!--<link ... diye başlayan kısma dikkat -->
<link rel="stylesheet" type="text/css" href="style.css" />
<!--css dosyasını html dosyasına bağladık -->
</head>
<body>
<h1>CSS Derslerine Hoşgeldiniz (Bu bir H1 elementidir.)</h1>
<p id="id_nedir">ID bir HTML elementinin eşsiz kimliği olup aynı ID, aynı belge içerisinde bir başka HTML elementine verilemez (Bu 'id_nedir' ID'li bir P elementidir)</p>
<p class="class_nedir">CLASS, ID gibi yine bir HTML elementinin kimliği olup eşsiz değildir ve aynı CLASS birden fazla HTML elementine verilebilir. (Bu 'class_nedir' CLASS'lı bir P elementidir)</p>
<h3 class="class_nedir">Gördüğünüz gibi, son iki paragraf aynı CLASS ismine, dolayısı ile, CSS dosyasında tanımlandığı üzere aynı yazı rengine sahiptir. Burada da gördüğünüz üzere index.html dosyasında kullandığımız style.css dosyasını burada kullandık ve gördük ki CSS HTML dosyasındaki kalabalığı önler ve tek bir dosya ile birden fazla dosyada aynı işlemleri yinelemeksizin uygulamamazı sağlar. Ayrıca farkedeceğiniz üzere class isimlerinde bir değişiklik yoktur. Dilerseniz class adını değiştirmeden P elementi yerine DIV elementi, H3 elementi yerine H6 elementi koyup renk özellklerinin element ne olursa olsun değişmediğini görebilirsiniz. (Bu da 'class_nedir' CLASS'lı bir H3 elementidir)</h3>
</body>
</html>
Son olarak bu da style.css dosyamız
/*style.css*/
/*doğrudan element adını, örneğin aşağıda olduğu gibi "h1" yazarak şekil verirsek,*/
/*bir HTML dosyasındaki tüm "h1" elementleri burada belirtilen şekillendirmeyi taşır*/
h1 {
color:#AFAFAF;
}
/*ID'ler CSS dosyalarında başlarında "#" operatörü ve devamında ID ismi yazılarak tanımlanır.*/
/*ID yalnızca bir elementte bulanabileceği için sadece o ID'yi taşıyan element,*/
/*o ID için tanımlanan şekillendirmeyi alır*/
#id_nedir {
color:#1A8FAC;
}
/*CLASS'lar CSS dosyalarında başlarında "." operatörü ve devamında CLASS ismi yazılarak tanımlanır.*/
/*Aynı CLASS ismi birden fazla elemente verilebildiği için aynı CLASS adını taşıyan tüm elementler*/
/*o CLASS için tanımlanan şekillendirmeyi alır*/
.class_nedir {
color:#FF0000;
}
/*style.css bitti*/
Bu dosyaların herbirini kaydedip browserda açarsan açıklamaları görerek anlaman daha rahat olur. Umarım yardımcı olur._____________________________ Kurumsal Web Siteleri İçin Tercüme Hizmeti
HTML, CSS, JavaScript, jQuery, XML, XPATH, XQuery, PHP
Perl, Ruby, Python and F# Learner
Fedora Linux Addict
Apache Configurator
-
quote:
Orijinalden alıntı: TradeMark
Hemşerimsin ama kusura bakma. Güzel kardeşim internette var mı diyeceğine internete yazsana Fireworks dersleri diye
.
Neyse. CSS dediğin şey, HTML üzerindeki şekillendirme yükünü almak, aynı şekillendirmeyi birden fazla HTML belgesine uygulayabilmek ve bir HTML belgesinin belli bir elemanını ya da aynı şekilendirme özelliği taşıması gereken birden fazla elemanını şekillendirmek için kullanılan stil dosyalarına denir. HTML biliyorsan öğrenmesi basittir.
Açıklama pek açıklayıcı olmayabilir. Hemen örnekleyelim.
Bu dosyamıza index.html diyelim.
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>CSS Kullanımı</title>
<!--<link ... diye başlayan kısma dikkat -->
<link rel="stylesheet" type="text/css" href="style.css" />
<!--css dosyasını html dosyasına bağladık -->
</head>
<body>
<h1>CSS Derslerine Hoşgeldiniz (Bu bir H1 elementidir.)</h1>
<p id="id_nedir">ID bir HTML elementinin eşsiz kimliği olup aynı ID, aynı belge içerisinde bir başka HTML elementine verilemez (Bu 'id_nedir' ID'li bir P elementidir)</p>
<p class="class_nedir">CLASS, ID gibi yine bir HTML elementinin kimliği olup eşsiz değildir ve aynı CLASS birden fazla HTML elementine verilebilir. (Bu 'class_nedir' CLASS'lı bir P elementidir)</p>
<h3 class="class_nedir">Gördüğünüz gibi, son iki paragraf aynı CLASS ismine, dolayısı ile, CSS dosyasında tanımlandığı üzere aynı yazı rengine sahiptir. (Bu da 'class_nedir' CLASS'lı bir H3 elementidir)</h3>
</body>
</html>
Bu dosyamız da about_us.html olsun
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>CSS Kullanımı</title>
<!--<link ... diye başlayan kısma dikkat -->
<link rel="stylesheet" type="text/css" href="style.css" />
<!--css dosyasını html dosyasına bağladık -->
</head>
<body>
<h1>CSS Derslerine Hoşgeldiniz (Bu bir H1 elementidir.)</h1>
<p id="id_nedir">ID bir HTML elementinin eşsiz kimliği olup aynı ID, aynı belge içerisinde bir başka HTML elementine verilemez (Bu 'id_nedir' ID'li bir P elementidir)</p>
<p class="class_nedir">CLASS, ID gibi yine bir HTML elementinin kimliği olup eşsiz değildir ve aynı CLASS birden fazla HTML elementine verilebilir. (Bu 'class_nedir' CLASS'lı bir P elementidir)</p>
<h3 class="class_nedir">Gördüğünüz gibi, son iki paragraf aynı CLASS ismine, dolayısı ile, CSS dosyasında tanımlandığı üzere aynı yazı rengine sahiptir. Burada da gördüğünüz üzere index.html dosyasında kullandığımız style.css dosyasını burada kullandık ve gördük ki CSS HTML dosyasındaki kalabalığı önler ve tek bir dosya ile birden fazla dosyada aynı işlemleri yinelemeksizin uygulamamazı sağlar. Ayrıca farkedeceğiniz üzere class isimlerinde bir değişiklik yoktur. Dilerseniz class adını değiştirmeden P elementi yerine DIV elementi, H3 elementi yerine H6 elementi koyup renk özellklerinin element ne olursa olsun değişmediğini görebilirsiniz. (Bu da 'class_nedir' CLASS'lı bir H3 elementidir)</h3>
</body>
</html>
Son olarak bu da style.css dosyamız
/*style.css*/
/*doğrudan element adını, örneğin aşağıda olduğu gibi "h1" yazarak şekil verirsek,*/
/*bir HTML dosyasındaki tüm "h1" elementleri burada belirtilen şekillendirmeyi taşır*/
h1 {
color:#AFAFAF;
}
/*ID'ler CSS dosyalarında başlarında "#" operatörü ve devamında ID ismi yazılarak tanımlanır.*/
/*ID yalnızca bir elementte bulanabileceği için sadece o ID'yi taşıyan element,*/
/*o ID için tanımlanan şekillendirmeyi alır*/
#id_nedir {
color:#1A8FAC;
}
/*CLASS'lar CSS dosyalarında başlarında "." operatörü ve devamında CLASS ismi yazılarak tanımlanır.*/
/*Aynı CLASS ismi birden fazla elemente verilebildiği için aynı CLASS adını taşıyan tüm elementler*/
/*o CLASS için tanımlanan şekillendirmeyi alır*/
.class_nedir {
color:#FF0000;
}
/*style.css bitti*/
Bu dosyaların herbirini kaydedip browserda açarsan açıklamaları görerek anlaman daha rahat olur. Umarım yardımcı olur.
hocam zaten fireworks dersi alıyorum , html ve css dersi almıyorum . 1 tane çevirme dersi buldum ama linki kırık diğer derslerde ingilizce , türkçe yok
< Bu mesaj bu kişi tarafından değiştirildi recep_37 -- 1 Ekim 2011; 15:37:37 >_____________________________
-
sanalkurs.net bi bak istersen _____________________________
-
quote:
Orijinalden alıntı: gokhanbey
sanalkurs.net bi bak istersen
Evet Orada Güzel Anlatımlar Var Bende Öneririm_____________________________ -
İyi CSS ve HTML bilen, grafik tasarım yönü kuvvetli birinin, PSD to HTML yapmasına çok da gerek yok. Dİirekt CSS yazarak ilerleyebilirsin önce çizip sonra HTML'ye çevirmen ancak iş yükünü arttırır. _____________________________
Sayfa:
1
Ip işlemleri
Bu mesaj IP'si ile atılan mesajları ara Bu kullanıcının son IP'si ile atılan mesajları ara Bu mesaj IP'si ile kullanıcı ara Bu kullanıcının son IP'si ile kullanıcı ara
KAPAT X
Bu mesaj IP'si ile atılan mesajları ara Bu kullanıcının son IP'si ile atılan mesajları ara Bu mesaj IP'si ile kullanıcı ara Bu kullanıcının son IP'si ile kullanıcı ara
KAPAT X




Yeni Kayıt

Konudaki Resimler

Hızlı






