Pencere > CSS Özellikleri'ni seçin.
- Illustrator’a giriş
-
Çalışma alanı
- Çalışma alanı ile ilgili temel bilgiler
- Belge oluşturma
- Illustrator'daki Keşfet paneli ile daha hızlı öğrenin
- Bağlamsal Görev Çubuğu'nu kullanarak iş akışlarını hızlandırma
- Araç çubuğu
- Varsayılan klavye kısayolları
- Klavye kısayollarını özelleştirme
- Çalışma yüzeylerine giriş
- Çalışma yüzeylerini yönetme
- Çalışma alanını özelleştirme
- Özellikler paneli
- Tercihleri ayarlama
- Dokunmatik Çalışma Alanı
- Illustrator’da Microsoft Surface Dial desteği
- Düzenlemeleri geri alma ve tasarım geçmişini yönetme
- Görünümü döndür
- Cetveller, ızgaralar ve kılavuzlar
- Illustrator’da erişilebilirlik
- Çizimi görüntüleme
- Illustrator’ı Touch Bar ile kullanma
- Dosyalar ve şablonlar
-
Illustrator’da araçlar
- Bir bakışta araçlar
- Seçme araçları
- Gezinme araçları
- Boyama araçları
- Metin araçları
- Çizim araçları
- Değiştirme araçları
- Üretken Yapay Zeka (Çin ana karasında kullanılamamaktadır)
- Hızlı eylemler
- iPad’de Illustrator uygulamasına giriş
- Çalışma alanı
- Belgeler
- Nesneleri seçme ve düzenleme
- Çizim yapma
- Yazım
- Görüntülerle çalışma
- Renk
- Temel bilgiler
- Sorun giderme
-
Çizim yapma
- Çizim hakkında temel bilgiler
- Yolları düzenleme
- Piksel bakımından kusursuz resimler çizme
- Kalem, Kavis veya Kurşun Kalem aracıyla çizim yapma
- Basit çizgiler ve şekiller çizme
- Dikdörtgen ve yuvarlak ızgaralar çizme
- Mercek parlamaları çizme ve düzenleme
- Görüntüleri izleme
- Yolu basitleştirme
- Sembolizm araçları ve sembol kümeleri
- Yol parçalarını ayarlama
- 5 kolay adımda çiçek tasarlama
- Perspektif ızgarası oluşturma ve düzenleme
- Perspektif ızgarasında nesneler çizme ve değiştirme
- Nesneleri tekrar kullanmak üzere sembollere dönüştürme
- Web iş akışları için pikselle hizalanmış yollar çizme
- Ölçüm
- 3D nesneler ve malzemeler
- Renk
- Boyama
-
Nesneleri seçme ve düzenleme
- Nesneleri seçme
- Katmanlar
- Nesneleri genişletme, gruplama ve grubu çözme
- Nesneleri taşıma, hizalama ve dağıtma
- Nesneleri yolda hizalama, yerleştirme ve taşıma
- Nesneleri glife yaslama
- Nesneleri Japonca glife yaslama
- Nesneleri yığınlama
- Nesneleri kilitleme, gizleme ve silme
- Nesneleri kopyalama ve çoğaltma
- Nesneleri döndürme ve yansıtma
- Nesnelere örgü uygulama
- Gerçekçi taslaklar oluşturma
-
Nesneleri yeniden şekillendirme
- Görüntüleri kırpma
- Nesneleri dönüştürme
- Nesneleri birleştirme
- Nesneleri kesme, bölme ve kırpma
- Kukla Çarpıt
- Nesneleri ölçekleme, yamultma ve deforme etme
- Nesneleri karıştırma
- Zarflar kullanarak yeniden şekillendirme
- Nesneleri efektlerle yeniden şekillendirme
- Şekillendirici ve Şekil Oluşturucu araçlarını kullanarak yeni şekiller oluşturma
- Canlı Köşeler ile çalışma
- Dokunma desteği ile geliştirilmiş yeniden şekillendirme iş akışları
- Kırpma maskelerini düzenleme
- Canlı şekiller
- Şekil Oluşturucu aracını kullanarak şekiller oluşturma
- Genel düzenleme
-
Yazım
- Metin ekleme ve yazım nesneleriyle çalışma
- Yeniden Akış Görüntüleyici
- Madde işaretli ve numaralandırılmış listeler oluşturma
- Metin alanını yönetme
- Fontlar ve tipografi
- Görüntülerde ve anahatlı metinlerde kullanılan fontları bulma
- Metne temel biçimlendirme ekleme
- Metne gelişmiş biçimlendirme ekleme
- Metni içe ve dışa aktarma
- Paragrafları formatlama
- Özel karakterler
- Yola yazma oluşturma
- Karakter ve paragraf stilleri
- Sekmeler
- Eksik fontları önizleme, ekleme veya değiştirme
- Arapça ve İbranice fontlar
- Fontlar | SSS ve sorun giderme ipuçları
- Kreatif tipografi tasarımları
- Yazımı ölçekleme ve döndürme
- Satır ve karakter aralığı
- Tireleme ve satır sonları
- Yazım ve dil sözlükleri
- Asya dillerindeki karakterleri formatlama
- Asya dillerinde metinler için oluşturucular
- Karışım nesneleri ile metin tasarımları oluşturma
- Görüntü İzleme’yi kullanarak metin posteri oluşturma
- Özel efektler oluşturma
- Web grafikleri
- İçe aktarma
- Illustrator’da Creative Cloud Libraries
- Baskıya hazırlama
- Yazdırma
- Düzeltilen sorunlar
- Bilinen sorunlar
- Çökme sorunları
- Çökmeden sonra dosyaları kurtarma
- Güvenli mod
- Dosya sorunları
- Desteklenen dosya formatları
- GPU cihaz sürücüsü sorunları
- Wacom cihaz sorunları
- DLL dosyası sorunları
- Bellek sorunları
- Tercihler dosyası sorunları
- Font sorunları
- Yazıcı sorunları
- Kilitlenme raporunu Adobe ile paylaşma
- Illustrator performansını iyileştirme
- Illustrator Kullanıcı Kılavuzu
-
Illustrator’ı tanıyın
- Illustrator’a giriş
-
Çalışma alanı
- Çalışma alanı ile ilgili temel bilgiler
- Belge oluşturma
- Illustrator'daki Keşfet paneli ile daha hızlı öğrenin
- Bağlamsal Görev Çubuğu'nu kullanarak iş akışlarını hızlandırma
- Araç çubuğu
- Varsayılan klavye kısayolları
- Klavye kısayollarını özelleştirme
- Çalışma yüzeylerine giriş
- Çalışma yüzeylerini yönetme
- Çalışma alanını özelleştirme
- Özellikler paneli
- Tercihleri ayarlama
- Dokunmatik Çalışma Alanı
- Illustrator’da Microsoft Surface Dial desteği
- Düzenlemeleri geri alma ve tasarım geçmişini yönetme
- Görünümü döndür
- Cetveller, ızgaralar ve kılavuzlar
- Illustrator’da erişilebilirlik
- Çizimi görüntüleme
- Illustrator’ı Touch Bar ile kullanma
- Dosyalar ve şablonlar
-
Illustrator’da araçlar
- Bir bakışta araçlar
- Seçme araçları
- Gezinme araçları
- Boyama araçları
- Metin araçları
- Çizim araçları
- Değiştirme araçları
- Üretken Yapay Zeka (Çin ana karasında kullanılamamaktadır)
- Hızlı eylemler
-
iPad'de Illustrator
- iPad’de Illustrator uygulamasına giriş
- Çalışma alanı
- Belgeler
- Nesneleri seçme ve düzenleme
- Çizim yapma
- Yazım
- Görüntülerle çalışma
- Renk
-
Bulut belgeleri
- Temel bilgiler
- Sorun giderme
-
İçerik ekleme ve düzenleme
-
Çizim yapma
- Çizim hakkında temel bilgiler
- Yolları düzenleme
- Piksel bakımından kusursuz resimler çizme
- Kalem, Kavis veya Kurşun Kalem aracıyla çizim yapma
- Basit çizgiler ve şekiller çizme
- Dikdörtgen ve yuvarlak ızgaralar çizme
- Mercek parlamaları çizme ve düzenleme
- Görüntüleri izleme
- Yolu basitleştirme
- Sembolizm araçları ve sembol kümeleri
- Yol parçalarını ayarlama
- 5 kolay adımda çiçek tasarlama
- Perspektif ızgarası oluşturma ve düzenleme
- Perspektif ızgarasında nesneler çizme ve değiştirme
- Nesneleri tekrar kullanmak üzere sembollere dönüştürme
- Web iş akışları için pikselle hizalanmış yollar çizme
- Ölçüm
- 3D nesneler ve malzemeler
- Renk
- Boyama
-
Nesneleri seçme ve düzenleme
- Nesneleri seçme
- Katmanlar
- Nesneleri genişletme, gruplama ve grubu çözme
- Nesneleri taşıma, hizalama ve dağıtma
- Nesneleri yolda hizalama, yerleştirme ve taşıma
- Nesneleri glife yaslama
- Nesneleri Japonca glife yaslama
- Nesneleri yığınlama
- Nesneleri kilitleme, gizleme ve silme
- Nesneleri kopyalama ve çoğaltma
- Nesneleri döndürme ve yansıtma
- Nesnelere örgü uygulama
- Gerçekçi taslaklar oluşturma
-
Nesneleri yeniden şekillendirme
- Görüntüleri kırpma
- Nesneleri dönüştürme
- Nesneleri birleştirme
- Nesneleri kesme, bölme ve kırpma
- Kukla Çarpıt
- Nesneleri ölçekleme, yamultma ve deforme etme
- Nesneleri karıştırma
- Zarflar kullanarak yeniden şekillendirme
- Nesneleri efektlerle yeniden şekillendirme
- Şekillendirici ve Şekil Oluşturucu araçlarını kullanarak yeni şekiller oluşturma
- Canlı Köşeler ile çalışma
- Dokunma desteği ile geliştirilmiş yeniden şekillendirme iş akışları
- Kırpma maskelerini düzenleme
- Canlı şekiller
- Şekil Oluşturucu aracını kullanarak şekiller oluşturma
- Genel düzenleme
-
Yazım
- Metin ekleme ve yazım nesneleriyle çalışma
- Yeniden Akış Görüntüleyici
- Madde işaretli ve numaralandırılmış listeler oluşturma
- Metin alanını yönetme
- Fontlar ve tipografi
- Görüntülerde ve anahatlı metinlerde kullanılan fontları bulma
- Metne temel biçimlendirme ekleme
- Metne gelişmiş biçimlendirme ekleme
- Metni içe ve dışa aktarma
- Paragrafları formatlama
- Özel karakterler
- Yola yazma oluşturma
- Karakter ve paragraf stilleri
- Sekmeler
- Eksik fontları önizleme, ekleme veya değiştirme
- Arapça ve İbranice fontlar
- Fontlar | SSS ve sorun giderme ipuçları
- Kreatif tipografi tasarımları
- Yazımı ölçekleme ve döndürme
- Satır ve karakter aralığı
- Tireleme ve satır sonları
- Yazım ve dil sözlükleri
- Asya dillerindeki karakterleri formatlama
- Asya dillerinde metinler için oluşturucular
- Karışım nesneleri ile metin tasarımları oluşturma
- Görüntü İzleme’yi kullanarak metin posteri oluşturma
- Özel efektler oluşturma
- Web grafikleri
-
Çizim yapma
-
Yazdırma
- Baskıya hazırlama
- Yazdırma
- Görevleri otomatikleştirme
-
Sorun giderme
- Düzeltilen sorunlar
- Bilinen sorunlar
- Çökme sorunları
- Çökmeden sonra dosyaları kurtarma
- Güvenli mod
- Dosya sorunları
- Desteklenen dosya formatları
- GPU cihaz sürücüsü sorunları
- Wacom cihaz sorunları
- DLL dosyası sorunları
- Bellek sorunları
- Tercihler dosyası sorunları
- Font sorunları
- Yazıcı sorunları
- Kilitlenme raporunu Adobe ile paylaşma
- Illustrator performansını iyileştirme
Bağımsız nesnelerin veya Illustrator’da tasarlanan tüm mizanpajın CSS kodunu ayıklamayı ve dışa aktarmayı öğrenin.
Illustrator’da bir HTML sayfası için tasarım oluşturabilirsiniz. Web Geliştirici, iyi bir görsel kılavuz niteliğinde olan bu tasarım sayesinde bir HTML düzenleyicide bir sayfaya mizanpajı, stilleri ve nesneleri kodlayabilir. Ancak, bileşenlerin ve nesnelerin tam görünümünü ve pozisyonunu tekrarlamak zaman alan, zorlu bir işlemdir.
Illustrator ile bir HTML sayfası için mizanpaj oluşturduğunuzda, bileşenlerin ve nesnelerin sayfadaki görünümünü belirleyen ilgili CSS kodunu da oluşturabilir ve dışa aktarabilirsiniz. CSS, metnin ve nesnelerin görünümünü (karakter ve grafik stillerine benzer şekilde) kontrol etmenizi sağlar.
CSS kodunu görüntüleme ve ayıklama
CSS Özellikleri paneli, kullanıcıların aşağıdakileri yapmasına olanak tanır:
- Seçilen nesnelerin CSS kodunu görüntüleyebilir ve kopyalayabilirler.
- Bir ya da daha fazla öğeyi veya seçilen tüm Illustrator öğelerini bir CSS dosyasına dışa aktarabilirler.
- Kullanılan bit eşleme dönüştürülebilir görüntüleri dışa aktarabilirler.
- Tarayıcıya özel CSS kodu oluşturabilirler.
A. Bazı stiller CSS koduna dönüştürülemediğinde uyarı verilir B. CSS Dışa Aktarma Seçenekleri iletişim kutusu C. Seçili CSS’yi Dosyaya Dışa Aktar D. Seçilen Stili Panoya Kopyala E. CSS Oluştur F. CSS Özellikleri Panel menüsü G. Seçilen nesnelerde kullanılan stiller H. CSS kodu
CSS kodunu görüntüleyip ayıklamak için aşağıdaki adımları uygulayın:
-
Not:
Illustrator belgenizdeki nesnelerin Katmanlar panelinde adlandırılmış olduğundan emin olun.
-
Oluşturulan CSS kodunu görüntülemek için:
Bir nesne için:
Bir nesne seçin. Nesnenin CSS kodu, CSS Özellikleri panelinde görüntülenir.
Birden çok nesne için:
Shift tuşunu basılı tutun, birden çok nesne seçin ve ardından CSS Özellikleri panelinde CSS Oluştur seçeneğini belirleyin.
Tüm nesneler için:
Ctrl/Cmd + A tuşlarına basarak tüm nesneleri seçin ve ardından CSS Özellikleri panelinde CSS Oluştur seçeneğini belirleyin.
-
Oluşturulan CSS kodunu almak için aşağıdakilerden birini yapın:
Seçilen kodu kopyalamak için:
- Belirli bir kodu seçin ve panoya kopyalamak için Seçilen Stili Kopyala seçeneğini belirleyin.
- CSS Özellikleri Panel menüsünü Seçili CSS’yi Dışa Aktar seçeneğini belirleyin.
seçin ve bir dosyaya dışa aktarmak için
Tüm kodları kopyalamak için:
- CSS kodunda seçim yapmayın ve kodu panoya kopyalamak için Seçilen Stili Kopyala seçeneğini belirleyin.
- CSS Özellikleri Panel menüsünü Tümünü Dışa Aktar seçeneğini belirleyin.
seçin ve bir dosyaya dışa aktarmak için
-
CSS kodunu bir dosyaya kaydederken CSS Dışa Aktarma Seçenekleri iletişim kutusundaki seçenekler arasından seçim yapın.
CSS Dışa Aktarma Seçenekleri CSS Dışa Aktarma Seçenekleri
Örnek CSS Kodu
Degrade uygulanmış dikdörtgen (tüm tarayıcılar)
.GRADIENT_BOX { background : -moz-linear-gradient(0% 50% 0deg,rgba(255, 242, 0, 1) 0%,rgba(254, 236, 1, 1) 10.31%,rgba(253, 218, 4, 1) 24.34%,rgba(251, 190, 9, 1) 40.51%,rgba(247, 150, 15, 1) 58.28%,rgba(243, 99, 24, 1) 77.37%,rgba(238, 37, 34, 1) 97.27%,rgba(237, 28, 36, 1) 100%); background : -webkit-linear-gradient(0deg, rgba(255, 242, 0, 1) 0%, rgba(254, 236, 1, 1) 10.31%, rgba(253, 218, 4, 1) 24.34%, rgba(251, 190, 9, 1) 40.51%, rgba(247, 150, 15, 1) 58.28%, rgba(243, 99, 24, 1) 77.37%, rgba(238, 37, 34, 1) 97.27%, rgba(237, 28, 36, 1) 100%); background : -webkit-gradient(linear,0% 50% ,100% 50% ,color-stop(0,rgba(255, 242, 0, 1) ),color-stop(0.1031,rgba(254, 236, 1, 1) ),color-stop(0.2434,rgba(253, 218, 4, 1) ),color-stop(0.4051,rgba(251, 190, 9, 1) ),color-stop(0.5828,rgba(247, 150, 15, 1) ),color-stop(0.7737,rgba(243, 99, 24, 1) ),color-stop(0.9727,rgba(238, 37, 34, 1) ),color-stop(1,rgba(237, 28, 36, 1) )); background : -o-linear-gradient(0deg, rgba(255, 242, 0, 1) 0%, rgba(254, 236, 1, 1) 10.31%, rgba(253, 218, 4, 1) 24.34%, rgba(251, 190, 9, 1) 40.51%, rgba(247, 150, 15, 1) 58.28%, rgba(243, 99, 24, 1) 77.37%, rgba(238, 37, 34, 1) 97.27%, rgba(237, 28, 36, 1) 100%); background : -ms-linear-gradient(0deg, rgba(255, 242, 0, 1) 0%, rgba(254, 236, 1, 1) 10.31%, rgba(253, 218, 4, 1) 24.34%, rgba(251, 190, 9, 1) 40.51%, rgba(247, 150, 15, 1) 58.28%, rgba(243, 99, 24, 1) 77.37%, rgba(238, 37, 34, 1) 97.27%, rgba(237, 28, 36, 1) 100%); -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFF200', endColorstr='#ED1C24' ,GradientType=0)"; background : linear-gradient(90deg, rgba(255, 242, 0, 1) 0%, rgba(254, 236, 1, 1) 10.31%, rgba(253, 218, 4, 1) 24.34%, rgba(251, 190, 9, 1) 40.51%, rgba(247, 150, 15, 1) 58.28%, rgba(243, 99, 24, 1) 77.37%, rgba(238, 37, 34, 1) 97.27%, rgba(237, 28, 36, 1) 100%); border-style : Solid; border-color : #231F20; border-color : rgba(35, 31, 32, 1); border-width : 1px; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFF200',endColorstr='#ED1C24' , GradientType=1); }
Degrade uygulanmış dikdörtgen (yalnızca webkit tabanlı tarayıcılar)
.GRADIENT_BOX { background : -webkit-linear-gradient(0deg, rgba(255, 242, 0, 1) 0%, rgba(254, 236, 1, 1) 10.31%, rgba(253, 218, 4, 1) 24.34%, rgba(251, 190, 9, 1) 40.51%, rgba(247, 150, 15, 1) 58.28%, rgba(243, 99, 24, 1) 77.37%, rgba(238, 37, 34, 1) 97.27%, rgba(237, 28, 36, 1) 100%); background : -webkit-gradient(linear,0% 50% ,100% 50% ,color-stop(0,rgba(255, 242, 0, 1) ),color-stop(0.1031,rgba(254, 236, 1, 1) ),color-stop(0.2434,rgba(253, 218, 4, 1) ),color-stop(0.4051,rgba(251, 190, 9, 1) ),color-stop(0.5828,rgba(247, 150, 15, 1) ),color-stop(0.7737,rgba(243, 99, 24, 1) ),color-stop(0.9727,rgba(238, 37, 34, 1) ),color-stop(1,rgba(237, 28, 36, 1) )); background : linear-gradient(90deg, rgba(255, 242, 0, 1) 0%, rgba(254, 236, 1, 1) 10.31%, rgba(253, 218, 4, 1) 24.34%, rgba(251, 190, 9, 1) 40.51%, rgba(247, 150, 15, 1) 58.28%, rgba(243, 99, 24, 1) 77.37%, rgba(238, 37, 34, 1) 97.27%, rgba(237, 28, 36, 1) 100%); border-style : Solid; border-color : #231F20; border-color : rgba(35, 31, 32, 1); border-width : 1px; }
Birden fazla nesne
.NormalCharacterStyle { font-family : Myriad Pro; font-size : 12px; } .st0 { border-style : Solid; border-color : #FFFFFF; border-color : rgba(255, 255, 255, 1); border-width : 0px; } .GRADIENT_BOX { background : -webkit-linear-gradient(0deg, rgba(255, 242, 0, 1) 0%, rgba(254, 236, 1, 1) 10.31%, rgba(253, 218, 4, 1) 24.34%, rgba(251, 190, 9, 1) 40.51%, rgba(247, 150, 15, 1) 58.28%, rgba(243, 99, 24, 1) 77.37%, rgba(238, 37, 34, 1) 97.27%, rgba(237, 28, 36, 1) 100%); background : -webkit-gradient(linear,0% 50% ,100% 50% ,color-stop(0,rgba(255, 242, 0, 1) ),color-stop(0.1031,rgba(254, 236, 1, 1) ),color-stop(0.2434,rgba(253, 218, 4, 1) ),color-stop(0.4051,rgba(251, 190, 9, 1) ),color-stop(0.5828,rgba(247, 150, 15, 1) ),color-stop(0.7737,rgba(243, 99, 24, 1) ),color-stop(0.9727,rgba(238, 37, 34, 1) ),color-stop(1,rgba(237, 28, 36, 1) )); background : linear-gradient(90deg, rgba(255, 242, 0, 1) 0%, rgba(254, 236, 1, 1) 10.31%, rgba(253, 218, 4, 1) 24.34%, rgba(251, 190, 9, 1) 40.51%, rgba(247, 150, 15, 1) 58.28%, rgba(243, 99, 24, 1) 77.37%, rgba(238, 37, 34, 1) 97.27%, rgba(237, 28, 36, 1) 100%); border-style : Solid; border-color : #231F20; border-color : rgba(35, 31, 32, 1); border-width : 1px; }
İlgili konular
Bir sorunuz ya da fikriniz mi var?
Sormak istediğiniz bir sorunuz veya paylaşmak istediğiniz bir fikriniz varsa Adobe Illustrator Topluluğu'na katılın. Görüşlerinizi almak isteriz.