• Buradasın

    CSS

    Özetteki ilgi çekici içerikler

    • Notepad++ Kurulum ve Kullanım Rehberi

      Bu video, bir eğitim içeriği olup, konuşmacı Notepad++ uygulamasının kurulumunu ve temel kullanımını adım adım göstermektedir. Video, Notepad++'ın indirme ve kurulum sürecini detaylı olarak anlatmaktadır. Kurulum tamamlandıktan sonra uygulamanın temel özellikleri gösterilmektedir: yeni dosya oluşturma, dosya açma, farklı kaydetme, dosya yeniden adlandırma, yazdırma, geri alma, kes-kopyala-yapıştır, yorum ekleme, arama, karakter takımı seçimi ve ayarlar menüsü gibi fonksiyonlar açıklanmaktadır. Özellikle yeni başlayanlar için HTML, CSS ve diğer kodların yazılmasında kullanılabilecek bir editör olarak Notepad++ tanıtılmaktadır.

      • youtube.com

    • Bir Saatte HTML Kursu

      Bu video, bir eğitmen tarafından sunulan kapsamlı bir HTML eğitim kurusudur. Eğitmen, web geliştirme temellerini adım adım anlatmaktadır. Video, HTML'in temellerinden başlayarak ileri seviye konulara kadar uzanan bir yapıya sahiptir. İlk bölümde HTML'in ne olduğu, gerekli programların kurulumu ve temel HTML etiketleri (html, head, body, title, h1-h6, p, br, hr) anlatılırken, sonraki bölümlerde bağlantılar, resimler, sesler, video oynatma, metin biçimlendirme, listeler, tablolar, CSS kullanımı, div ve span etiketleri, meta etiketleri, iframe, buton ekleme ve form oluşturma konuları ele alınmaktadır. Eğitim, Visual Studio Code ve Google Chrome kullanarak pratik örneklerle ilerlemekte ve her konu için gerekli etiketler, parametreler ve kullanım şekilleri detaylı olarak gösterilmektedir. Video, web geliştirme öğrenmek isteyenler için temel HTML bilgilerini içermekte ve son bölümde CSS ve JavaScript öğrenme önerisiyle sonlanmaktadır.

      • youtube.com

    • HTML ve CSS ile Video Oynatma Uygulaması Eğitimi

      Bu video, bir web geliştirme eğitim içeriğidir. Eğitmen, HTML ve CSS kullanarak video oynatma uygulaması oluşturmayı adım adım göstermektedir. Video, bir HTML belgesi üzerinden başlayıp, Google Fontlar ve CSS stil sayfası kullanarak tasarım sürecini göstermektedir. Eğitmen, video kapsayıcısı, kontrol düğmeleri, oynatma ve duraklatma butonları gibi öğelerin nasıl oluşturulacağını ve CSS ile nasıl stillendirileceğini anlatmaktadır. Ayrıca, video oynatma için JavaScript kütüphanesinin nasıl kullanılacağı ve video kontrolünün mobil cihazlar için nasıl ayarlanacağı da gösterilmektedir.

      • youtube.com

    • CSS'de 100vw Viewport Birimi ve Scroll Bar Gutter Stable Değişiklikleri

      Bu podcast, Kevin adlı bir front-end geliştiricisinin sunduğu "General Musings" adlı bir podcasttir. Kevin, front-end geliştirme konularında haftalık içerikler paylaşmaktadır.. Podcast, Chrome'un CSS'de 100vw viewport birimini scroll bar farkında hale getirmesi ve scroll bar gutter stable özelliğinin kullanımını ele almaktadır. İlk bölümde 2023'te CSS çalışma grubu tarafından kararlaştırılan ve Chrome 145'te uygulanacak 100vw viewport biriminin scroll bar farkında hale getirilmesi anlatılırken, ikinci bölümde scroll bar gutter stable özelliğinin 12 milyon web sitesi üzerinde yapılan analizle incelenmesi ve sadece 38 sitede kullanıldığı belirtilmektedir.. Video ayrıca, bu değişikliklerin Chromium tabanlı tarayıcılarda (özellikle Chrome) çalıştığını, diğer tarayıcılarda henüz desteklenmediğini ve Mac kullanıcıları için scroll barları nasıl aktif edebilecekleri konusunda bilgi vermektedir. Kevin, viewport birimlerinin gereksiz yerlerde kullanılmaması gerektiğini ve CSS'in doğru kullanımını öğrenmenin önemini de vurgulamaktadır.

      • youtube.com

    • Windows 10'da HTML ve CSS Kodlama Eğitimi

      Bu video, bir programlama kanalında yayınlanan eğitim içeriğidir. Sunucu, Windows 10 işletim sisteminde HTML ve CSS kodlamayı nasıl yapabileceğinizi adım adım göstermektedir. Video, Visual Studio Code'un Windows 10'a kurulumundan başlayarak, gerekli uzantıların (Live Server ve Prettier) kurulumunu, kod düzenleyicisinin ayarlarını (metin boyutu ve tema) ve temel HTML/CSS kodlamayı kapsamaktadır. Sunucu, Emmet kısaltması kullanarak otomatik kod oluşturma, Live Server ile otomatik yenileme özelliği ve CSS ile HTML öğelerine stil uygulama gibi pratik bilgiler de paylaşmaktadır.

      • youtube.com

    • HTML ve CSS Temel Uygulamaları Eğitimi

      Bu video, bir eğitmen tarafından sunulan HTML ve CSS temel derslerinin devamı niteliğindedir. Eğitmen, temel bilgileri pekiştirmek için basitten karmaşığa doğru uygulamalar yapmayı amaçlamaktadır. Videoda, Visual Studio Code kullanılarak basit bir web sayfası tasarımı adım adım gösterilmektedir. Eğitmen, index.html ve style.css dosyalarını oluşturarak, CSS ile arka plan rengi, font family, margin, padding, float, line-height, text-align, font-size ve font-style gibi temel stillendirme tekniklerini uygulamaktadır. Örnek olarak "İşletim Sistemleri" başlıklı bir sayfa tasarlanarak, h1, h2 etiketleri, p etiketleri ve img etiketleri kullanılarak basit bir web sayfası oluşturulmaktadır. Eğitim, başlangıç seviyesindeki kullanıcılar için hazırlanmış olup, ilerleyen derslerde daha karmaşık siteler tasarlanacağı belirtilmektedir. Ayrıca, Windows XP, Windows 7, Windows 10 ve Pardus işletim sistemleri hakkında bir web sayfası oluşturarak, aynı HTML kodlarının farklı işletim sistemleri için nasıl kopyalanıp yapıştırılacağı gösterilmektedir.

      • youtube.com

    • Google Sites'e HTML Kodu Ekleme Rehberi

      Bu video, bir eğitim içeriği olup, izleyicilere Google Sites'e özel HTML kodu eklemenin nasıl yapılacağını adım adım göstermektedir.. Video, Google Sites'e HTML kodu eklemenin temel yöntemlerini anlatmaktadır. İçerikte, "Embed Code" özelliğinin nasıl kullanılacağı, ChatGPT gibi araçların HTML kodu oluşturma için nasıl yardımcı olabileceği gösterilmektedir. Ayrıca, HTML kodunun CSS ile birlikte kullanılabileceği, renk değiştirme gibi temel tasarım özellikleri ve menü oluşturma gibi uygulamalar da gösterilmektedir. Video, Google Sites'in sunduğu diğer özellikler (formlar, grafikler, Google uzantıları) hakkında da bilgi vermektedir.

      • youtube.com

    • HTML ve CSS ile Responsive Web Tasarım Eğitimi

      Bu video, bir eğitmen tarafından sunulan kapsamlı bir web tasarım eğitim içeriğidir. Eğitmen, HTML ve CSS kullanarak responsive web sayfası tasarımı yapmaktadır. Videoda, web sayfasının header, content ve footer bölümlerinin oluşturulması, flexbox kullanarak öğelerin hizalanması, font boyutları, margin ve padding değerlerinin ayarlanması gibi temel konular ele alınmaktadır. Ayrıca, responsive tasarım için medya sorguları (media queries) kullanarak farklı ekran boyutlarında tasarımın nasıl düzenleneceği adım adım gösterilmektedir. Eğitim içeriğinde, kapsayıcıların (container, upslate, info) konumlandırılması, resimlerin yan yana yerleştirilmesi, renklerin ayarlanması ve Colorzilla aracılığıyla renk değerlerinin alınması gibi pratik bilgiler de sunulmaktadır. Video, bir web sayfasının hem tasarımın hem de farklı ekran boyutlarında düzgün görünürlüğünün nasıl sağlanacağını göstermektedir.

      • youtube.com

    • Yazılım Öğrenme Hikayesi

      Bu videoda İstanbul'da Beykent Üniversitesi Yönetim Bilişim Sistemleri bölümünde ikinci sınıf öğrencisi olan bir içerik üreticisi, yazılım öğrenme yolculuğunu anlatıyor. Video, içerik üreticisinin yazılım öğrenme sürecini ve bu konudaki deneyimlerini paylaşıyor. Selman Kahya'nın videolarını izleyerek HTML, CSS ve JavaScript öğrenmeye başladığını, yaklaşık iki hafta içinde HTML'i tamamladığını ve JavaScript'in yarısına geldiğini belirtiyor. Video serisi, hiç yazılım bilgisi olmayan birinin tek başına neler yapabileceğini göstermek amacıyla hazırlanmış olup, ilerleyen bölümlerde staj kovalama çalışmaları ve profesyonel yazılımcılarla röportajlar da yer alacak.

      • youtube.com

    • Türkçe Karakterlerde CSS Uppercase Sorunu ve Çözümü

      Bu video, bir eğitim içeriği olup, konuşmacı Türkçe karakterlerle ilgili bir sorunu ve çözümünü göstermektedir. Video, Türkçe karakterlerde CSS'in text-transform: uppercase özelliğinin küçük "i" harfini büyük "ı" harfine dönüştürdüğü sorununu ele alıyor. Konuşmacı, bu sorunu çözmek için HTML tag'ında lang özelliğini kullanmanın önemini gösteriyor. Ayrıca, farklı dillerde (İngilizce, Rusça, Azerice, Türkçe) bu çözümün nasıl çalıştığını örneklerle açıklıyor.

      • youtube.com

    • HTML'de Resim Ekleme Eğitimi

      Bu video, bir eğitmen tarafından sunulan HTML dersinin bir bölümüdür. Eğitmen, izleyicilere HTML'de resim ekleme konusunu adım adım anlatmaktadır. Videoda, Sublime Text editörü kullanılarak HTML dosyasına resim ekleme işlemi gösterilmektedir. Eğitmen önce temel resim ekleme kodunu (img src="resim.png") açıklar, ardından resim dosyalarının doğru şekilde nasıl çağrılacağını ve klasör yapısının önemini örneklerle anlatır. Ayrıca, resim boyutlarını CSS ile nasıl düzenleyeceğini de kısaca belirtir. Video, bir sonraki derste video ekleme, müzik dosyası ekleme ve CSS konularına geçileceğini duyurarak sona erer.

      • youtube.com

    • CSS Temel Eğitimi

      Bu video, bir eğitmen tarafından sunulan CSS (Cascading Style Sheets) eğitim içeriğidir. Eğitmen, Visual Studio Code editörü kullanarak CSS'in temel kullanımını göstermektedir. Video, CSS'in ne olduğunu ve HTML ile nasıl entegre edildiğini açıklayarak başlıyor, ardından CSS'in üç farklı kullanım şeklini (satır içi, sayfa içi ve harici) detaylı şekilde ele alıyor. Eğitmen, class ve id kullanımını örneklerle açıklıyor, harici stil dosyalarının nasıl oluşturulacağını ve projeye nasıl dahil edileceğini gösteriyor. Eğitim içeriğinde ayrıca CSS özellikleri (renk, arka plan, yazı tipi, boyut) nasıl tanımlanacağı, CSS kodlarının doğru yazımı, noktalı virgül kullanımı ve yorum satırı oluşturma gibi temel konulara da değiniliyor. Video, bir sonraki derste CSS'in inceliklerine değinileceğini belirterek sona eriyor.

      • youtube.com

    • HTML ve CSS Çalışma Mantığı Eğitimi

      Bu video, bir eğitmen tarafından sunulan HTML ve CSS programlama dili hakkında bir eğitim içeriğidir. Videoda, HTML ve CSS'in çalışma mantığı anlatılmaktadır. Eğitmen, bir h1 etiketi için hem yukarıdan hem aşağıdan style vererek yazı rengini kırmızı ve yeşil olarak ayarlamayı göstermekte ve bu durumun neden geçerli olanın son ayar olduğunu açıklamaktadır. Ayrıca, aynı özelliği iki kez belirlemenin hatalara sebep olabileceğini ve bunu önlemek için "!important" özelliğinin nasıl kullanılacağını örneklerle göstermektedir. Video, bir sonraki bölümde dışarıdan alınan renklerin nasıl kullanılacağını göstereceğini belirterek sona ermektedir.

      • youtube.com

    • CSS Overflow Özelliği Eğitim Videosu

      Bu video, bir eğitim içeriği olup, bir eğitmen tarafından CSS'deki overflow özelliğinin nasıl kullanılacağı anlatılmaktadır. Video, overflow özelliğinin farklı değerlerini (visible, hidden, scroll, auto) ve bunların div içindeki taşma durumlarını nasıl etkilediğini örneklerle açıklamaktadır. Eğitmen önce teorik bilgileri vererek overflow özelliğinin ne olduğunu anlatıp, ardından bir proje üzerinde pratik uygulamalar yaparak her bir değerin nasıl çalıştığını göstermektedir. Özellikle div'in yüksekliğini sabit tutmanın overflow özelliğinin etkili çalışması için önemini vurgulamaktadır.

      • youtube.com

    • Live Preview Kullanarak Web Sayfasını Canlı Olarak Görüntüleme

      Bu video, bir eğitim içeriği olup, izleyicilere web geliştirme sürecinde Live Preview özelliğinin nasıl kullanılacağını göstermektedir.. Video, index.html adlı bir HTML sayfasının JavaScript, CSS ve normal HTML içeriğini göstererek başlıyor. Ardından, kod değişikliklerinin canlı olarak görüntülenmesi için Live Preview eklentisinin nasıl kurulacağı adım adım anlatılıyor. Kurulum sonrası, komut paleti üzerinden Live Preview'ı başlatma ve kod değişikliklerinin anında web sayfasında yansımasını gösterme işlemi gösteriliyor. Bu özellik, geliştirme sürecini hızlandırmak için faydalı bir araç olarak sunuluyor.

      • youtube.com

    • Sıfırdan Web Sitesi Yapımı Eğitimi

      Bu video, bir eğitmen tarafından sunulan kapsamlı bir web geliştirme eğitim içeriğidir. Eğitmen, izleyicilere adım adım HTML ve CSS kullanarak basit bir web sitesi oluşturma sürecini göstermektedir. Video, web sitesi yapımının temellerinden başlayarak tüm süreci kapsamaktadır. İlk olarak dosya hiyerarşisi oluşturma ve temel HTML yapısı, ardından header, content ve footer bölümlerinin oluşturulması, CSS ile stillendirme, menü oluşturma, banner ekleme, fotoğraf galerisi ve iletişim sayfası oluşturma konuları ele alınmaktadır. Eğitim içeriğinde ayrıca meta etiketleri, favicon ekleme, CSS özellikleri (margin, padding, border, font size, hover efekti), menü linklerini stilize etme, "seçili" sınıfı oluşturma ve iletişim formu oluşturma gibi pratik uygulamalar da gösterilmektedir. Video, web sitesi yapımı konusunda temel bilgi edinmek isteyenler için adım adım bir rehber niteliğindedir.

      • youtube.com

    • Minecraft Web Sitesi Tasarımı Eğitim Videosu

      Bu video, bir eğitmen tarafından sunulan web geliştirme eğitim serisinin ilk bölümüdür. Eğitmen, temel kodlama bilgisi olmadan da izleyebileceklerini belirterek başlamaktadır. Videoda Minecraft web sitesi tasarımı konusu ele alınmaktadır. İlk bölümde web sitesi tasarımı için gerekli araçlar (XAMPP, Sublime Text, Bootstrap) tanıtılmakta ve temel mantık anlatılmaktadır. İkinci bölümde ise grid sistemi detaylı olarak açıklanmakta, bir sayfayı 12 parçaya bölmeyi ve farklı düzenlerde kullanmayı göstermektedir. Eğitim serisi, HTML, CSS ve JavaScript'ten oluşan web sitesi yapısını, Bootstrap'in web sitesinin altyapısını sağlama özelliğini ve Font Awesome gibi ikon kütüphanelerinin kullanımını içermektedir. Ayrıca, web sayfasının header, navbar, main ve footer bölümlerinin nasıl oluşturulacağına dair temel bilgiler sunulmaktadır.

      • youtube.com

    • HTML ve CSS ile Arka Plan Resmi Sabitleme Eğitimi

      Bu video, bir eğitim içeriği olup, izleyicilere HTML ve CSS kullanarak arka plan resminin sabit kalmasını öğretiyor. Video, bir word dosyası açarak başlıyor ve bu dosyanın HTML olarak kaydedilmesiyle devam ediyor. Daha sonra dışarıdan bir CSS dosyası oluşturuluyor ve bu dosyanın nasıl çağrılacağı gösteriliyor. Eğitmen, arka plan resmi ekleme, "background-attachment: fixed" kodu ile resmi sabitleme, yazı stilini düzenleme ve tablo oluşturma gibi adımları adım adım gösteriyor. Video, arka plan resminin sabit kalırken ön plandaki içeriklerin kaymasını göstererek sonlanıyor.

      • youtube.com

    • Playcode.io Web Sitesi İncelemesi

      Bu video, Yazılım Kodu kanalından Yavuz Selim Kart tarafından sunulan bir web sitesi inceleme videosu. Yavuz Selim, Playcode.io adlı online kodlama editörünü detaylı olarak tanıtmaktadır. Videoda Playcode.io sitesinin özellikleri ve kullanım alanları gösterilmektedir. Site, CodePen ve JS Fiddle gibi online editörlerin benzeri olarak HTML, CSS, JavaScript ve React gibi teknolojiler için kodlama imkanı sunmaktadır. Yavuz Selim, sitenin öğrenme bölümü, popüler template'ler, kütüphane ekleme özelliği, proje versiyonlama ve paylaşım imkanları gibi özelliklerini adım adım göstermektedir. Ayrıca ücretsiz kullanım için 4 MB saklama alanı ve ücretli versiyon için 1000 MB alan sunulduğu belirtilmektedir.

      • youtube.com
  • Yazeka sinir ağı makaleleri veya videoları özetliyor