Stil Sayfaları Geliştirmek

Ebat: px
Şu sayfadan göstermeyi başlat:

Download "Stil Sayfaları Geliştirmek"

Transkript

1 A-PDF Split DEMO : Purchase from to remove the watermark 4 Stil Sayfaları Geliştirmek Cascading Style Sheets (CSS) olarak adlandırılan stil sayfaları, metinler ve resimler gibi çeşitli elemanların Web sayfalarınızda nasıl görüneceğini tanımlamanızı sağlar. Cascading (basamaklı) terimi, stillerin sırasını ve öncelik düzeyini tanımlar. Stil (style), tek bir isimle tanımlanan bir dizi biçimlendirme niteliğidir. Bu da Web tarayıcısına bir elemanı nasıl görüntülemesi gerektiğini bildirir. HTML belgelerindeki stiller, biçimlendirme, görünüm ve yerleşim düzeni üzerinde geniş bir kontrol imkânı sağlar. Stillerden faydalanmanın avantajını şöyle özetleyebiliriz: Bir stilin niteliklerinden birinde bir değişiklik yaptığınızda, bu stil tarafından kontrol edilen bütün elemanlar otomatik Bu derste CSS aracılığıyla Dreamweaver daki üç stil tipini (sınıf [class] stilleri, etiket [tag] stilleri ve gelişmiş [advanced] özel stiller) kullanarak metne çeşitli biçimlendirme seçenekleri uygulayacaksınız.

2 olarak güncellenir (stili nasıl oluşturduğunuza bağlı olarak tek bir belgede ya da bütün site genelinde). Font, büyüklük ve renk gibi standart niteliklerden sadece CSS ile erişilebilen gelişmiş netin niteliklerine (satır aralıkları [leading] gibi) kadar pek çok ayarda değişiklik yapabilirsiniz. Stil sayfalarını kullanarak örneğin 1,25 cm lik kenar boşluğuna sahip bir paragraf oluşturabilir, bunun satırlarının arasını 20 punto yapabilir ve metinde kullanılan fontun puntosunu 12 olarak ayarlayabilirsiniz. Böyle bir şeyi CSS olmadan yapamazsınız. Web tarayıcılarının 4.0 ya da daha yeni sürümleri CSS desteğine sahiptir. Internet Explorer 3.0 bazı stil niteliklerini tanısa da eski Web tarayıcıları CSS i görmezden gelir. En iyi sonucu, sürümü 5.0 ve daha yeni olan Web tarayıcıları verir. Bunlar pek çok özelliği destekler. Tek bir sayfayı biçimlendirmek için belgede saklanan bir dahili stili kullanabilirsiniz. Çeşitli belgeleri birden fazla sayfada (aynı metin biçimlendirme özelliklerini koruyacak şekilde) bir bütün olarak kontrol etmek isterseniz bir harici stil sayfasından da faydalanabilirsiniz. Çeşitli belgelerin görünümünü, aynı metin biçimlendirme özelliklerini birden fazla sayfada koruyacak şekilde bir bütün olarak kontrol etmek isterseniz bir harici stil sayfasından da faydalanabilirsiniz. Bu stil sayfası Web sayfasının dışında bulunur ve geçerli sayfaya bağlanır. Böyle durumlarda metinlerin ve sayfa yerleşim düzeninin bütün site içinde tutarlı olmasını sağlamak en iyisidir. Çünkü bu öğeler sayfadan sayfaya ciddi ölçüde değişiklik gösterirse, ziyaretçileriniz başka bir siteye geçtiklerini düşünebilir. Stil sayfalarını kullanmanın diğer bir avantajı da, Web sayfalarının içeriğini biçimlendirmeden ayrı tutabilmeyi sağlamasıdır. Sonuç olarak bu, içeriğinizin görünümü üzerinde daha hassas bir kontrol imkânı sağlar ve Web sitenize içerik eklemek daha hızlı ve daha az karmaşık bir işlem halini alır. İçeriği bu şekilde izole etmek, sitenin güncellenmesi ve devamlılığının sağlanmasını çok daha basit bir hale getirir. Web sayfalarınızın biçimlendirme özelliklerini stil sayfalarıyla kontrol ederek farklı platformlar ve Web tarayıcıları arasında daha uyumlu sayfalar oluşturabilirsiniz. Bu derste, metnin görünümünü etkileyen stillere sahip temel stil sayfaları oluşturmayı öğreneceksiniz. Bu süre içerisinde CSS in özelliklerini öğrenecek ve nasıl çalıştığını kavrayacaksınız. Daha sonra burada öğrendiklerinizi temel bir CSS tabanlı yerleşim düzeni oluşturarak uygulayacaksınız. Kitabın geri kalan kısmında da ilave CSS teknikleri öğrenerek bu becerilerinizi geliştirecek ve metin dışındaki elemanlara da (örneğin Ders 5 te resimlere) stiller uygulayacaksınız. 108 DERS 4

3 Bu dersin sonunda elde edilen sayfalara ait örnekleri görmek isterseniz, Lesson_04_ CSS/Completed klasöründeki index.html ve sangha.css dosyaları ile Lesson_04_CSS/ Completed/about klasöründeki index.html dosyasını açın. Neler Öğreneceksiniz? Bu derste şunları öğreneceksiniz: Bir sayfanın arka plan rengini ayarlayacaksınız. Font, renk ve büyüklük gibi metin niteliklerini uygulayacaksınız. Harici bir stil sayfası oluşturacaksınız. Mevcut bir stil sayfasına stiller ekleyeceksiniz. Bir stili düzenleyeceksiniz. Özel bir stil oluşturacaksınız. Harici bir stil sayfasına bağlantı atayacaksınız. Bir dahili stil oluşturacaksınız. Dahili stilleri harici stillere dönüştüreceksiniz. Temel bir yerleşim düzeni oluşturacaksınız. Yaklaşık Süre Bu dersin tamamlanması yaklaşık 3 saat sürecektir. Ders Dosyaları Başlangıç Dosyaları: Lesson_04_CSS/index.html Lesson_04_CSS/about/index.html Lesson_04_CSS/Text/about.txt Tamamlanmış Proje: Lesson_04_CSS/Completed/index.html Lesson_04_CSS/Completed/about/index.html Lesson_04_CSS/Completed/sangha.css Stİl Sayfaları Gelİştİrmek 109

4 Bir Arka Plan Rengi Belirlemek Dreamweaver da bir sayfanın arka plan rengini Ders 3 te bağlantı renklerini tanımlarken kullandığınız gibi bir palet kullanarak kolayca değiştirebilirsiniz. Bu uygulamada Page Properties iletişim kutusunu kullanarak renk paletini açacak ve index.html belgesinin ark plan rengini değiştireceksiniz. 1. Lesson_04_CSS klasöründeki index.html dosyasını açın. Modify > Page Properties komutunu seçin ve Category listesinden Appearance ı seçin. Page Properties iletişim kutusunu açmak için Cmd+J (Macintosh ta) ya da Ctrl+J (Windows ta) klavye komutlarını da kullanabilirsiniz. Page Properties iletişim kutusunun Appearance ekranında (Dreamweaver da belge penceresinin varsayılan arka plan rengi beyaz olmasına rağmen) sayfa için tanımlanmış herhangi bir varsayılan seçenek olmadığını göreceksiniz. Siz bir arka plan rengi tanımlamazsanız, bir ziyaretçi bu sayfayı ziyaret ettiğinde sayfa, Web tarayıcısının varsayılan rengini (genellikle beyaz) kullanır. Web tarayıcılarının varsayılan ayarları farklı olabildiğinden her zaman sayfa için bir arka plan rengi tanımlamanız tavsiye edilir. 110 DERS 4

5 2. Background Color seçeneğinin renk kutusuna tıklayın. Onaltılık tabanlı kodu #FFFFCC olan soluk sarı renk numunesine tıklayın. Soluk sarı renk (#FFFFCC) sayfanızın arka plan rengi olarak ayarlanacaktır. Rengi, onaltılık tabanlı kodu doğrudan renk kutusunun yanındaki metin alanına yazarak da değiştirebilirsiniz. 3. Page Properties iletişim kutusunu kapatmadan yeni arka plan rengini görmek için Apply düğmesine tıklayın. Sayfanızın arka planı, Page Properties iletişim kutusunda seçtiğiniz açık sarı renge sahip olacaktır. Bir sonraki uygulama için Page Properties iletişim kutusunu açık bırakın. Fontu Değiştirmek Sayfanızın daha ilginç ve daha kolay okunmasını sağlamak için metinleri görüntülemede kullanılan fontları değiştirebilirsiniz. Yazının baskı için kullanılmasıyla ilgili önemli miktarda bilgi mevcuttur; fakat bu bilgilerin tamamı Web de kullanılmaz. Bilgisayar ekranında sans-serif tipindeki fontlar serif tipindeki fontlara göre genellikle daha kolay okunur. Serif tipindeki fontlar normalde basılı medyada kullanılır. Çünkü serif adı verilen çizgi sonlarındaki kıvrımlar karakterlerin daha kolay algılanmasını sağlar. Stİl Sayfaları Gelİştİrmek 111

6 Ama bilgisayar ekranında bu kıvrımlar harflerin birbirinden ayırt edilmesini zorlaştırır; Özellikle de uzun metinlerde ya da söz konusu metinde kullanılan fontun küçük olması durumunda. Bir sayfadaki yazı akışının tarayıcıdan tarayıcıya ve bilgisayardan bilgisayara farklılık gösterebileceği konusu da dikkate alınmalıdır. Dreamweaver, font seçeneklerini tanımlamak için eski bir yöntem olan font etiket nitelikleri kullanmak yerine entegre CSS stillerinden faydalanır. Aşağıdaki uygulamada da göreceğiniz gibi bütün bir sayfada kullanılan fontu ya da sayfada seçili durumdaki bir metnin fontunu değiştirebilirsiniz. 1. Page Properties iletişim kutusunun Appearance kategorisindeki Page font menüsünden Arial, Helvetica, sans-serif i seçin. OK düğmesine tıklayarak Page Properties iletişim kutusunu kapatın. Sayfadaki metnin tamamı seçtiğiniz fontla biçimlendirilecektir: Arial, Helvetica, sansserif. Daha sonra bu sayfaya ekleyeceğiniz bütün metinlerde aynı font kullanılacaktır. Page Properties iletişim kutusu bir dizi etiketi (body, td, th) seçilen font nitelikleriyle yeniden tanımlamak için dahili bir CSS stili oluşturacaktır. Harici CSS stillerini bu derste daha sonra göreceğiz. Page Properties iletişim kutusundaki Appearance kategorisinin Page Font menüsünde listelenen font kombinasyonları Web tarayıcısına metni seçilen gruptaki bir fontla (ziyaretçilerin bilgisayarında yüklü fontlara bağlı olarak) görüntülemesi gerektiğini 112 DERS 4

7 bildirir. Font grubundaki ilk seçenek kullanılamıyorsa tarayıcı ikinci seçeneği kullanmaya çalışır. İkinci font da kullanılamıyorsa üçüncü fontu kullanır. Kullanıcın bilgisayarında kombinasyondaki fontlardan hiçbiri yoksa, metin, tarayıcının varsayılan fontuyla görüntülenir. 2. Sayfanın üst kısmındaki Anusara Yoga in the Heart of San Francisco s Mission District metnini seçin. Properties denetçisindeki Font menüsünden Courier New, Courier, monospace i seçin. Etiket satırı için seçtiğiniz font, sayfa için ayarlanan varsayılan font grubunun yerine geçer. Properties denetçisindeki Font menüsünde yer alan font kombinasyonları, Page Properties iletişim kutusundaki Appearance kategorisinin Page Font menüsünde listelenen font kombinasyonlarıyla aynıdır. Bağlam menüsüne erişmek üzere sağ tıkladığınızda (Macintos ta ve Windows ta) ya da Ctrl tuşunu basılı tutup tıkladığınızda belge penceresinde seçili durumda bulunan metne bir dizi biçimlendirme seçeneğini doğrudan uygulayabilirsiniz. Sitenin ziyaretçilerinin metinleri sizin seçtiğiniz fontlarla yazılmış olarak görebilmesi için bu fontların ziyaretçilerin bilgisayarında yüklü olması gerekir. Nasıl olsa herkesin bilgisayarında her font yüklüdür diye düşünmeyin. Temel işletim sistemine dahil olmayan fontlar ziyaretçilerinizin bilgisayarında muhtemelen olmayacaktır. Ayrıca Macintosh ta bulunan her font Windows ta bulunmaz. Dreamweaver ın varsayılan font setlerinde verilen font genellikle çoğu bilgisayarda mevcuttur (hem Macintosh ta, hem de Windows ta). Ziyaretçilerinizin bilgisayarında olmama ihtimali bulunan bir font kullanmak istiyorsanız, bu fontla yazılan metnin yerine kullanabileceğiniz bir resim oluşturmanız tavsiye edilir. Bu teknik genellikle üstbilgiler, asıl başlıklar, vs için kullanılır. Uzun metinler için resim kullanılması tavsiye edilmez, çünkü bu durumda erişilebilirlik kısıtlanır ve içeriğin güncellenmesi daha zor olabilir. Font kombinasyonları (Arial, Helvetica, sans-serif gibi) kullanışlıdır, ama bunlar sizin kullanmak istediğiniz bütün özel fontları içermeyebilirler. Font kombinasyonlarında Stİl Sayfaları Gelİştİrmek 113

8 değişiklik yapmak üzere Properties denetçisinin Font açılır menüsünden Edit Font List komutunu seçerek ya da Text > Font > Edit Font List komutunu kullanarak Edit Font List iletişim kutusunu açabilirsiniz. Edit Font List iletişim kutusunu kullanarak font setlerinde aşağıdaki gibi bir dizi değişiklik yapabilirsiniz. Mevcut bir kombinasyona font eklemek isterseniz: Font list alanından değişiklik yapmak istediğiniz font kombinasyonunu seçin ve Available fonts listesine eklemek istediğiniz fontu seçin. Sonra da Chosen fonts listesiyle Available fonts listesinin arasındaki sol tarafı gösteren oka tıklayarak ilgili fontu Chosen fonts listesine ekleyin. Mevcut bir kombinasyondan font silmek isterseniz: Üzerinde değişiklik yapmak istediğiniz font kombinasyonunu ve Chosen fonts listesinden silmek istediğiniz fontu seçin. Ardından Chosen fonts listesiyle Available fonts listesinin arasındaki sağ tarafı gösteren düğmeye tıklayarak ilgili fontu Chosen fonts listesinden silin. Bir font kombinasyonu eklemek için: Font list alanındaki Add fonts in list below seçeneğini işaretleyin. İlave font kombinasyonları için iletişim kutusunun sol üst köşesindeki artı işaretli düğmeye (+) tıklayın ve Font list alanındaki yeni Add fonts in list below seçeneğini işaretleyin. Bir font kombinasyonunu silmek için: Fonts list alanında silmek istediğiniz font kombinasyonunu seçin ve iletişim kutusunun sol üst köşesindeki eksi işaretli düğmeye (-) tıklayın. Sisteminizde bulunmayan bir fontu eklemek için: Available fonts listesinin altındaki metin alanına ilgili fontun adını yazın ve solu gösteren düğmeye tıklayarak bu fontu kombinasyona ekleyin. Siteminizde bulunmayan bir fontu eklemeniz faydalı olacaktır. Örneğin Macintosh ta çalışırken Windows a özgü bir fontu tanımlayabilirsiniz. Doğru font adını kullandığınızdan emin olun. Font kombinasyonlarının sırasını değiştirmek için: İlgili kombinasyonu seçin ve iletişim kutusunun sağ üst köşesindeki yukarı aşağı ok düğmelerinden uygun olanına tıklayın. 114 DERS 4

9 Edit Fonts List iletişim kutusundaki Available fonts listesi, bilgisayarınızda bulunan fontları içerir. 3. Dosyayı kaydedin ve Web tarayıcınızda önizleyin. Tarayıcıdaki metin, seçmiş olduğunuz fontla görüntülenecektir. Bu, bilgisayarınızda yüklü durumdaki fontlara bağlıdır. Bir sayfada önce silmek istediğiniz fontun kullanıldığı metni seçerek sayfadaki font ayarlarını silebilir ve seçili metni varsayılan ayarlarına döndürebilirsiniz. Properties denetçisinde Font açılır menüsündeki Default Font seçeneğini işaretleyin ya da Text > Font > Default Font komutunu seçin. Font Boyutunu Değiştirmek Dreamweaver, aralarında 9 ile 36 arasında belirli aralıklarla değişen sayısal değerler, xx-small ile xx-large arasında değişen göreceli değerler ve aralarında smaller ve larger seçeneklerinin de bulunduğu birçok hazır font boyutu seçeneğine sahiptir. Bu seçeneklerin tümü metin büyüklüğünü tanımlamak için CSS kullanır. Dreamweaver ı kullanarak ve bütünleşik CSS özellikleri aracılığıyla sayfalarınızdaki metinler üzerinde büyük ölçüde kontrol imkânına sahip olursunuz. Gelişmiş CSS özelliklerini bu derste daha sonra göreceğiz. İyi Kod Yazma Prensipleri: Font Etiketinin Kullanımdan Kaldırılması HTML 4.01 de font etiketi (metin özelliklerini tanımlayan bir etiket) artık benimsenmeyen etiketlerin arasına eklenmiştir, yani standart araçların arasından çıkarılmıştır; ancak şu anda da Web tarayıcıları tarafından desteklenmeye devam etmektedir. Font etiketi, açılış ve kapanış etiketleriyle metinlerin etrafını şu şekilde sarar: <font face= Arial, Helvetica, sans-serif >Yoga Sangha</font> Font etiketinin nitelikleri metinlerin görünümü üzerinde minimum düzeyde kontrol imkânı sağlarken, Web geliştiricileri CSS aracılığıyla metni çok daha hassas bir şekilde kontrol edebilirler. Dreamweaver, gerektiğinde (örneğin çok eski sayfalar [1 Kasım 2001 den önce oluşturulan Web sayfaları] üzerinde çalışılırken) kullanılmak üzere çeşitli araçlar sağlayarak font etiketini tanır ve destekler. Günümüz standartlarına uygun etkili sayfalar oluşturmak için mümkün olan her yerde CSS kullanın ve font etiketini kullanmaktan kaçının. Stİl Sayfaları Gelİştİrmek 115

10 Macintosh ve Windows arasında font boyutu anlamında önemli farklar vardır. Windows yüklü bir bilgisayarda görüntülenen bir metnin aynısı Maintosh ta % 25 daha küçük görünür. Yani Macintosh lardaki metinlerin büyüklüğü, Windows yüklü bilgisayarlardaki metinlerin dörtte üçü kadardır. Kullanıcılar font boyutunu değiştirebilir; ama bu, sayfa tasarımını etkileyebilir. Sayfalarınızı bu olasılıkları hesaba kararak test edip tasarlarsanız daha fazla ziyaretçiye ulaşan esnek bir Wen sitesi hazırlayabilirsiniz. Sayfanın üst kısmındaki At Yoga Sangha, we re dedicated paragrafını seçin. Properties denetçisinin Size menüsünden 12 değerini seçin. Birim ayarının varsayılan seçeneği olan pixels i değiştirmeyin. Properties denetçisinin Appearance bölümünü kullanarak belge için varsayılan bir metin büyüklüğü de ayarlayabilirsiniz. Paragrafın metin boyutu biraz küçülecek ve sayfadaki geri kalan metinden (henüz boyut ayarıyla biçimlendirilmedi) biraz daha küçük görünecektir. Size alanına bir değer yazabilir ya da hazır değerlerden birini seçebilirsiniz. Sayfanızda ilk kez kullanılan bir nitelik ya da niteliklerden oluşan bir kombinasyon (boyut gibi) seçtiğinizde Dreamweaver, Properties denetçisindeki Style menüsünde listelenen yeni bir stil oluşturur. Daha sonra yazdığınız ve bu boyutla tanımlanan her metin aynı stili kullanacaktır. Font, boyut ve renk biçimlendirme özelliklerinin her benzersiz kombinasyonuyla yeni stiller oluşturulur. Bu stiller sayısal bir sıraya göre otomatik olarak oluşturulan genel isimlere sahiptir (style1, style2, vs). Etkin durumdaki, yani Properties denetçisindeki Style menüsünde görüntülenen bir stili Style menüsüne tıklayıp Rename komutunu seçerek yeniden adlandırabilirsiniz. Bir stili etkin stil haline getirmek istiyorsanız, imleci bu metnin kullanıldığı metnin içine yerleştirin. Seçili durumdaki metin için herhangi bir büyüklük belirtilmediyse Size menüsünde None yazısını görürsünüz. Web tarayıcıları, büyüklük tanımı yapılmamış metinleri varsayılan büyüklükte görüntüler. Bu da Size menüsündeki 14 değerine eşittir. Ancak ziyaretçilerin tarayıcılarında yaptığı tercih ayarlarına bağlı olarak bu değer tarayıcıdan tarayıcıya farklılık gösterebilir. Size menüsündeki sayısal font büyüklüğü seçenekleri tanıdık gelebilir. Çünkü bunlar kelime işlem programlarındaki standart büyüklük değerlerine benzerler. 116 DERS 4

11 Eğer font boyutu ayarlarını silmek ve varsayılan ayarlara dönmek isterseniz, önce değiştirmek istediğiniz metni seçin ve sonra da Properties denetçisindeki Style menüsünden None u seçin ya da Text > CSS Styles > None komutunu seçin. Font Boyutlarının Karşılaştırılması: Font Etiketi ve CSS Bir Web geliştiricisi olarak modası geçmiş <font> etiketinin kullanıldığı sayfalar üzerinde çalışmanız da gerekebilir. Dolayısıyla bu konuyla ilgili boyutları ve seçenekleri yakından tanımanız gerekir. Böyle durumlarda bütün <font> etiketlerini silerek ve CSS stilleri yaratarak çalıştığınız sistemi değiştirip CSS kullanabilirsiniz. Bul ve Değiştir (Find and Replace) özelliğini kullanarak (bu konuyu Ders 17 de göreceksiniz) bir sitedeki <font> etiketlerini kolayca kaldırabilirsiniz. Aşağıdaki tabloda Properties denetçisinde bulunan Size menüsündeki değerlerle eski <font> etiketi boyut seçenekleri karşılaştırılmıştır. Göreceli Değerler Mutlak Değerler Font Etiket Sayısal Size menüsünde Size menüsünde Boyutları Değerler* (CSS tabanlı) (CSS tabanlı) xx-small x-small / smaller None (varsayılan) 3 14 small medium / larger large +3 6 x-large 36** +4 7 xx-large * Ölçü birimleri menüsündeki varsayılan ayar olan pixels kullanılmıştır. ** Bu sayısal değer x-large (6) seçeneğinden biraz daha büyük ve xx-large (7) seçeneğinden de biraz küçüktür. <font> HTML etiketi metin büyüklüklerini mutlak (1 ile 7 arası) ya da göreceli (+1 ile +7 arası ve -1 ile -7 arası) olarak tanımlar. Bir mutlak sayı seçtiğinizde büyüklük ayarlanır (1 en küçük, 7 en büyüktür). Bir Web tarayıcısında metinler için varsayılan taban boyut değeri üçtür. Pozitif ya da negatif bir sayı seçtiğinizde font boyutu, o fontun taban boyut değerine göre ayarlanır. Örneğin +1 pozitif değeri font boyutunu taban boyut değerinden bir büyük olacak şekilde ayarlar. Font boyutu değeri olarak +3 ü seçerseniz aslında boyutu + yapmış olursunuz (3 + 3). Font boyutunun en büyük değeri 7, en küçük değeri de 1 dir. 7 den büyük bütün HTML font boyutları 7 olarak görüntülenir. Örneğin font boyutunu +6 olarak ayarlarsanız 3+6 değeri 7 den büyük olur ama font boyutu olarak 7 kullanılır. Bunlar, <font> HTML etiketinin kısıtlamalarıdır ve CSS i etkilemezler. CSS, metin özelliklerini tanımlamak için kullanılan daha esnek ve çok yönlü bir yöntemdir. Stİl Sayfaları Gelİştİrmek 117

12 Font Rengini Tanımlamak Önceki derste yaptığımız gibi bir sayfanın arka plan rengini değiştirdiğinizde görüntüyle ilgili sorunlara yol açmamak için görüntülenecek metnin rengini de değiştirmeniz gerekebilir. Örneğin siyah arka plan üzerinde siyah bir metin görünmez. Belgeniz için bir renk düzeni seçerken uyumlu renk kombinasyonları seçmeye ve renklerin arasında yeterli derecede kontrast (karşıtlık) olmasına özen gösterin. Birbirine çok yakın renkleri ayırt etmek (tamamlayıcı renklerde de olabildiği gibi) özellikle bilgisayar ekranında çok zor olabilir. Aşağıdaki uygulamada index.html belgesinin varsayılan font rengini değiştireceksiniz. 1. Modify > Page Properties komutunu seçin ve Category listesinde Appearance ın seçili olduğundan emin olun. Page Properties iletişim kutusunun Appearance bölümü, belgeyle ilgili birçok özelliği ayarlamanızı sağlayan pek çok seçenek içerir. 2. Text color seçeneğinin renk kutusuna tıklayın. Bu derste daha önce belgenin arka plan rengini belirlemek için kullandığınıza benzer bir renk paleti açılacaktır. 3. Onaltılık tabanlı kodu # olan koyu kırmızımsı siyah rengi seçin ve OK düğmesine tıklayın. Metin alanına onaltılık tabanındaki renk kodunu yazabilir veya renk numunelerini kullanarak bir renk seçebilirsiniz. Siz OK düğmesine tıkladıktan sonra Page Properties iletişim kutusu kapanır ve belgenize dönersiniz. 118 DERS 4

13 Text > Color komutunu seçerek ilave bir Colors iletişim kutusuna erişebilirsiniz. Onaltılık tabanlı renk kodlarını doğrudan Properties denetçisindeki Text Color renk seçicisinin yanındaki renk metin alanına girmek de mümkündür. 4. Welcome to Yoga Sangha metnini seçin. Properties denetçisindeki Text Color kutusuna tıklayın ve normal bir turuncu renk (#FFCC33) seçin. Font ve font boyutu seçeneklerine benzer şekilde font rengi de Dreamweaver da CSS stilleri aracılığıyla tanımlanır. Daha önce bir renk uygulayarak yeni bir stil oluşturmuştunuz. Properties denetçisindeki Style menüsünde stilin adını görebilirsiniz. Eğer font, font boyutu ya da renk nitelikleriyle denemeler yaparak ilave stiller oluşturduysanız, stilinizin numarası örneklerde gösterilenlerden farklı olabilir. Stili olan bir metne font, font boyutu veya renk seçenekleri uygularsanız, seçili metnin söz konusu stilin tek örneği olması durumunda yeni nitelikler eski stile eklenecektir. Eğer aynı stilin başka örnekleri mevcutsa veya yeni nitelikleri stili olan bir metnin sadece bir kısmına uygularsanız, Dreamweaver yeni bir stil oluşturacaktır. Metne stil uygularken stillerinizi düzenli bir şekilde tutmanız iyi olur. Metin niteliklerini rasgele uygulamamaya çalışın, çünkü Dreamweaver her yeni kombinasyon için yeni stiller oluşturur. Sadece gerektiğinde diğer nitelikleri kalıtım (inheritance) yoluyla alan organize stillerden oluşan bir sistem oluşturun. Kalıtım konusuyla ilgili ayrıntıları bu derste daha sonra göreceğiz. Stİl Sayfaları Gelİştİrmek 119

14 Sitenizde kullanılan onaltılık tabanlı renkleri Assets paneli aracılığıyla takip edebilirsiniz. Assets paneli Files panel grubunda yer alır. Assets panelini Window > Assets komutunu seçerek de açabilirsiniz. Renk varlıklarına erişmek için Assets panelinin sol sütunundaki Colors simgesine tıklayın. Assets panelinin üst tarafında yer alan radyo düğmeleri renkleri görmek için size iki seçenek sunar: Site ve Favorites. Site radyo düğmesine tıkladığınızda Yoga Sangha proje sitesinde ya da o anda etkin durumda bulunan sitede kullanılan renkler görüntülenir. Sitenizde herhangi bir renk kullanmadıysanız listede renk görmezsiniz. Renkleri tanımladıysanız, fakat listelenmiş olarak görmüyorsanız, panelin sağ alt köşesindeki Refresh Site List düğmesine tıklayın. Bu listede henüz kullanmadığınız renkleri göreceksiniz. Çünkü Yoga Sangha proje sitesinin diğer ders klasörlerindeki belgelerde kullanılan başka renkler de vardır. Kullandığınız renklerin bütün sitede tutarlı olmasını sağlamak için çok kullanılan renkleri Assets panelinde Sık Kullanılanlar (Favorites) olarak kaydedebilirsiniz. Sık kullanılan bir rengi kaydetmek isterseniz, istediğiniz rengi Site listesinden seçin ve Assets panelinin sağ alt köşesindeki Add to Favorites düğmesine tıklayın. Dreamweaver, ilgili rengin Favorite (Sık Kullanılanlar) listenize eklendiğini bildiren bir iletişim kutusu görüntüleyecektir. Favorites listesini görmek için Assets panelinin üst kısmındaki Favorite radyo düğmesine tıklamanız gerekir. Assets panelini resimleri yönetmek için Ders 5 te kullanacaksınız. Assets paneli sekmesi Site seçeneği Favorites seçeneği Colors simgesi 120 DERS 4 Refresh Site List Add to Favorites

15 Stillerin İncelenmesi Şu ana kadar bu dersin önceki uygulamalarında bir dizi CSS stili kullandınız. Bu dersin başında bir metni Properties denetçisini kullanarak font, font büyüklüğü ve renk nitelikleri ile biçimlendirmeye başladınız. Dreamweaver da bir yandan ilgili CSS stillerini oluşturuyordu. Siz bir sayfada niteliklerden oluşan yeni bir kombinasyon oluşturduğunuzda Dreamweaver ın da yeni bir stil oluşturduğunu ve bu yeni stilin Properties denetçisindeki Style menüsünde listelendiğini gördünüz. Şu ana kadar arka plan rengi, Ders 3 teki bağlantıların farklı durumlarına ait renkler ve bu dersin başındaki varsayılan font ayarları gibi çeşitli sayfa özellikleriyle de çalışma fırsatı buldunuz. Bütün bu nitelikler Dreamweaver da CSS stilleriyle kontrol edilir. Şimdiki uygulamada bir stil sayfasının (style sheet) ne olduğunu ve nasıl çalıştığını öğreneceksiniz. 1. index.html belgesi açık durumdayken Document araç çubuğunun sol üst kısmındaki Split düğmesine tıklayın. Split (Show Code and Design Views) Belge penceresinde, derslerde şu ana kadar kullandığınız Design görünümüyle birlikte buradaki tasarıma karşılık gelen kodlardan oluşan bölünmüş bir ekran göreceksiniz. Bu görünümü Ders 16 da daha yoğun bir şekilde kullanacaksınız. Varsayılan durumda Code görünümü belge penceresinin üst kısmında, Design görünümü de altta yer alır. Stİl Sayfaları Gelİştİrmek 121

16 Bu görünümlerin büyüklüğünü, imleci bu iki görünümü ayıran çubuğun üzerine yerleştirerek ayarlayabilirsiniz. İmleç iki uçlu bir oka dönüştüğünde, üzerine tıklayarak çubuğu istediğiniz gibi sürükleyebilirsiniz. 2. Code görünümünde aşağıdaki ifadeyi görene kadar ekranı yukarıya kaydırın. <style type= text/css > <! a:link { color: #FF3300; } Burada gördüğünüz kod, bu sayfada kullanılan stillere ait bütün bilgileri içeren bir stil sayfasının başlangıcını gösterir. Bu, bir dahili stil sayfası (internal style sheet) olarak adlandırılır, çünkü belgeye gömülü durumdadır. Önceki derslerde Properties denetçisi ve Page Properties iletişim kutusu kullanılarak oluşturulan bütün stiller dahili stildi. Siz bir metin biçimlendirmesi ya da sayfa özellikleri tanımladığınızda Dreamweaver 8 otomatik olarak bu stilleri oluşturur. CSS stilleri ve stil sayfası ekleri belgenin <head> ve </head> etiketlerinin arasına yerleştirilir. CSS te bir stil sayfası (style sheet), stillerden oluşan bir gruptur. Bir stil (genellikle kural [rule] olarak bilinir), belirli bir elemanın görünümünü tanımlayan ve kontrol eden bir özellikler grubudur. index.html belgesine ait kodda stil sayfası <style type= text/css > (stil sayfasını tanımlar) ve </style> (stil sayfasını sonlandırır) arasındaki her şeydir. a:link { color: #FF3300; } kodu tek bir stili (ya da kuralı) temsil eder. Buradaki stil sayfasında, sayfanın arka plan rengini ayarladığınız zaman oluşturulan aşağıdaki kodu görürsünüz. body { background-color: #FFFFCC; } Kurallar, seçiciler ve bildirimlerden meydana gelir. Seçici (selector), tanımlanan elemanın kendisidir. Bildirim (declaration) ise, özellikler ve bunların değerlerinin kombinasyonudur. Özellikler (properties), görünümü kontrol eden nitelikleri, değer de belirtilen nicelik ya da formattır. Bir stilin yapısı şu şekildedir: seçici { özellik: değer } ve özellik: değer ifadesi de bildirimdir. Örneğin aşağıdaki stilde body { background-color: #FFFFCC } tanımlanan eleman body seçicisidir. { background-color: #FFFFCC } bildirimi, özelliklerin ve değerlerin kombinasyonudur. Belirtilen arka plan elemanının niteliği, background-color (arka plan rengi) özelliğidir. Rengi tanımlayan değer de #FFCCCC dir. 122 DERS 4

17 Dahili Stillerle Çalışmak Dahili stiller sadece geçerli belgede tanımlanan kullanılan stillerdir. Sitenizdeki tek bir sayfa için bir stil tanımları oluşturacaksanız dahili stilleri kullanabilirsiniz. Eğer sitenizde birden fazlanın uyumlu bir görünüme sahip olmasını istiyorsanız, harici bir stil sayfası oluşturmanız ve bu stil sayfasını aynı görünüme sahip olmasını istediğiniz her belgeye bağlamanız gerekir. Mümkün olan her yerde harici stil sayfaları kullanmanız tavsiye edilir. Harici stiller diğer belgelerdeki stilleri kullanabilmenizi sağladığı için çok kullanışlıdır. Ayrıca, harici stiller için kullanılan biçimlendirme kodu ortak bir harici belgede saklandığı için bu stil sayfasını kullanan Web sayfaları biçimlendirme bilgilerini tekrar tekrar yüklemek zorunda kalmaz. Bu da daha az kod kullanılmasını sağlar ve böylece sayfalar daha hızlı yüklenir. Bunlara ek olarak, hepsi aynı yerde bulunduğu için stillerin güncellenmesi de daha kolay olur. Harici stillerin oluşturulmasını bu derste daha sonra göreceğiz. Şu ana kadar oluşturduklarınızın hepsi dahili stillerdi. Önceki uygulamada gördüğünüz stil sayfası da dahili bir stil sayfasıdır, yani tümüyle index.html belgesinin içinde saklanmaktadır. 1. CSS panel grubunda yer alan CSS Styles panelini açın ve panelin üst kısmında yer alan All düğmesine tıklayın. Eğer CSS Styles paneli açık değilse, Window > CSS Styles komutunu seçerek bu panele erişebilirsiniz. Stİl Sayfaları Gelİştİrmek 123

18 CSS Styles panelinde, sayfa özelliklerini tanımladığınızda oluşturulan stillerin bir listesi bulunur. Bütün dahili stillerin listesini görmek için CSS Styles panelinin üst kısmındaki <style> grubunu genişletmeniz gerekebilir. 2. CSS Styles panelinin alt kısmındaki New CSS Rule simgesine tıklayın. New CSS Rule düğmesi New CSS Rule iletişim kutusu açılacaktır. Bu iletişim kutusunu Text > CSS Styles > New komutunu seçerek de açabilirsiniz. 124 DERS 4

19 Dreamweaver da kullanabileceğiniz üç farklı seçici tipi (stiller tarafından tanımlanan eleman türleri) vardır: Class: Bu seçici tipi, belirli bir elemana bağlı olmayan sınıflar yaratmanızı sağlar. Tek bir sınıfı pek çok farklı elemana uygulayabilirsiniz. Sınıflar, başlarına konan nokta işaretiyle gösterilirler. Tag: Bu seçici tipi, stil tarafından yeniden tanımlanacak olan bir eleman olarak bir HTML etiketini belirlemenizi sağlar. Etiketin varsayılan görünümü stil tarafından değiştirilir. Advanced: Bu seçici tipi, özel etiket kombinasyonları için kullanılan stiller oluşturmanızı sağlar (bağlamsal seçiciler). Bu seçici tipi ayrıca ID ler oluşturmanızı sağlar ve önemli bir istisna dışında sınıflara benzerler: ID ler belirli bir elemanı benzersiz bir şekilde tanımlama yöntemi olarak sayfa başına sadece tek bir kez kullanılabilirler. Benzersiz yapılarından ötürü ID ler genellikle script yazma amacıyla kullanılır ve bir diyez işaretiyle (#) gösterilirler. 3. New CSS Rule iletişim kutusunun Selector Type alanındaki Class seçeneğini işaretleyin. Metin alanı, özel bir stil yaratmayı mümkün kılmak için Name adında bir metin alanına dönüşecektir. Dreamweaver genel isimleri otomatik olarak sayısal bir sırayla verir:.unnamed1,.unnamed2, vb. Bu isimler pek açıklayıcı değildir ve birden fazla sınıf oluşturuyorsanız işinizi gerçekten de zorlaştırabilirler. Stillerinize hangi amaçla kullanıldıklarını açıklayan kısa isimler verme alışkanlığını edinin. 4. Name metin alanına sınıfınızın ismi olarak.dayname yazın. İsmin önüne bir nokta koymak gerekir. Eğer noktayı silerseniz Dreamweaver ismin önüne bu noktayı otomatik olarak ekleyecektir (gösterilmese bile). Stilin görünüm nitelikleri yerine işlevini açıklayan isimler atama alışkanlığını edinmek en iyisidir. İşlevi açıklayan isimler özellikle konuşma tabanlı Web tarayıcılarında daha kolay erişim sağlarlar. 5. Define In alanındaki This document only seçeneğini işaretleyin ve OK düğmesine tıklayın. Stİl Sayfaları Gelİştİrmek 125

20 This document only seçeneği, yeni bir dahili stil oluşturduğunuzu gösterir. CSS Rule definition for.dayname iletişim kutusu açılacaktır. 6. CSS Rule Definition iletişim kutusunun Type kategorisinde Size değerini 12 pixels, Weight seçeneğini bold, Variant seçeneğini small-caps ve Color seçeneğini siyah (#000000) olarak ayarlayın. Diğer bütün seçenekleri tanımlanmamış olarak bırakın ve OK düğmesine tıklayın. Yeni oluşturduğunuz sınıfın CSS Styles panelindeki stil listesinde görüntülendiğine dikkat edin. 126 DERS 4

21 .dayname kuralını yeni oluşturduğunuz için, CSS Styles panelinin en üst kısmında yer alan All Rules listesinde bu kural otomatik olarak seçilecektir. Panelin alt kısmında seçili durumdaki kurala ait özelliklerin yer aldığı bir liste bulunur. Özellikler soldaki sütunda, bunların değerleri de sağdaki sütunda yer alır. Varsayılan durumda özellikler sadece, değerleri tanımlanmış özelliklerin listelendiği Show Only Set Properties modunda görüntülenir. Özellikler için kullanılan iki ilave görüntüleme modu daha mevcuttur: Show List View ve Show Category View. Show List View nitelik listesinin tamamını görüntüler, Show Category View ise nitelik listesini CSS Rule Definition iletişim kutusundakilerle aynı kategorilerde düzenlenmiş olarak gösterir. CSS Styles panelinde seçili durumdaki bir kuralı düzenlemenin birçok yolu vardır: Mevcut özelliklerin değerlerini değiştirmek: Özellik değerlerini doğrudan özellikler listesinde ilgili değere tıklayıp karşılık gelen menülere erişerek değiştirebilirsiniz. Yeni özellik ve değer eklemek: Show Only Set Properties modunda özellikler listesini görüntülerken listenin alt kısmındaki Add property bağlantısına tıklayarak yeni özellik seçmek için kullanabileceğiniz bir menüye erişebilirsiniz. Özellikler listesini Show Category View veya Show List View modunda görüntülerken listedeki bir özelliğe, ilgili özelliğin değer (value) alanına tıklayarak bir değer ekleyebilirsiniz. Kuralı düzenlemek için iletişim kutusunu kullanmak: Panelin alt kısmındaki Edit Style düğmesine tıklayarak CSS Rule definition iletişim kutusunu açabilirsiniz. Sınıflar sayesinde belgenizin biçimlendirme özellikleri üzerinde ciddi ölçüde kontrol imkânına sahip olursunuz. Sınıfları bir kelime işlem programındaki stillerle aynı şekilde uygulayabilirsiniz. Yani metni seçer ve sonra da stili uygularsınız. Bu stili metin bloklarına ya da metin bloğu içinde yer alan sözcüklere tek tek uygulayabilirsiniz. Sıradaki adımlarda dayname sınıfını madde imli listedeki belirli öğelere uygulayacaksınız. 7. index.html belgesindeki Schedule listesinde yer alan Monday sözcüğünü seçin. Stili uygulamak için Properties denetçisindeki Style menüsünden dayname i seçin. dayname i listedeki diğer günlere uygulamaya devam edin. Seçilen metin, dayname sınıfının özelliklerini yansıtacak şekilde değişecektir. Stili uyguladıktan sonra Code görünümünde seçilen sözcüğün önünde <span class= dayname > ifadesinin olduğunu göreceksiniz. Buradaki span ifadesi, Stİl Sayfaları Gelİştİrmek 127

22 elemanlardan oluşan seçimi, class da <span> (açılış etiketi) ile </span> (kapanış etiketi) arasında yer alan metne uygulanan stili tanımlar. <span> etiketi, büyük bir metin bloğundaki çeşitli sözcükler gibi öğeleri tanımlayan bir satıriçi elemandır. Bütün blokları (paragraf gibi) tanımlayan bir blok düzeyi elemanı olan <div> etiketine benzer. Metindeki stil biçimlendirme özelliğini kaldırmak isterseniz, ekleme noktasını metnin içine yerleştirin ve Properties denetçisindeki Style menüsünde None seçeneğini işaretleyin. Stil ve ona ait biçimlendirme özellikleri metinden kaldırılacak, ancak stil yine stil sayfasında kalacaktır. 8. CSS Styles panelindeki New CSS Rule düğmesine tıklayın. Selector Type seçeneğini Class olarak ayarlayın, Name metin alanına.highlight yazın ve Define In alanında This Document Only seçeneğini işaretleyin. OK düğmesine tıklayın. CSS Rule Definition for.highlight iletişim kutusu açılacaktır. 9. CSS Rule Definition iletişim kutusunda soldaki Category listesinden Background u seçin. CSS Rule Definition iletişim kutusu, arka plan seçeneklerini gösterecek şekilde değişecektir. 128 DERS 4

23 10. Background Color seçeneğini beyaz (#FFFFFF) olarak ayarlayın ve OK düğmesine tıklayın. Yeni oluşturduğunuz highlight sınıfı CSS Styles panelindeki kural listesinde belirecek ve Properties denetçisindeki Style menüsünde de kullanılabilir hale gelecektir. 11. Announcements bölümünde ilk olay başlığını (Intro to Anusara Workshop) seçin ve Properties denetçisindeki Style menüsünü kullanarak highlight stilini uygulayın. Metin beyaz renkle vurgulanacaktır. Bu uygulamada oluşturduğunuz yeni stiller (dayname ve highlight), tıpkı bu derste daha önce Properties denetçisi aracılığıyla metin özelliklerini ayarlarken Dreamweaver ın oluşturduğu stiller gibi, Style menüsünde sahip oldukları özelliklere ait görsel işaretlerle görüntülenecektir. Gömülü stil sayfasındaki bir dahili stili silmek isterseniz, CSS Styles panelinde ilgili stili seçtikten sonra panelin sağ alt köşesindeki Delete CSS Rule simgesine tıklayabilirsiniz. Bu işlemi yaptığınızda stil ilgili stil sayfasından silinecektir. Artık bu stil tanımı mevcut olmadığından, bu stilin uygulandığı hiçbir metinde, silinen stil tarafından tanımlanan nitelikleri göremezsiniz. Bununla birlikte, bir stili CSS Styles panelinden silmekle stili Properties denetçisindeki Style menüsünde None seçeneğini işaretleyerek silmenin aynı şey olmadığını unutmayın. Bir stil ait olduğu stil sayfasından silindiğinde, silinen stile ait referanslar (bir stili uyguladığınızda koda eklenirler) belgede kalacaktır. Referansları da silmek isterseniz, Ders 17 de göreceğimiz Find & Replace (Bul ve Değiştir) özelliğiyle bunu hızlı bir şekilde gerçekleştirebilirsiniz. Özellikler listesinde tek bir özelliği seçip Delete CSS property simgesine tıklayarak kuralların özelliklerini silmek de mümkündür. index.html dosyasını kaydedebilir ve bir sonraki uygulama için açık bırakabilirsiniz. Stİl Sayfaları Gelİştİrmek 129

24 Dahili Stilleri Harici Stillere Dönüştürmek Stil sayfaları harici olarak saklanabilir ve bir ya da daha fazla belgeye bağlanabilir. Bir harici stil sayfası (external style sheet), sadece CSS spesifikasyonları içeren bir dosyadır. Harici stil sayfalarını birden fazla Web sayfasında kullanarak sayfaların tutarlı olmasını sağlayabilirsiniz. Dahili stiller içeren bir belgeniz varsa ve bu stilleri diğer sayfalarda da kullanmak istiyorsanız, bunları harici bir stil sayfasına kolayca aktarabilirsiniz. 1. index.html belgesinde File > Export > CSS Styles komutunu seçin. Export Styles As CSS File iletişim kutusu açılacaktır. 2. Save As metin alanına stil sayfanızın adı olarak sangha.css yazın. Dosyayı Lesson_04_CSS klasörüne kaydedin..css uzantısını eklemeniz gerekmez. Kaydetme işleminden sonra siz eklemezseniz bu uzantı belgeye otomatik olarak eklenir. index.html belgesinde mevcut olan dahili stilleri (sayfa özelliklerini tanımlayan stillerle birlikte dayname ve highlight stilleri) içeren bir harici stil sayfası oluşturulacaktır. Siz stilleri aktarırken yeni belgeye sadece dahili stiller eklenir. Dahili stillerini aktardığınız belgeye eklenmiş bir harici stil sayfası varsa, bu harici stil sayfasındaki stiller yeni stil sayfasına dahil edilmez. Dahili stillerini dönüştürdüğünüz belgedeki harici stil sayfasını kullanmak isterseniz, stil sayfasını bağlamadan önce dahili stil sayfasını silmeniz gerekir. Bunun nasıl yapıldığını bir sonraki uygulamada öğreneceksiniz. Dreamweaver, bir dahili stil sayfasındakilerle aynı isimleri kullanan stillerin bulunduğu bir harici stil sayfasını eklemenize izin verir. Ancak uyuşmazlık çıkmasını önlemek, HTML belgenizdeki kod miktarını azaltmak ve hata ya da karışıklık çıkma olasılığını azaltmak için dahili stilleri silmeniz gerekir. Dahili stil sayfasını silmek için CSS Styles panelindeki kurallar listesinin en üstüne gidin. <style> ile gösterilen dahili stil sayfasını seçin. Bu stil sayfası, bu derste kullandığınız bütün kuralları içermektedir. <style> seçili durumdayken CSS Styles panelinin alt kısmındaki çöp tenekesi simgesine (Delete Embedded Style Sheet düğmesi) tıklayın. Bu düğmenin bağlama duyarlı olduğunu muhtemelen fark etmişsinizdir. Düğme, seçilen öğeye (özellik, kural ya da bütün bir stil sayfası) bağlı olarak değişir. index.html belgesini kapatabilirsiniz. 130 DERS 4

25 Mevcut Bir Harici Stil Sayfasını Bağlamak Şu anda birden fazla stil tanımına sahip bir harici stil sayfanız var. Harici olduğu için, stil tanımlarının uygulanmasını ya da uygulanabilmesini istediğiniz Web sayfalarına bağlayarak bu dosyayı diğer belgelerle birlikte kullanabilirsiniz. Sınıfları ilgili paragraflara ya da seçili durumdaki metinlere elle uygulamanız gerekir. Bu derste daha ileride HTML etiketlerini yeniden tanımlayan ve bağlamsal seçicileri oluşturan stillerin nasıl geliştirildiğini öğreneceksiniz. Her iki stil tipi de, söz konusu stil sayfasının eklenmiş olduğu bütün belgelere otomatik olarak uygulanacaktır. CSS seçici stilleri kullanılarak oluşturulabilen ID ler, harici stil sayfaları eklendiğinde belgelere otomatik olarak uygulanmaz. 1. Lesson_04_CSS/about klasöründeki index.html dosyasını açın Kullanılacak metin içeriği bu sayfaya eklenmiş ve önceki derslerde öğrendiğiniz tekniklerle biçimlendirilmiştir. İlave uygulama yapmak isterseniz, Lesson_04_CSS/Text klasöründe yer alan about.txt belgesindeki metni aktarabilir ve bu uygulamada kullanacağınız belgeye benzeyecek şekilde biçimlendirebilirsiniz. Bu sayfanın herhangi bir dahili ya da harici stili bulunmamaktadır. Sıradaki adımlarda bu belgeyi önceki uygulamada index.html belgesindeki dahili stillerden oluşturduğunuz harici stil sayfasına bağlayacaksınız. Bu bağlama işlemi, metin biçimlendirmesinin iki sayfada da tutarlı olmasını sağlayacaktır. Stilleri geliştirmeye devam ederken biçimlendirmenin tutarlı kalmasını sağlamak için definitions.html belgesindeki dahili stili silmeniz ve harici stil sayfasını eklemek üzere bu uygulamadaki adımları uygulamanız gerekir. Harici stil sayfaları kullandığınızda, bu stil sayfalarına bağlı olan bütün belgeler söz konusu harici stil sayfalarındaki stillerde yapılan her değişikliği yansıtacaktır. Bu ders için definitions.html belgesini olduğu gibi bırakabilir ya da ekstradan pratik yapmak için burada anlatıldığı şekilde üzerinde çalışabilirsiniz. Stİl Sayfaları Gelİştİrmek 131

26 2. CSS Styles panelinin sağ alt kısmındaki Attach Style Sheet simgesine tıklayın. Attach Style Sheet düğmesi Attach External Style Sheet iletişim kutusu açılacaktır. 132 DERS 4

27 Dreamweaver, Web sitelerinizde kullanabileceğiniz bir dizi hazır CSS stil sayfası içerir. Bu stil sayfalarından birini kullanmak isterseniz, Attach External Style Sheet iletişim kutusunun alt tarafında yer alan sample style sheets bağlantısına tıklayın. Sample Style Sheets iletişim kutusundan istediğiniz stil sayfasını seçin ve OK düğmesine tıklayın. Bu stil sayfalarını oldukları gibi kullanabilir ya da bir başlangıç noktası olarak alarak kendi stil sayfalarınızı geliştirebilirsiniz. Sample Style Sheets iletişim kutusunda Cancel düğmesine tıkladığınızda Attach External Style Sheet iletişim kutusuna dönersiniz. HTML kodu yazma konusunda yeterli bilgiye sahipseniz ve CSS kodu yazmayı biliyorsanız, File > New komutunu seçtikten sonra General sekmesindeki Basic Page kategorisinden de CSS belge tipini seçerek sıfırdan bir CSS sayfası oluşturabilirsiniz. Bu işlemi yaptığınızda yeni bir belge açılacaktır. Bu belgede Code görünümünün tek görünüm modu olduğuna dikkat edin. CSS ve CSS elemanlarıyla ilgili ayrıntılı bilgi almak isterseniz, Code panel grubunda yer alan Reference panelindeki Book menüsünden O REILLY CSS Reference ı seçin. Style menüsünü kullanarak CSS terimlerini seçebilir ve bunlarla ilgili açıklamaları okuyabilirsiniz. Reference panelini Ders 15 te daha yoğun bir şekilde kullanacaksınız Stİl Sayfaları Gelİştİrmek 133

28 3. Browse düğmesine tıklayın ve bu dersin başında oluşturduğunuz sangha. css dosyasını bulun. Select Style Sheet File iletişim kutusundaki Choose (Macintosh ta) ya da OK (Windows ta) düğmesine tıklayarak stil sayfasını seçin. Attach External Style Sheet iletişim kutusunun Add As bölümünde Link seçeneğinin işaretli olduğundan emin olun ve OK düğmesine tıklayın. sangha.css adındaki harici stil sayfası index.html belgesine bağlanacaktır. Sayfa artık harici stil sayfasında tanımlanan biçimlendirme niteliklerini yansıtacaktır. Bunun sonuçlarını hemen göreceksiniz. Bağlantı renkleri, Ders 3 te ayarladıklarınızla aynı olacak, arka plan bu derste daha önce ayarladığınız soluk sarı rengini alacak ve varsayılan sayfa fontu, yine bu derste daha önce seçtiğiniz fonta dönüşecektir. Link seçeneği varsayılan olarak ayarlanmış durumdadır, index.html belgesine ilk defa bir stil sayfası ekliyorsunuz. Bir stil sayfası eklemek için kullanılan Import seçeneği Netscape Navigator 4.x te çalışmaz. Bu Web tarayıcısı Import seçeneğiyle eklenen bütün stil sayfalarını göz ardı eder. Stil sayfalarının basamaklı yapısından dolayı ikinci stil sayfası önceliğe sahiptir ve ilk sayfada uyumsuzluk yaratan bütün stilleri geçersiz kılar. Benzer şekilde, üçüncü stil sayfası da birinci ve ikinci sayfalardaki bütün uyumsuz stilleri geçersiz kılar. Birden fazla stil sayfası kullanma işlemi basamaklama (cascading) olarak bilinir. Netscape 4.x kullanıcıları göz önüne alınarak sıkça kullanılan bir teknik de, bu tarayıcıyla uyumlu olmayan bütün stilleri Import seçeneğinin kullanıldığı sonraki diğer stil sayfalarına yerleştirmektir. Böylece Netscape 4.x sadece ilk stil sayfasında yer alan stilleri kullanacak ve uyumsuzluk çıkarma ya da hata oluşturma ihtimali bulunan stillerden etkilenmez, çünkü Import seçeneğine bağlanan stil sayfalarını görmezden gelir. Sonraki stil sayfalarında aktarılan stilleri içerenler varsa, bunlar ilk sayfada yer alan eski Web tarayıcılarına yönelik stilleri geçersiz kılabilir. Harici Stiller Oluşturmak Font, font büyüklüğü, rengi gibi çeşitli biçimlendirme niteliklerini ayrı ayrı belgelerde kolayca değiştirebilirsiniz. Ancak harici stil sayfalarının seçeneklerinizi artırabileceğini ve bu stilleri sitenizdeki diğer belgelerde de kolayca uygulamanızı sağladığını unutmayın. Stillerinizi, onları kullanmak istediğiniz her sayfada yeniden yaratmak yerine, bütün stillerinizi saklamak üzere bir harici stil sayfası kullanabilir ve böylece bu stilleri söz konusu stil sayfasının bağlı olduğu her belge tarafından erişilebilir kılabilirsiniz. Bu da biçimlendirme işlemini önemli ölçüde hızlandırabilir. 134 DERS 4

29 Şimdiki uygulamada bir HTML etiketini yeniden tanımlayarak sangha.css harici stil sayfası içinde yeni bir stil oluşturacaksınız. Burada Heading 3 (<h3>) HTML imini yeniden tanımlayarak Web tarayıcısına <h3> etiketini kullanan her metnin sizin tanımladığınız biçimlendirme ayarlarıyla görüntülenmesi gerektiğini bildireceksiniz. Bu kullanışlı bir işlemdir, çünkü temel Heading 3 formatını değiştirerek bu formatı kullanan bütün metinlerin sizin tanımladığınız stil nitelikleriyle biçimlendirilmesini sağlar. 1. CSS Styles panelindeki New CSS Rule simgesine tıklayın. Selector Type alanında Tag i seçin. Tag menüsünü kullanarak h3 ü seçin. Bu uygulamada Heading 3 (Başlık 3) için bir stil oluşturuyorsunuz. HTML de buna karşılık gelen etiket <h3> ile gösterilir. Etiketler New CSS Rule iletişim kutusunda kodda etraflarını saran büyük-küçük işaretleri olmadan gösterilir. Belgenin üst tarafında yer alan başlık Heading 3 olarak biçimlendirilmiştir ve bir sonraki adımda tanımlayacağınız nitelikleri alacaktır. Mevcut bir HTML etiketini yeniden tanımlayan bir stil oluşturuyorsanız, ekleme noktasını sayfada bu etiketi kullanan bir metnin içine yerleştirmeniz ya da stili oluşturmadan önce Etiket Seçici de bu etiketi seçmeniz işinizi kolaylaştıracaktır. Selector Type alanında Tag varsayılan seçenek olduğu müddetçe, Dreamweaver HTML etiketini, oluşturulacak olan stille otomatik olarak ilişkilendirecektir (varsayılan seçici tipi en son kullanılan tiptir). Selector Type alanındaki varsayılan seçenek Tag değilse onu seçebilir, ardından New CSS Rule iletişim kutusundaki Cancel düğmesine tıklayabilir ve tekrar New CSS Rule a tıklayabilirsiniz. İletişim kutusu tekrar açıldığında etiket seçili hale gelecektir. HTML konusuna aşina değilseniz etiketi New CSS Rule iletişim kutusunu açmadan önce seçmek işinizi kolaylaştırabilir. Örneğin başlığa tıklayıp, ardından <h3> etiketini seçebilir ve sonra da CSS Styles panelindeki New CSS Rule simgesine tıklayabilirsiniz. Selector Type alanında Tag seçiliyse, <h3> etiketi Tag metin alanında h3 şeklinde gösterilir. Stİl Sayfaları Gelİştİrmek 135

30 2. Define In alanında menü seçeneğini işaretleyin ve menüden sangha.css i seçin. OK düğmesine tıklayın. Bu, geçerli belgeye bağlanmış tek stil sayfası olduğu için menüde sadece (New Style Sheet File) ve sangha.css seçenekleri bulunur. Herhangi bir harici stil sayfası eklenmemiş belgeler için bu menüdeki tek seçenek (New Style Sheet File) olacaktır. Yeni bir stil oluştururken New CSS Rule iletişim kutusunun Define In alanındaki menüde (New Style Sheet File) seçeneğini işaretleyerek yeni bir harici stil sayfası oluşturabilirsiniz. Bir kural için yeni bir harici stil sayfası oluşturduğunuzda stil sayfası kendisi için oluşturulduğu belgeye otomatik olarak bağlanır. Bu tür yeni harici stil sayfalarını.css uzantısıyla kaydetmeniz gerekir. Dosya yapısını temiz ve düzgün tutmak için bazı sitelerde bütün harici stil sayfaları merkezi bir konumda toplanır. CSS Rule Definition for h3 in sangha.css iletişim kutusu açılacaktır. Bu iletişim kutusunu Heading 3 biçimlendirme özelliklerini tanımlamak için kullanacaksınız. 136 DERS 4

31 CSS Rule Definition iletişim kutusu daima stilin seçicisini (üzerinde değişiklik yapılan eleman) ve bunun tanımlandığı stil sayfasının adını görüntüler. Buradaki uygulamada seçici h3 ve stil sayfası da sangha.css tir. 3. Type kategorisinde Size menüsünden 18 i seçin ve ölçü değerini points olarak değiştirin. Font menüsünden Courier New, Courier, monospace i seçin. Renk değerini # olarak değiştirin. Weight menüsünden bold u seçin ve OK düğmesine tıklayın. Doğrudan CSS kodunda değişiklik yapmak için sangha.css dosyasını da açabilirsiniz. CSS Rule Definition iletişim kutusunu kapatmak için OK düğmesine tıkladığınızda, belge penceresinde yeni bir sekmede sangha.css dosyası otomatik olarak açılacaktır. CSS dosyaları Code görünümünde ekrana gelir (bu görünümü Ders 16 da yoğun olarak kullanacaksınız) Stil sayfasında stil oluşturma, düzenleme ya da silme gibi değişiklikler yaparsanız, kapatmadan önce CSS belgesini kaydettiğinizden emin olun. Kaydetmeden kapatırsanız yapmış olduğunuz bütün değişiklikleri kaybedersiniz. Çalışmaya devam ederken CSS belgenizle HTML belgenizi düzenli olarak kaydetmeniz iyi olacaktır. Stİl Sayfaları Gelİştİrmek 137

ÇANKAYA ÜNİVERSİTESİ WEBMAIL KULLANIM KLAVUZU

ÇANKAYA ÜNİVERSİTESİ WEBMAIL KULLANIM KLAVUZU ÇANKAYA ÜNİVERSİTESİ WEBMAIL KULLANIM KLAVUZU Üniversitemiz Webmail servisi yenilenmiş olup Roundcube webmail üzerinden servis vermeye başlamıştır. Daha önce kullanılan SquirrelMail servisi https://oldwebmail.cankaya.edu.tr/

Detaylı

Açılan programın pencere görünümü aşağıdaki gibidir. 2. Araç Çubuğundan kaydet düğmesi ile

Açılan programın pencere görünümü aşağıdaki gibidir. 2. Araç Çubuğundan kaydet düğmesi ile POWERPOINT PROGRAMI Powerpoint bir sunu hazırlama programıdır. Belirli bir konu hakkında bilgi vermek için, derslerle ilgili bir etkinlik hazırlamak için, dinleyicilere görsel ortamda sunum yapmak için

Detaylı

Aşağıdaki örnekte, aynı düzen tablosu ve hücreleri içerikle birlikte gösterilmektedir.

Aşağıdaki örnekte, aynı düzen tablosu ve hücreleri içerikle birlikte gösterilmektedir. 12 DÜZEN TABLOLARI Microsoft Office FrontPage 2003 programında düzen tabloları ve hücrelerini kullanarak, profesyonel görünümlü Web sayfası düzenleri oluşturabilirsiniz. Düzen tablosu, sayfa düzeni için

Detaylı

MS POWERPOINT 2010. Şekil 111 Powerpoint 2010 Programını Başlatmak

MS POWERPOINT 2010. Şekil 111 Powerpoint 2010 Programını Başlatmak MS POWERPOINT 2010 1.Giriş: PowerPoint, Windows ortamında çalışan bir sunu paket programıdır. Metin, taslak, çizim ve grafikler kullanılarak sunular, slaytlar, broşürler, bildiriler, konuşmacı notları

Detaylı

1.1 Web Kavramlar. 1.1.1.3 URL terimini tanımlayınız ve anlayınız.

1.1 Web Kavramlar. 1.1.1.3 URL terimini tanımlayınız ve anlayınız. 1.1 Web Kavramlar 117 Anahtar 7erim/er 1.1.1.1 Web ve Internet terimlerini tanımlayınız. Her birinin anahtar özelliklerini tanımlayınız. Web bir Internet hizmetidir. Web Internet üzerinde bağlantılı html

Detaylı

TEMEL BİLGİSAYAR. Ders Notları. Yrd. Doç. Dr. Seyit Okan KARA

TEMEL BİLGİSAYAR. Ders Notları. Yrd. Doç. Dr. Seyit Okan KARA TEMEL BİLGİSAYAR Ders Notları Yrd. Doç. Dr. Seyit Okan KARA Pencerenin ortasında bulunan beyaz sayfa, slayt tasarımında kullanacağımız sayfamızdır. Sol panelde bu slayt sayfasının küçültülmüş halde bir

Detaylı

2. HTML Temel Etiketleri

2. HTML Temel Etiketleri 2. HTML Temel Etiketleri Bu bölümü bitirdiğinizde, HTML ve etiket kavramlarının ne olduğunu, HTML komut yapısını, Örnek bir HTML dosyasının nasıl oluşturulduğunu, Temel HTML etiketlerinin neler olduğunu,

Detaylı

MICROSOFT OFFICE WORD 2010 ÖRNEK TEST SORULARI

MICROSOFT OFFICE WORD 2010 ÖRNEK TEST SORULARI MICROSOFT OFFICE WORD 2010 ÖRNEK TEST SORULARI 1-) Word 2010 nedir? A-) Hesap Programıdır B-) Tablo - Grafik Programıdır C-) Kelime İşlem Programıdır D-) İşletim Sistemidir 2-) Microsoft Word 2007 programında

Detaylı

MS WORD 4.BÖLÜM. Bölüm Adı: NESNE EKLEME Bölümün Amacı: Belgeye nesne ekleme işlemlerini gerçekleştirmek.

MS WORD 4.BÖLÜM. Bölüm Adı: NESNE EKLEME Bölümün Amacı: Belgeye nesne ekleme işlemlerini gerçekleştirmek. MS WORD 4.BÖLÜM Bölüm Adı: NESNE EKLEME Bölümün Amacı: Belgeye nesne ekleme işlemlerini gerçekleştirmek. Neler Öğreneceksiniz? Bu bölümü bitiren kişi: 1. Ekle sekmesini tanır. 2. Kapak sayfası oluşturabilir.

Detaylı

Doç. Dr. İsmail Rakıp Karaş www.ismailkaras.com irkaras@gmail.com. Hazırlayan: İdris Kahraman

Doç. Dr. İsmail Rakıp Karaş www.ismailkaras.com irkaras@gmail.com. Hazırlayan: İdris Kahraman 7. Doç. Dr. İsmail Rakıp Karaş www.ismailkaras.com irkaras@gmail.com Hazırlayan: İdris Kahraman Dreamweaver Dreamweaver en iyi web editör yazılımlarından biridir. Biz tasarım modunda çalışırken,dreamweaver

Detaylı

2014-2015 EĞİTİM-ÖĞRETİM YILI BİLİŞİM TEKNOLOJİLERİ VE YAZILIM DERSİ 6. SINIF 2. DÖNEM 2. SINAV ÇALIŞMA NOTLARI

2014-2015 EĞİTİM-ÖĞRETİM YILI BİLİŞİM TEKNOLOJİLERİ VE YAZILIM DERSİ 6. SINIF 2. DÖNEM 2. SINAV ÇALIŞMA NOTLARI 2014-2015 EĞİTİM-ÖĞRETİM YILI BİLİŞİM TEKNOLOJİLERİ VE YAZILIM DERSİ 6. SINIF 2. DÖNEM 2. SINAV ÇALIŞMA NOTLARI İşletim Sisteminde Yapılan Uygulamalar Bir Bilgisayarda Hangi İşletim Sistemi Yüklü Olduğunu

Detaylı

BİLGİSAYARDA OFİS PROGRAMLARI BİÇİMLENDİRME

BİLGİSAYARDA OFİS PROGRAMLARI BİÇİMLENDİRME BİLGİSAYARDA OFİS PROGRAMLARI BİÇİMLENDİRME Büro Yönetimi Öğretmeni Fatma GEZ BİÇİMLENDİRME Yazmış olduğumuz metinleri farklı boyut, renk, yazı tipi vb. özelliklerde yazabilmek için biçimlendirme işlemi

Detaylı

EndNote Web Hızlı Başvuru kartı

EndNote Web Hızlı Başvuru kartı EndNote Web Hızlı Başvuru kartı THOMSON SCIENTIFIC Web öğrencilere ve araştırmacılara çalışmalarını yazarken yardımcı olacak şekilde tasarlanmış Web tabanlı bir servistir. ISI Web of Knowledge, EndNote,

Detaylı

08.11.2015 WORD KULLANIMI

08.11.2015 WORD KULLANIMI KELİME İŞLEMCİ-MİCROSOFT OFFİCE OFFICE DÜĞMESİ HIZLI ERİŞİM ARAÇ ÇUBUĞU MENÜLER ŞEKİL, RESİM EKLEME TABLO EKLEME ETKİNLİKLER 1 OFFICE DÜĞMESİ: Çalışmamız ile ilgili dosya işlemleri yapmamızı sağlar. Yeni

Detaylı

www.wikispaces.com Kullanım Kılavuzu

www.wikispaces.com Kullanım Kılavuzu www.wikispaces.com Kullanım Kılavuzu İnternet tarayıcınıza(internet Explorer vb.) www.wikispaces.com adresini yazıp enter tuşuna bastığınızda yukarıdaki ekranla karşılaşacaksınız. Önceden oluşturmuş olduğunuz

Detaylı

NECMETTİN ERBAKAN ÜNİVERSİTESİ E-POSTA YARDIM BELGESİ

NECMETTİN ERBAKAN ÜNİVERSİTESİ E-POSTA YARDIM BELGESİ Zimbra Webmail GENEL ÖZELLİKLER Zimbra yüksek performanslı bir e-posta programı olup, e-posta, adres defteri, takvim, görev listeleri ve web dokümanları gibi özelliklere sahip bir uygulamadır. e-posta

Detaylı

Metin Tabanlı İçerik Oluşturma Araçları

Metin Tabanlı İçerik Oluşturma Araçları Metin Tabanlı İçerik Oluşturma Araçları Microsoft Office Word Kelime işlemci, görsel nesnelerin veya çizimlerin resim ya da arka plan olarak kullanıldığı metinler oluşturabilen, harita ve tablo gibi şekiller

Detaylı

GOOGLE DRİVE KULLANARAK FORM OLUŞTURMA

GOOGLE DRİVE KULLANARAK FORM OLUŞTURMA GOOGLE DRİVE KULLANARAK FORM OLUŞTURMA Google Docs yani Google Dokümanlar hizmeti bir süre önce Google Drive adlı bulut depolama hizmetinin içerisine alındı ve çok daha gelişerek yoluna devam etti. Google

Detaylı

Flow Kullanım Klavuzu Mart 2014

Flow Kullanım Klavuzu Mart 2014 Flow Kullanım Klavuzu Mart 2014 İçindekiler Flow nedir? Bir Flow hesabı oluşturmak Oturum açmak Flow Hesabınız Genel Görünüm Flow Hesabınız Kullanım + Add (ekle butonu) Bibliography (Künye/Atıf butonu)

Detaylı

BİLGİSAYAR PROGRAMLAMA

BİLGİSAYAR PROGRAMLAMA BİLGİSAYAR PROGRAMLAMA Yrd. Doç. Dr. Beytullah EREN beren@sakarya.edu.tr 0264 295 5642 1 MİCROSOFT EXCEL Elektronik tablolama veya hesaplama programı olarak da adlandırılan Excel, girilen veriler üzerinde

Detaylı

4 Front Page Sayfası Özellikleri

4 Front Page Sayfası Özellikleri 4 Front Page Sayfası Özellikleri İsterseniz Frontpage penceresinin sağ tarafından, isterseniz araç çubuklarından faydalanarak yeni bir sayfa açın. Frontpage te çeşitli sayfa şablonları bulunmaktadır. Ancak

Detaylı

MS WORD 5. BÖLÜM. Şekil 3. 100. Sayfa Düzeni Sekmesi. Şekil 3. 101. Temalar Grubu

MS WORD 5. BÖLÜM. Şekil 3. 100. Sayfa Düzeni Sekmesi. Şekil 3. 101. Temalar Grubu MS WORD 5. BÖLÜM Bölüm Adı: SAYFA DÜZENİ Bölümün Amacı: Sayfa yapısı ve düzenini değiştirmek. Neler Öğreneceksiniz? Bu bölümü bitiren kişi: 1. Ofis temalarını bilir. 2. Kenar boşluklarını, sayfa yönlendirmesini,

Detaylı

İdari Birimler Yönetim Paneli Kullanma Kılavuzu Bilgi İşlem Daire Başkanlığı Web Tasarım Ve Yazılım Birimi

İdari Birimler Yönetim Paneli Kullanma Kılavuzu Bilgi İşlem Daire Başkanlığı Web Tasarım Ve Yazılım Birimi İdari Birimler Yönetim Paneli Kullanma Kılavuzu Bilgi İşlem Daire Başkanlığı Web Tasarım Ve Yazılım Birimi Duyurular Nasıl Girilir? Duyuru girmek için ilk olarak İKÇ yönetim panelinden; 1-Kullanıcı adınızı

Detaylı

İçindekiler. Akıllı Tahta Uygulaması (ATU) Kullanma Kılavuzu. İçindekiler. Bölüm 1: Uygulama Hakkında Genel bilgi 2

İçindekiler. Akıllı Tahta Uygulaması (ATU) Kullanma Kılavuzu. İçindekiler. Bölüm 1: Uygulama Hakkında Genel bilgi 2 İçindekiler 1 İçindekiler Bölüm 1: Uygulama Hakkında Genel bilgi 2 Bölüm 2: Akıllı Tahta Uygulamasının Yüklenmesi Akıllı Tahta Uygulaması nı yükleme 3 Akıllı Tahta Uygulaması nı kaldırma 3 Akıllı Tahta

Detaylı

MEB E-Posta Hizmetleri ve Outlook Programı

MEB E-Posta Hizmetleri ve Outlook Programı MEB E-Posta Hizmetleri ve Outlook Programı İçindekiler Bakanlık E-Posta Hizmetleri ve Sistem Ara yüzü E-posta Hizmetlerinin Outlook Programına Bağlanması Outlook 2010 Kullanımına ilişkin temel bilgiler

Detaylı

Cite While You Write özelliği

Cite While You Write özelliği ResearchSoftware.com 1 Cite While You Write özelliği Atıflar & Şekiller Ekleme EndNote, makalelerinizi yayımcılara elektronik olarak sunmanızı kolaylaştıran daha önceden tanımlanmış birçok Microsoft Word

Detaylı

2000 de Programlarla Çalışmalar

2000 de Programlarla Çalışmalar Windows 2000 de Programlarla Çalışmalar 24 3 Windows 2000 de Programlarla Çalışmalar Programları Başlatmak Programları başlat menüsünü kullanarak, başlatmak istediğiniz programın simgesini çift tıklayarak

Detaylı

Hızlı Başlangıç Kılavuzu

Hızlı Başlangıç Kılavuzu Hızlı Başlangıç Kılavuzu Microsoft Word 2013 önceki sürümlerden farklı görünüyor, bu nedenle öğrenmenizi kolaylaştırmak için bu kılavuzu oluşturduk. Hızlı Erişim Araç Çubuğu Buradaki komutlar her zaman

Detaylı

Bo lu m 7: Hesap Tabloları

Bo lu m 7: Hesap Tabloları Bo lu m 7: Hesap Tabloları Konu 1: Dosya, Tablo ve Grafik Oluşturma Hazırlayan: S.Engin Koç Bu konu bittiğinde; Dosya oluşturma ve tabloya şekil verme Tabloya sütun, satır ekleme ve hücreleri biçimlendirme

Detaylı

Temel Bilgi Teknolojileri - I Ayrıntılı Ders İçerikleri

Temel Bilgi Teknolojileri - I Ayrıntılı Ders İçerikleri Temel Bilgi Teknolojileri - I Ayrıntılı Ders İçerikleri Bilgi Teknolojileri (IT) Kavramları, Bilgisayar Kullanımı ve Dosyaların Yönetimi, Bilgi ve İletişim HAFTA 1 1. Genel Kavramlar(Bilgisayarın tanımı,bilgi

Detaylı

A-PDF Split DEMO : Purchase from www.a-pdf.com to remove the watermark

A-PDF Split DEMO : Purchase from www.a-pdf.com to remove the watermark A-PDF Split DEMO : Purchase from www.a-pdf.com to remove the watermark Giriş Dreamweaver 8, Web sitelerinin oluşturulmasını, yönetilmesini, bakımının ve devamlılığını sağlanmasını mümkün kılmak için güçlü

Detaylı

INTERNET KAYNAKLARI. Wik.is Kılavuzu GRUP OTANTİK GRURLA SUNAR

INTERNET KAYNAKLARI. Wik.is Kılavuzu GRUP OTANTİK GRURLA SUNAR INTERNET KAYNAKLARI Wik.is Kılavuzu GRUP OTANTİK GRURLA SUNAR Bir Wiki ye Kayıt Olma 1. Öğrencileriniz ya da kurs katılımcılarınız için e- posta adresleri alın. 2. www.wik.is* adresine gidin. 3. Wik.is

Detaylı

İmleci yazıya getirip tıklayınca aşağıda hangi tag ler içinde olduğunu gösterir.

İmleci yazıya getirip tıklayınca aşağıda hangi tag ler içinde olduğunu gösterir. 21 Aralık 2011 / Çarşamba Önce bir site tanımlayacağız, yani önce çalışacağımız klasörü oluşturacağız. Bunun içinde, bir de resim klasörünü oluşturacağız. Görünüm : Classic Site Manage Site sitede düzenleme

Detaylı

www.elektrikogretmenleri.com

www.elektrikogretmenleri.com DREAMWEAVERDA NESNELERE DAVRANIŞ EKLEME Dreamweaver da fare hareket olaylı, animasyonlu görüntüler oluşturmak istenildiğinde hazır scriptler anlamına gelen Davranışlar(behaviors) kullanılmaktadır. Yukarıdaki

Detaylı

Kelime işlemcilerin işlevlerini öğrenmek. Başlıca kelime işlemcileri tanımak. Microsoft Word 2010 programı hakkında temel bilgileri öğrenmek.

Kelime işlemcilerin işlevlerini öğrenmek. Başlıca kelime işlemcileri tanımak. Microsoft Word 2010 programı hakkında temel bilgileri öğrenmek. Amaçlarımız 2 Kelime işlemcilerin işlevlerini öğrenmek. Başlıca kelime işlemcileri tanımak. programı hakkında temel bilgileri öğrenmek. da metin biçimlendirmek. 1 Kelime İşlemcilerin İşlevleri 3 Kelime

Detaylı

MICROSOFT WORD 2002. Şekil 1

MICROSOFT WORD 2002. Şekil 1 MICROSOFT WORD 2002 Microsoft Word 2002, bir kelime işlem programı olup, Microsoft Office XP bileşenidir. Word 2002 programı kullanılarak, mektup, rapor, kitap gibi belgeler hazırlanabilir. Bu belgelere

Detaylı

Resim 1. Access açılış sayfası. Resim 2. Access veri tabanı düzenleme sayfası

Resim 1. Access açılış sayfası. Resim 2. Access veri tabanı düzenleme sayfası ACCESS DERS 1 1. Access Programına Giriş Derslere uygulama üzerinde devam edeceğiz. Uygulama ismimiz İş Takip Sistemi dir. Uygulamada ilerledikçe işleyeceğimiz bölümlerin nasıl kullanıldığını ve ne işe

Detaylı

1 MİCROSOFT FRONTPAGE 2003 E GİRİŞ

1 MİCROSOFT FRONTPAGE 2003 E GİRİŞ 1 MİCROSOFT FRONTPAGE 2003 E GİRİŞ 6 1.1 Frontpage 2003 ün açılması Frontpage 2003 ü çalıştırabilmek için Başlat/Programlar/ Microsoft Office Microsoft Office Frontpage 2003 yolu izlenir. FrontPage 2003,

Detaylı

MODÜL 3 HTML İLE STİL ŞABLONLARI

MODÜL 3 HTML İLE STİL ŞABLONLARI MODÜL 3 HTML İLE STİL ŞABLONLARI Bu modülü bitirdiğinizde; CSS kodlama standartlarına uyarak işlevselliği ve verimliliği artırmak için HTML kodları ile Stil şablonu (CSS) yapılandırmasını gerçekleştireceksiniz.

Detaylı

1 MİCROSOFT FRONTPAGE 2003 E GİRİŞ

1 MİCROSOFT FRONTPAGE 2003 E GİRİŞ 1 MİCROSOFT FRONTPAGE 2003 E GİRİŞ 6 1.1 Frontpage 2003 ün açılması Frontpage 2003 ü çalıştırabilmek için Başlat/Programlar/ Microsoft Office Microsoft Office Frontpage 2003 yolu izlenir. FrontPage 2003,

Detaylı

A-PDF Split DEMO : Purchase from www.a-pdf.com to remove the watermark. Yüklemek

A-PDF Split DEMO : Purchase from www.a-pdf.com to remove the watermark. Yüklemek A-PDF Split DEMO : Purchase from www.a-pdf.com to remove the watermark A Eklentileri Yüklemek Flash programına bileşenler, efektler, araçlar, ekran tipleri, davranışlar ve komutlar içeren çeşitli eklentiler

Detaylı

Avrasya Üniversitesi. Tuncay AYDEMİR

Avrasya Üniversitesi. Tuncay AYDEMİR Avrasya Üniversitesi Moodle Sistemi Kullanım Klavuzu Hazırlayan Tuncay AYDEMİR Moodle Nedir? Moodle; Öğrenci eğitimci arasında internet ortamında paylaşımların yapılabilmesini sağlayan bir sistemdir. Eğitimci

Detaylı

2-Hafta Temel İşlemler

2-Hafta Temel İşlemler 2-Hafta Temel İşlemler * Html Komutlarının Yapısı * Açıklamalar * Htm Sayfasının Oluşturulması * Temel Html Komutları * Html Sayfalarının Düzenlenmesi * Html Sayfalarının İncelenmesi Html Komutlarının

Detaylı

2- Kontrol Sil... 17. 3-En Öne Getir... 13 4-En Arkaya Gönder... 13 4.5.8.2 Resim... 14. 1-Özellikler:... 18 Genel Özellikler...

2- Kontrol Sil... 17. 3-En Öne Getir... 13 4-En Arkaya Gönder... 13 4.5.8.2 Resim... 14. 1-Özellikler:... 18 Genel Özellikler... i İçindekiler Kullanıcı Giriş Ekranı... 1 Ana Sayfa... 2 1-Projeler... 3 1.1 Yeni Proje... 3 1.2 Proje Düzenle... 3 1.3 Proje Sil... 3 1.4 Listeyi Güncelle.... 3 2-Gruplar... 4 2.1.1 Grup Adı.... 5 2.1.2

Detaylı

1. BELGE İŞLEMLERİ. Şekil 1.2: Open Office ilk açıldığında gelen ekran

1. BELGE İŞLEMLERİ. Şekil 1.2: Open Office ilk açıldığında gelen ekran 1.1. Arayüz 1. BELGE İŞLEMLERİ Open Office içerisinde hesap tablosu programının arayüzünü inceleyelim. Şekil 1.1:Sunum programını çalıştırma Sunum programını çalıştırmak için aşağıdaki yöntemleri deneyebiliriz.windows

Detaylı

ÜNİTE 1: KELİME İŞLEMCİ PROGRAMI

ÜNİTE 1: KELİME İŞLEMCİ PROGRAMI ÜNİTE 1: KELİME İŞLEMCİ PROGRAMI Kelime İşlemci Nedir? Bilgisayarda yazıların(metinlerin) yazılmasını ve düzenlenebildiği, resimlerin ve tabloların eklenebildiği yazılımların(programların) genel adıdır.

Detaylı

Web Hizmeti Bağlantıları

Web Hizmeti Bağlantıları Web Hizmeti Bağlantıları Web hizmeti için bağlantılar, Sistem Yönetmeni program bölümünde Yönetim menüsü altında yer alan Web Hizmeti Bağlantıları seçeneği ile kaydedilir. WEB Sayfası Tasarımları WEB sayfasında

Detaylı

Amway Türkiye Grup Haritası Aracı. Grup Haritası Aracı. www.amway.com.tr, infotr@amway.com. Her hakkı saklıdır.

Amway Türkiye Grup Haritası Aracı. Grup Haritası Aracı. www.amway.com.tr, infotr@amway.com. Her hakkı saklıdır. Grup Haritası Aracı www.amway.com.tr, infotr@amway.com. Her hakkı saklıdır. İçindekiler: Giriş sayfa 1 Grup Haritası Erişim sayfa 2 Grup Haritasını Görüntüleme sayfa 3 Araç Çubuğu Simgeleri sayfa 5 Sütunlar

Detaylı

MICROSOFT OFFİCE WORD PROGRAMI DOSYA İŞLEMLERİ

MICROSOFT OFFİCE WORD PROGRAMI DOSYA İŞLEMLERİ MICROSOFT OFFİCE WORD PROGRAMI Ms Word bir kelime işlemci programıdır. İçinde bulunan detaylı metin biçimlendirme seçenekleri, ayrıntılı tablo, şekil ve grafik oluşturma başarıları nedeniyle, kendi türünde

Detaylı

AEGEE-Eskişehir Online Web Yönetim Paneli ( WEBBY ) Yardım Dökümanı

AEGEE-Eskişehir Online Web Yönetim Paneli ( WEBBY ) Yardım Dökümanı AEGEE-Eskişehir Online Web Yönetim Paneli ( WEBBY ) Yardım Dökümanı Emre GÜLCAN IT Responsible & Web Admin AEGEE-Eskişehir emregulcan@gmail.com e_gulcan@hotmail.com 0535 729 55 20 1 1. YÖNETİM PANELİNE

Detaylı

Powerpoint; Microsoft ofis programları içinde bulunan bir sunum hazırlama programıdır.

Powerpoint; Microsoft ofis programları içinde bulunan bir sunum hazırlama programıdır. Powerpoint; Microsoft ofis programları içinde bulunan bir sunum hazırlama programıdır. Powerpoint ile toplantılar da veya herhangi bir konu üzerinde açıklama getirmek için sunu hazırlarız. Powerpoint2003

Detaylı

Yine benzer şekilde hücreler içine yazılan yazıların renklerini değiştirebiliriz. Bunun için tüm satırı veya sütunu yine fareyle seçmek durumundayız.

Yine benzer şekilde hücreler içine yazılan yazıların renklerini değiştirebiliriz. Bunun için tüm satırı veya sütunu yine fareyle seçmek durumundayız. 2. EKLE SEKMESĐ TABLO EKLEMEK: Sayfamıza tablo eklemek için, TABLO butonuna bastıktan sonra açılan pencereden kaç sütün ve kaç satırlık bir tablo oluşturacağımızı belirliyoruz. Fareyi sürüklemek, tablonun

Detaylı

E-Posta Hesabı Oluşturma

E-Posta Hesabı Oluşturma E-Posta Hesabı Oluşturma Elektronik Posta (E-posta) Nedir? Elektronik posta (e-posta) internet ortamından gönderilen dijital (elektronik) mektuptur. Bir başkasına e-posta gönderebilmemiz için öncelikle

Detaylı

Conficy 2014. Efficy 2014 Kullanıcı Kılavuzu. Oturum Açma. Ana Ekran. Alan Ekleme. Formlar

Conficy 2014. Efficy 2014 Kullanıcı Kılavuzu. Oturum Açma. Ana Ekran. Alan Ekleme. Formlar Conficy 04 Efficy 04 Kullanıcı Kılavuzu Oturum Açma Ana Ekran Alan Ekleme 4 Formlar Oturum açma İnternet tarayıcınızı açınız ve Conficy e ait web adresini tuşlayınız. Bu adresi bilmiyorsanız, Favoriler

Detaylı

www.elektrikogretmenleri.com

www.elektrikogretmenleri.com FIREWORKS (MENU OLUŞ TURMA) 1 Önce Başlat menüsü Programlar Adobe Web Premium CS3 Adobe Fireworks CS3 kısayol simgesi ile Fireworks programı açılır. 2 Fireworks programı açıldığında Karşımıza gelen Yeni

Detaylı

BİLGİ TEKNOLOJİLERİ SMO103 5. 6. HAFTA KELİME İŞLEMCİ PROGRAMI (MİCROSOFT WORD)

BİLGİ TEKNOLOJİLERİ SMO103 5. 6. HAFTA KELİME İŞLEMCİ PROGRAMI (MİCROSOFT WORD) BİLGİ TEKNOLOJİLERİ SMO103 5. 6. HAFTA KELİME İŞLEMCİ PROGRAMI (MİCROSOFT WORD) Kelime İşlemi Programı Nedir? Kelime işlemci terimi, 1970 ve 1980'li yıllarda popüler olan elektronik yazı makinelerine denilmektedir.

Detaylı

Quick Installation Guide. Central Management Software

Quick Installation Guide. Central Management Software Quick Installation Guide English 繁 中 簡 中 日 本 語 Français Español Deutsch Português Italiano Türkçe Polski Русский Česky Svenska Central Management Software Ambalajın İçindekileri Kontrol Edin Yazılım CD

Detaylı

KOCAELİ TEKNİK LİSESİ ELEKTRİK ELEKTRONİK BÖLÜMÜ OTOMASYON ATÖLYESİ EKTS (Elektrik Kumanda Teknikleri Simülatörü ) DERS NOTU. Kaynak : www.veppa.

KOCAELİ TEKNİK LİSESİ ELEKTRİK ELEKTRONİK BÖLÜMÜ OTOMASYON ATÖLYESİ EKTS (Elektrik Kumanda Teknikleri Simülatörü ) DERS NOTU. Kaynak : www.veppa. KOCAELİ TEKNİK LİSESİ ELEKTRİK ELEKTRONİK BÖLÜMÜ OTOMASYON ATÖLYESİ EKTS (Elektrik Kumanda Teknikleri Simülatörü ) DERS NOTU Kaynak : www.veppa.com Hakkında EKTS (Elektrik Kumanda Teknikleri Simülatörü

Detaylı

"Her zaman düzeltme öner" seçeneği işaretliyse solda bulunan pencerenin "Öneriler" bölümünde düzeltme önerir.

Her zaman düzeltme öner seçeneği işaretliyse solda bulunan pencerenin Öneriler bölümünde düzeltme önerir. ARAÇLAR: Yazım ve Dilbilgisi (F7): Yazılan belgede bulunan yazım hatalarını bulmak için kullanılır. Microsoft'un hazırladığı Office programı ile birlikte bilgisayara yüklenen sözlük (custom.dic) kullanılanarak

Detaylı

T.C. istanbul ÜNiVERSiTESi ÖĞRENCi BiLGi SiSTEMi. ÖĞRETiM ELEMANI KULLANIM KILAVUZU

T.C. istanbul ÜNiVERSiTESi ÖĞRENCi BiLGi SiSTEMi. ÖĞRETiM ELEMANI KULLANIM KILAVUZU T.C. istanbul ÜNiVERSiTESi ÖĞRENCi BiLGi SiSTEMi ÖĞRETiM ELEMANI KULLANIM KILAVUZU 1 1. Sisteme Giriş Nokta Üniversite Otomasyonu sistemini kullanabilmek için öncelikle Windows işletim sisteminde bulunan

Detaylı

EYLÜL 2012 WORD 2010. Enformatik Bölümü

EYLÜL 2012 WORD 2010. Enformatik Bölümü EYLÜL 2012 WORD 2010 İÇERİK 1. 2. 3. 4. 5. Genel bilgiler Wrd ile neler yapabilirsiniz? Wrd penceresinin tanıtımı Sekmelerin tanıtımı Belgeler ile ilgili işlemler 6. Yeni bir belge luşturmak Varlan bir

Detaylı

ÜNİTE ÜNİTE MICROSOFT POWER POINT - I TEMEL BİLGİ TEKNOLOJİLERİ İÇİNDEKİLER HEDEFLER

ÜNİTE ÜNİTE MICROSOFT POWER POINT - I TEMEL BİLGİ TEKNOLOJİLERİ İÇİNDEKİLER HEDEFLER ÜNİTE 11 MICROSOFT POWER POINT - I İÇİNDEKİLER BAYBURT ÜNİVERSİTESİ UZAKTAN EĞİTİM MERKEZİ Genel bilgiler PowerPoint penceresinin tanıtımı Sekmelerin genel tanıtımı Sunular ile ilgili işlemler Boş sunu

Detaylı

OYAK YATIRIM FX Meta İşlem Platformu Kullanma Kılavuzu

OYAK YATIRIM FX Meta İşlem Platformu Kullanma Kılavuzu İçindekiler: FX Meta İşlem Platformu Kullanma Kılavuzu 1- Demo Hesap Açılışı 2- Genel Görünüm 3- Alım-Satım İşlemleri 4- Stop-Limit İşlemleri 5- Pozisyon Kapatma 6- Grafiklerin Kullanımı 7- Göstergeler

Detaylı

Microsoft PowerPoint

Microsoft PowerPoint Microsoft PowerPoint GİRİŞ Microsoft Powerpoint bir sunum hazırlama programıdır. Microsoft Powerpoint sayesinde sunumlarınıza içerisinde ses,video,animasyon,grafik,resim,köprüler,web içerikleri ve çeşitli

Detaylı

VERİ TABANI UYGULAMALARI

VERİ TABANI UYGULAMALARI V. Ünite VERİ TABANI UYGULAMALARI A. BAŞLANGIÇ B. BİR VERİ TABANI YARATMA C. FORMLARIN KULLANIMI D. BİLGİYE ERİŞİM E. RAPORLAMA 127 A BAŞLANGIÇ Konuya Hazırlık 1. Veri tabanı programları hangi amaç için

Detaylı

ÖĞRENME FAALİYETİ 3 ÖĞRENME FAALİYETİ 3

ÖĞRENME FAALİYETİ 3 ÖĞRENME FAALİYETİ 3 ÖĞRENME FAALİYETİ 3 ÖĞRENME FAALİYETİ 3 AMAÇ Bu öğrenme faaliyeti ile tasarım düzenlemelerini yapabileceksiniz. ARAŞTIRMA Tema ne demektir? Temayı oluşturan ögeler nelerdir? Araştırınız. Arka plan ne demektir?

Detaylı

Denetim Masası/Programlar/Windows özelliklerini Aç/Kapat

Denetim Masası/Programlar/Windows özelliklerini Aç/Kapat Merhaba arkadaşlar, Bu yazımızda yerel ağda veya Ip adresimizle bir web sitesinin paylaşıma açılması, aynı ağdan veya uzaktan bir bilgisayarın web sitemize nasıl erişebileceği konuları üzerinde duracağız.

Detaylı

Hızlı Başlangıç Kılavuzu

Hızlı Başlangıç Kılavuzu Hızlı Başlangıç Kılavuzu Microsoft Access 2013 önceki sürümlerden farklı görünmektedir, dolayısıyla öğrenme eğrisini en aza indirmenize yardımcı olmak üzere bu kılavuzu hazırladık. Ekran boyutunu değiştirme

Detaylı

Ecza Depolarına Ait E-Fatura Aktarım Modülü

Ecza Depolarına Ait E-Fatura Aktarım Modülü Bilge Elektronik Ltd. Şti. Eczanem Otomasyon Sistemi Ecza Depolarına Ait E-Fatura Aktarım Modülü 1 1. SELÇUK/AS/NEVZAT/DİLEK Ecza Depoları E-Fatura Aktarımı.. 3 2. HEDEF Ecza Deposu E-Fatura Aktarımı..

Detaylı

MEBİS Kullanım Kılavuzu. Öğretim Elemanı Yeni. 2013-2015 - İstanbul Medipol Üniversitesi

MEBİS Kullanım Kılavuzu. Öğretim Elemanı Yeni. 2013-2015 - İstanbul Medipol Üniversitesi MEBİS Kullanım Kılavuzu Öğretim Elemanı Yeni 2013-2015 - İstanbul Medipol Üniversitesi İçindekiler 1. Uzem 1. Uzem mebis.medipol.edu.tr adresine girdiğinizde sol alt tarafta bulunan seçeneklerden "Muzem

Detaylı

NAVİGASYON KULLANIM KILAVUZU.

NAVİGASYON KULLANIM KILAVUZU. NAVİGASYON KULLANIM KILAVUZU www.fiatnavigation.com www.daiichi.com.tr Başlarken Araç navigasyon yazılımını ilk kez kullanırken, bir başlangıç ayarı süreci otomatik olarak başlar. Aşağıdaki adımları takip

Detaylı

MEB (K12) e-posta Sistemi Kullanımı

MEB (K12) e-posta Sistemi Kullanımı 1. Giriş Bilindiği üzere Bakanlığımız tarafından tüm kurumlarımıza POP3 destekli e-posta hesabı tahsis edilmiştir. Bu hesabı web tabanlı olarak kullanabileceğiniz gibi Outlook vb. gibi e-posta istemci

Detaylı

Photoshop ta Web Sayfaları Oluşturma

Photoshop ta Web Sayfaları Oluşturma Photoshop ta Web Sayfaları Oluşturma Dilimleme Photoshop ta üzerinde çalışılan resim dosyaları, düzenlenen fotoğraflar veya tasarlanan sayfalar web ortamında kullanılmak üzere hazırlanabilir. Bir web sayfasını

Detaylı

GPS NAVIGATION SYSTEM QUICK START USER MANUAL

GPS NAVIGATION SYSTEM QUICK START USER MANUAL GPS NAVIGATION SYSTEM QUICK START USER MANUAL TURKISH Başlarken Araç navigasyon yazılımını ilk kez kullanırken, bir başlangıç ayarı süreci otomatik olarak başlar. Aşağıdaki adımları takip edin: Program

Detaylı

AirTies Kablosuz Erişim Noktası (Access Point) olarak kullanacağınız cihazı bilgisayarınıza bağlayarak ayarlarını yapabilirsiniz.

AirTies Kablosuz Erişim Noktası (Access Point) olarak kullanacağınız cihazı bilgisayarınıza bağlayarak ayarlarını yapabilirsiniz. USB Disk Paylaşımı Değerli Müşterimiz, AirTies desteklediği USB Tak&Paylaş özelliği ile hiçbir ekstra donanıma ihtiyaç duymadan yaygın olarak kullanılan standart USB disk sürücülerinizi tüm ağınıza paylaştırmanıza

Detaylı

BİLGİSAYAR PROGRAMLAMA. Yrd. Doç. Dr. Beytullah EREN beren@sakarya.edu.tr 0264 295 5642

BİLGİSAYAR PROGRAMLAMA. Yrd. Doç. Dr. Beytullah EREN beren@sakarya.edu.tr 0264 295 5642 BİLGİSAYAR PROGRAMLAMA Yrd. Doç. Dr. Beytullah EREN beren@sakarya.edu.tr 0264 295 5642 EXCEL DE GRAFİK UYGULAMA GRAFİKLER Grafikler, çok sayıda verinin ve farklı veri serileri arasındaki ilişkinin anlaşılmasını

Detaylı

T.C. MĠLLÎ EĞĠTĠM BAKANLIĞI EĞĠTĠM TEKNOLOJĠLERĠ GENEL MÜDÜRLÜĞÜ BĠLĠġĠM HĠZMETLERĠ DAĠRESĠ MEZUN ÖĞRENCĠ SORGULAMA MODÜLÜ KULLANIM KILAVUZU

T.C. MĠLLÎ EĞĠTĠM BAKANLIĞI EĞĠTĠM TEKNOLOJĠLERĠ GENEL MÜDÜRLÜĞÜ BĠLĠġĠM HĠZMETLERĠ DAĠRESĠ MEZUN ÖĞRENCĠ SORGULAMA MODÜLÜ KULLANIM KILAVUZU T.C. MĠLLÎ EĞĠTĠM BAKANLIĞI EĞĠTĠM TEKNOLOJĠLERĠ GENEL MÜDÜRLÜĞÜ BĠLĠġĠM HĠZMETLERĠ DAĠRESĠ MEZUN ÖĞRENCĠ SORGULAMA MODÜLÜ KULLANIM KILAVUZU TERME-2015 1. GĠRĠġ MOS modülü 6111 Sayılı Kanun Teşviki kanunu

Detaylı

Kopya Hakkı 2005 The European Computer Driving Licence Foundation Ltd

Kopya Hakkı 2005 The European Computer Driving Licence Foundation Ltd Tüm haklar mahfuzdur. Bu yayının hiçbir kısmı ECDL Kuruluşundan izin almadan hiçbir şekilde çoğaltılamaz. Çoğaltım talepleri yayıncıya yapılmalıdır. The European Computer Driving Licence Foundation Ltd

Detaylı

Açılan penceren gerekli ayarlamalar yapılarak sayfa numaraları görüntülenir.

Açılan penceren gerekli ayarlamalar yapılarak sayfa numaraları görüntülenir. Sayfa numarası ekleme: Ekle menüsünden sayfa numaraları seçeneğine tıklandığında Açılan penceren gerekli ayarlamalar yapılarak sayfa numaraları görüntülenir. Tarih ve saat ekleme: Ekle menüsünden Tarih

Detaylı

İnternet,artık hayatımızın önemli bir parçası. Her gün interneti programlar aracılığı ile ya da internet siteleri aracılığı ile kullanıyoruz.

İnternet,artık hayatımızın önemli bir parçası. Her gün interneti programlar aracılığı ile ya da internet siteleri aracılığı ile kullanıyoruz. Mahmut BORA KARAKUŞ İnternet,artık hayatımızın önemli bir parçası. Her gün interneti programlar aracılığı ile ya da internet siteleri aracılığı ile kullanıyoruz. Peki internet nasıl çalışıyor ve internet

Detaylı

Kurulum ve Başlangıç Kılavuzu. DataPage+ 2013 için

Kurulum ve Başlangıç Kılavuzu. DataPage+ 2013 için DataPage+ 2013 için En Son Güncellenme Tarihi: 25 Temmuz 2013 İçindekiler Tablosu Önkoşul Olan Bileşenleri Yükleme... 1 Genel Bakış... 1 Adım 1: Setup.exe'yi Çalıştırın ve Sihirbazı Başlatın... 1 Adım

Detaylı

DENEME SINAVI CEVAP ANAHTARI

DENEME SINAVI CEVAP ANAHTARI DENEME SINAVI CEVAP ANAHTARI ECDL BAŞLANGIÇ Bilgisayarı Kullanmak ve Dosyaları Yönetmek 1) Bilgisayar ı doğru şekilde kapatıp, açmak için uygun metodu uygulayınız.(bilgisayarı kapatın ve tekrar açın.)

Detaylı

1. Kurulum. Tam ekranda iken MENU tuşuna. Başlat sekmesine gelin ve sonra [ / ] basın ve menüye girin. [ / ]

1. Kurulum. Tam ekranda iken MENU tuşuna. Başlat sekmesine gelin ve sonra [ / ] basın ve menüye girin. [ / ] 1. Kurulum Tam ekranda iken MENU tuşuna basın ve menüye girin. [ / ] tuşlarına basarak Kurulum, Kanal Düzenleme, Sistem Ayarları ve Medya Merkezi menülerine geçiş yapabilirsiniz. Kurulum menüsü altından

Detaylı

Google Dokümanları Kullanmak

Google Dokümanları Kullanmak Google Dokümanları Kullanmak 1. Kullanıcı Girişi ve Genel Ayarlar Google ana sayfasındaki Dokümanlar bağlantısından veya docs.google.com web bağlantı adresinden kullanıcı girişi yapabilir ve Dokümanlar

Detaylı

MEBWEB OKUL/KURUM WEB SİTELERİ KULLANIM KLAVUZU TEMEL İŞLEMLER

MEBWEB OKUL/KURUM WEB SİTELERİ KULLANIM KLAVUZU TEMEL İŞLEMLER MEBWEB OKUL/KURUM WEB SİTELERİ KULLANIM KLAVUZU TEMEL İŞLEMLER 1.WEB PANELE GİRİŞ www.okuladı.meb.k12.tr/mebpanel Resim1: Okul Web Siteleri Yönetim Paneli [MebWeb] Giriş Ekranı AÇIKLAMA: Okulunuzun web

Detaylı

Teknik Resim Çıkartılması

Teknik Resim Çıkartılması Teknik Resim Çıkartılması Open komutuna tıklayarak daha önce çizmiş olduğumuz D2-Revolved Feature isimli part dosyamızı açalım. New komutuna tıklayarak yeni bir Drawing dokümanı oluşturalım. Karşımıza

Detaylı

Hızlı Başlangıç Kılavuzu

Hızlı Başlangıç Kılavuzu Hızlı Başlangıç Kılavuzu Microsoft Publisher 2013 önceki sürümlerden farklı görünüyor, bu nedenle öğrenmenizi kolaylaştırmak için bu kılavuzu oluşturduk. Hızlı Erişim Araç Çubuğu En sevdiğiniz komutları

Detaylı

ProQuest DISSERTATIONS AND THESIS FULL TEXT

ProQuest DISSERTATIONS AND THESIS FULL TEXT ProQuest DISSERTTIONS ND THESIS FULL TEXT Kullanım Kılavuzu Kapsam Kendi alanındaki tek veritabanı olan bu veritabanı Mühendislik, Tıp Bilimleri, Fizik, Psikoloji, Eğitim, Edebiyat, Felsefe, Sosyal Bilimler,

Detaylı

BİLİŞİM TEKNOLOJİLERİ DERSİ WORD 2007 SORULARI

BİLİŞİM TEKNOLOJİLERİ DERSİ WORD 2007 SORULARI 1-) Word nedir? Hesap Programıdır Tablo - Grafik Programıdır Kelime İşlem Programıdır İşletim Sistemidir BİLİŞİM TEKNOLOJİLERİ DERSİ WORD 2007 SORULARI 9-) Yandaki butonun görevi nedir? Kes Kopyala Yapıştır

Detaylı

AKINSOFT OtoPark. Yardım Dosyası

AKINSOFT OtoPark. Yardım Dosyası Yardım Dosyası Doküman Versiyon : 1.01.02 Tarih : 23.07.2012 1 1. ÇALIŞMA ŞEKLİ HAKKINDA KISA BİLGİ programı bütün kapalı ve açık otoparklar için geliştirdiği, araçların giriş-çıkış işlemleri, plaka tanıma

Detaylı

İÇERİK YÖNETİM SİSTEMİ KULLANMA KILAVUZU

İÇERİK YÖNETİM SİSTEMİ KULLANMA KILAVUZU T.C. SÜLEYMAN DEMİREL ÜNİVERSİTESİ BİLGİ İŞLEM DAİRE BAŞKANLIĞI İÇERİK YÖNETİM SİSTEMİ KULLANMA KILAVUZU Hazırlayanlar Mahmut ÖZDEMİR Sezgin SERPEN Büşra TUNCER Yönetim Paneli Kullanımı Sistemin yönetim

Detaylı

KELİME İŞLEMCİLERE GİRİŞ 5.SINIF BİLİŞİM TEKNOLOJİLERİ VE YAZILIM DERSİ ÇALIŞMA KÂĞIDI

KELİME İŞLEMCİLERE GİRİŞ 5.SINIF BİLİŞİM TEKNOLOJİLERİ VE YAZILIM DERSİ ÇALIŞMA KÂĞIDI KELİME İŞLEMCİLERE GİRİŞ 5.SINIF BİLİŞİM TEKNOLOJİLERİ VE YAZILIM DERSİ ÇALIŞMA KÂĞIDI Microsoft Office Word programı, Amerika da bulunan ve Bill Gates in sahibi olduğu yazılım firması Microsoft tarafından

Detaylı

WEB TASARIM. CSS, IFRAME, TEMPLATE, SLICE, INCLUDE(php komutu) Tarık ÖZEL

WEB TASARIM. CSS, IFRAME, TEMPLATE, SLICE, INCLUDE(php komutu) Tarık ÖZEL WEB TASARIM CSS, IFRAME, TEMPLATE, SLICE, INCLUDE(php komutu) Tarık ÖZEL İçindekiler Konular Sayfa Slice 2 Iframe 12 CSS 16 Include (php komutu) 20 1 Slice Fireworks te yapacağımız sitenin boyutuna göre

Detaylı

VKV Koç Özel İlkokulu, Ortaokulu ve Lisesi. K12Net Veli Yardım Kılavuzu

VKV Koç Özel İlkokulu, Ortaokulu ve Lisesi. K12Net Veli Yardım Kılavuzu VKV Koç Özel İlkokulu, Ortaokulu ve Lisesi KNet Veli Yardım Kılavuzu KNet e Erişim KNet Erişim Bilgilerini Güncelleme KNet te Öğrenci Bilgilerini Görüntüleme KNet Ekran Ara Yüzünü Özelleştirme KNet te

Detaylı

Hızlı Başlangıç Kılavuzu

Hızlı Başlangıç Kılavuzu Hızlı Başlangıç Kılavuzu Microsoft Excel 2013 önceki sürümlerden farklı görünüyor, bu nedenle öğrenmenizi kolaylaştırmak için bu kılavuzu oluşturduk. Hızlı Erişim Araç Çubuğu'na komutlar ekleme Şeridi

Detaylı

Flash ile Etkileşimli Öğretim Materyali Hazırlama Semineri

Flash ile Etkileşimli Öğretim Materyali Hazırlama Semineri Öğretim Teknolojileri Destek Ofisi Instructional Technologies Support Office Flash ile Etkileşimli Öğretim Materyali Hazırlama Semineri Semboller, Ses Ekleme, Video Ekleme Orta Doğu Teknik Üniversitesi

Detaylı

Capture Pro Yazılımı. Başvuru Kılavuzu. A-61640_tr

Capture Pro Yazılımı. Başvuru Kılavuzu. A-61640_tr Capture Pro Yazılımı Başvuru Kılavuzu A-61640_tr Kodak Capture Pro Yazılımı'na Başlarken Bu kılavuz, kısa sürede başlamak için, Kodak Capture Pro Yazılımı'nın yüklenmesi ve başlatılmasına yönelik basit

Detaylı

Resim 7.20: Yeni bir ileti oluşturma

Resim 7.20: Yeni bir ileti oluşturma F İLETİLER Konuya Hazırlık 1. E-posta adresinden yeni bir ileti nasıl oluşturulur? 1. İLETI GÖNDERME a. Yeni bir ileti oluşturma: Yeni bir ileti oluşturmak için Dosya/Yeni/E-posta iletisi seçilebileceği

Detaylı

OFFICE EXCEL 2007 TEMEL EĞĐTĐMĐ

OFFICE EXCEL 2007 TEMEL EĞĐTĐMĐ Çalışma Kitapları Oluşturmak OFFICE EXCEL 2007 TEMEL EĞĐTĐMĐ Var olan verilerinizin hiçbiriyle ilişkili olmayan verileri toplamak ve depolamak istediğinizde, yeni bir çalışma kitabı oluşturmanız gerekir.

Detaylı