Ev / Linux'a Genel Bakış / Web sayfalarına resim yerleştirme. Görseller Web sayfalarındaki görseller

Web sayfalarına resim yerleştirme. Görseller Web sayfalarındaki görseller

Bir Web sayfasının metnine resim eklemek için tek bir etiket kullanılır. (Tablo P 1). Bu etiketin nitelikleri sayfaya yerleştirilen görselin tüm parametrelerini belirler. Grafik dosyasının adresini ve adını tanımlayan SRC özelliği gereklidir. SRC özelliği ayarlanmamışsa yalnızca boş resim simgesi görüntülenecektir.

Etiket yapısı SRC özelliğiyle şuna benzer:

.

Enstitü adlı bir grafik dosyası Web sayfasıyla aynı klasörde bulunuyorsa, onu yerleştirmek için şunu yazmalısınız:

.

Dosya adı Formatı

D:\Collection\Cities\MINSK.GIF konumunda bulunan MINSK isimli bir grafik dosyasını yerleştirmek için şunu yazmalısınız: .

Etiket kullanma Web sayfası, İnternet'teki başka bir bilgisayarda bulunan bir grafik dosyası içerir.

Şekil 2'de gösterilen enstitümüzün bir fotoğrafını içeren bir Web sayfası oluşturmak. 4.1'de aşağıdaki HTML kodunu girmeniz gerekir:

Fotoğraflı web sayfası

Enstitümüz

Pirinç. 4.1. Enstitünün fotoğrafını içeren web sayfası

Yukarıdaki örnekte fotoğrafın yüksekliği (HEIGHT) 200 piksel, genişliği (WIDTH) ise 300 pikseldir. Fotoğrafı yerleştirmek için orta hizada bir paragraf oluşturulur.

Yatay çizgiler

Yatay çizgiler tek bir etiket kullanılarak bir Web sayfasına yerleştirilir


. SIZE, WIDTH, COLOR ve ALIGN nitelikleri sırasıyla çizgilerin kalınlığını, genişliğini, rengini ve hizalamasını değiştirir.

Yatay çizgilerin yerleşimini açıklamak için birkaç örneğe bakalım:

1.


- sayfanın tamamı boyunca 2 piksel kalınlığında yatay bir çizgi.

2.


WIDTH = "200" ALIGN="RIGHT"> – yeşil renkte yatay bir çizgi, 15 piksel kalınlığında, 200 piksel genişliğinde ve sağa hizalanmış.

3.


– tüm sayfayı kaplayan, 25 piksel kalınlığında yatay mavi bir çizgi.

4.


WIDTH = "300" HİZALAMA = "LEFT"> – kırmızı renkte yatay bir çizgi, 20 piksel kalınlığında, 300 piksel genişliğinde ve sola hizalanmış.

Kaydedilen dört örneğin satır ekranı Şekil 1'de gösterilmektedir. 4.2.

Pirinç. 4.2. Web sayfasındaki çizgiler



TABLOLAR

Tablo oluşturma

Tablo eşleştirilmiş bir etiket kullanılarak oluşturulur

. Bu etiket eklendiği yerde bir tablo oluşturur
HTML kodunda.

Herhangi bir tablo satırlardan ve hücre satırlarından oluşur. Tablo satırlarını ve hücrelerini oluşturmak için aşağıdaki etiketler kullanılır:

... – yeni hat;

... – başlık hücresi;

... – normal bir masa hücresi.

Bu etiketler eşleştirilmiş bir etiketin içine yazılır

.

Tablo satır satır oluşturulur - önce bir satır belirtilir ve gerekli hücre sayısı belirtilir, ardından ikinci satır vb.

Şekil 2'de gösterilen tabloyu elde etmek için. 5.1'de aşağıdaki HTML kodunu yazmanız gerekir:

Tablo sayfası

Pirinç. 5.1. Tablo sayfası

Tablo başlığı hücrelerindeki metin (Şekil 5.1) yarı kalın yazı tipinde görüntülenir ve hücrenin ortasına hizalanır, normal hücrelerde ise metin vurgulanmaz ve sola hizalanır.

Yukarıdaki sayfanın HTML kodunda etiketinin bulunduğuna dikkat edilmelidir.

Arabalar Fiyat Ford 5000 Golf 6000
"1" değerine sahip BORDER niteliğini içerir. Bu, Şekil 2'de gösterilen tabloda anlamına gelir. 5.1, dış sınırın kalınlığı
1 piksel. Eğer yazarsak

,

o zaman dış kenarlığın kalınlığı 6 piksel olacaktır. Tablo kenarlıklarının görüntülenmesini önlemek için BORDER niteliğini 0'a ayarlamanız veya bu niteliği atlamanız gerekir.

Çoğu Web sayfası grafikler içerir. Bilgileri renkli ve net bir şekilde sunmanızı sağlar. Çoğu durumda, uzun bir metin açıklaması vermek yerine bir resim göstermek daha iyidir.

Bir sayfaya grafik yerleştirmenin iki yolu vardır:

  • bireysel resimlerin eklenmesi;
  • arka planı bir resimle doldurmak.

Her durumda, grafik görüntüsü dosyadan alınır.

Grafik Ekleme

Grafik formatındaki bir dosyadan bir grafik görüntüsünün sayfaya eklenmesi etiketi kullanılarak yapılır. (İngilizce'den, resim - resim) dosya adresini SRC niteliğine argüman olarak belirtir:

< IMG SRC = "адрес_графического_файла" >

Grafik dosyası adresi, muhtemelen bir yol içeren bir URL veya dosya adıdır. Örneğin, logotip.jpg grafik dosyasını görüntülemek için şu etiketi yazmalısınız:

< IMG SRC = "logotip.jpg" >

Etiketteki grafik görüntünün aktarım hızını artırmak için özelliğini kullanabilirsiniz ( ek parametre) LOWSRC, bir grafik dosyasının adresini argüman olarak alır. İki grafik dosyası oluşturabilirsiniz: biri (örneğin, logotip.jpg) yüksek çözünürlüklü bir görüntü içerirken, diğeri (örneğin, logotip.gif) düşük çözünürlüklü bir görüntü içerir. Daha sonra etiket:

< IMG SRC = "logotip.jpg" LOWSRC = "logotip.gif" >

...tarayıcıya önce logotip.gif dosyasını indirmesi ve ardından bunu alındığında logotip.jpg dosyasıyla değiştirmesi talimatını verir.

Grafik yüklemeyi hızlandırmanın bir başka yolu da, nitelikleri kullanarak grafiğin yerleştirileceği dikdörtgen alanın boyutunu ayarlamaktır. GENİŞLİK(genişlik) ve YÜKSEKLİK(yükseklik), piksel cinsinden ölçülür. Bu nitelikleri belirtirseniz, tarayıcı önce grafikler için yer ayırır, belge düzenini hazırlar, metni görüntüler ve ancak ondan sonra grafikleri yükler. Tarayıcının, görüntüyü belirtilen çerçeve boyutuna sığacak şekilde sıkıştırdığını veya genişlettiğini unutmayın. Görüntü boyutlarını belirtmeye bir örnek:

< IMG SRC = "logotip.gif" WIDTH = 40 HEIGHT = 20 >

Grafikler genellikle metinle birlikte kullanıldığından metin ve grafikleri hizalama zorluğu ortaya çıkar. Bu sorun bu özellik kullanılarak çözülür. HİZALAMA etiket çeşitli argümanlar kullanarak. Örneğin, metnin bir görselin etrafında sağa veya sola doğru akmasını isteyebiliriz. Genellikle resim metne yakın bir şekilde gömülür ve bu da çirkin olabilir. Bunu önlemek için çizimin etrafına boş kenar boşlukları koyabilirsiniz. Alanlar öznitelikler kullanılarak oluşturulur VSPACEüst ve alt kenar boşlukları için ve UZAY bir etiketteki yan kenar boşlukları için . Bu özniteliklerin bağımsız değişkenleri, alanların boyutunu piksel cinsinden belirten sayılar olarak belirtilir. Grafiklerin etrafına metin sarmayı iptal etmek için etiketini kullanın
.

Aşağıdaki etiket logotip.jpg dosyasındaki grafikleri sağa kaydırılacak şekilde ayarlar (resim metnin solunda yer alacaktır):

< IMG SRC = "logotip.jpg" ALIGN = LEFT >

Metnin sağına bir resim yerleştirmek istiyorsanız bu özelliğe ihtiyacınız vardır. HİZALAMA argüman ata SAĞ:

< IMG SRC = "logotip.jpg" ALIGN = RIGHT >

Resmin etrafındaki kenar boşluklarını ayarlamak için şöyle bir etiket yazmanız gerekir:

< IMG SRC = "logotip.jpg" ALIGN = LEFT HSPACE = 20 VSPACE = 10 >

Burada 20 ve 10 sayıları alanların büyüklüğünü belirliyor.

Bir örneğe bakalım paylaşım grafikler ve metinler. Not Defteri'ni (metin düzenleyicisi Not Defteri) Windows'u açın. Yukarıda tartışılan etiketleri kullanarak HTML kodunu yazın. Aşağıda bazı metin ve grafiklerin çıktısını alan bir program bulunmaktadır. Elinizde bulunan dosyalardan herhangi birini grafik dosyası olarak kullanabilirsiniz. Burada kullanılan dosya logotip.gif'tir.

< HTML >

< HEAD >

< TITLE >Alıştırma 1< / TITLE >

< / HEAD >

< BODY BGCOLOR = "YELLOW" >

< IMG SRC = "logotip.gif " ALIGN = LEFT >

< H1 >Metin sağdaki grafiklerin etrafına sarılır< / H1 >

Pirinç. 657. Metin sağdaki resmin çevresine sarılır

Görüntülerin (diğer öğelerin yanı sıra) sayfa üzerinde hassas şekilde konumlandırılmasına yönelik geniş olanaklar, tablolar Ve stiller. Bu HTML öğeleri daha sonra tartışılacaktır. Örneğin, görünür çerçeveleri olmayan bir tablo tanımlayabilir ve bu tablonun hücrelerine resim, metin ve diğer öğeleri yerleştirebilirsiniz.

Tanım 1

Web sayfası metin dosyası, HTML'de oluşturulmuş ve World Wide Web'de (WWW) barındırılmıştır. Bir Web sayfası, metne ek olarak, diğer Web sayfalarına gidebileceğiniz ve bunları görüntüleyebileceğiniz hiper metin bağlantılarının yanı sıra grafik, animasyon, video klipler ve müzik biçiminde eklemeler de içerebilir.

HTML kullanarak şunları yapabilirsiniz:

  1. Web sayfaları oluşturun ve düzenleyin.
  2. Belgeye gömülü tüm nesnelerin (resimler, animasyonlar vb.) işleyişini dikkate alarak HTML belgelerini İnternet'ten düzenleyin.
  3. Köprü metni bağlantılarını ve çizimleri, diyagramları, animasyonları, video klipleri, müzik ve konuşma eşliğini, metin özel efektlerini bir HTML belgesine yerleştirme yeteneğini kullanarak, multimedya sunumları, slayt gösterileri, demo projeleri.

Not 1

Grafik görüntüler genellikle ayrı dosyalarda saklanır. HTML dili, bu dosyaların İnternet'teki gerçek adresleri olan Web sayfalarının kodlarına bağlantıların yazıldığı özel etiketlere sahiptir. Bu tür etiketlerle karşılaştığında, Web tarayıcısı Web sunucusundan resim, ses veya video içeren ilgili dosya için bir istekte bulunur ve bunu Web sayfasında bu etiketin bulunduğu yerde görüntüler. Web sayfasından ayrı dosyalarda saklanan her türlü veriye (resim, ses ve video vb.) Web sayfalarının gömülü öğeleri adı verilir. Bir Web sayfasına resim ekleme sürecine daha yakından bakalım.

Web Sayfasına Görüntü Ekleme

Web sayfalarının çekiciliği tam olarak grafiklerde ve üzerinde kullanılan diğer çeşitli nesnelerde yatmaktadır. Bir sayfaya resim eklemek zor değildir. Ve bunu yapabilecek grafikler ekleyin dış görünüş Web sayfaları daha prezentabl ve profesyoneldir, çok daha karmaşıktır ve özel bilgi gerektirir.

Aşağıdaki gibi görünen resim kaynağı etiketini kullanarak bir sayfaya resim ekleyebilirsiniz:

etiketin kendisi nerede ve scr onun niteliğidir. Scr niteliği gerekli olduğundan bu girdinin tamamının ortak bir etiket olduğunu söyleyebiliriz. Resim kaynak etiketi, karşılık gelen bir kapatma etiketi kullanmaz çünkü kaynak etiketi bağımsızdır ve bu nedenle kullanıldığında sonunda bir eğik çizgi gerektirir: .

Alternatif başlıklar ekleme

İnternette, farenizi bir Web sayfasındaki herhangi bir grafik nesnesinin üzerine getirdiğinizde görüntülenen çeşitli yazıları sıklıkla bulabilirsiniz. Bu başlıklar genellikle görselin kendisi veya sayfanın bulunduğu alanı hakkında ek bilgiler içerir.

Aşağıda, etiketin içine alt özelliğinin eklendiği HTML kodu verilmiştir. Bu öznitelik, src özniteliğine benzer şekilde, tarayıcıya görüntü hakkında bazı ek bilgiler verir ve ayrıca her zaman bir etiketle birlikte kullanılabilir.

alt="Bu bir resimdir!" />!}

Alt özelliğinin işlevi, bir Web sayfasına eklenen grafik öğesi için alternatif metni tanımlamaktır. Ekranda görüntünün kendisine alternatif olarak görüntülendiği için alternatif olarak adlandırılmaktadır. alt özelliği başka bir önemli işlevi yerine getirir. Web tasarımcısının, sayfa ziyaretçisinin ekranında görseli görmemesi durumunda en azından bu görsele eklenen metin bilgisini görebileceğinden emin olmasını sağlar.

Her etiket için alt niteliğini kullanırken grafik öğelerine uygunsuz metin mesajları atamamaya dikkat etmek önemlidir. Örneğin sayfa tasarım öğelerine alternatif metin etiketleri eklemenin bir anlamı yoktur. Bu tür hataları önlemek için bu öğelerin alt özelliğini boş bir değere (alt = " ") ayarlayabilirsiniz. Başka bir nitelik ayarlamazsanız, tarayıcı görüntüyü orijinal boyutunda oluşturacaktır ancak görüntünün üst kenarını bitişik metin dizesinin üst kenarıyla hizalayacaktır. Ancak stil sayfası etiketlerini kullanarak bu ayarların her ikisini de değiştirebilirsiniz.

Resim Nitelikleri

Etiket, görüntüleri yeniden boyutlandırmanıza olanak tanıyan niteliklere sahiptir. İşte bunlardan bazıları:

  • yükseklik – görüntünün yüksekliğini piksel veya yüzde cinsinden belirlemek için kullanılır;
  • genişlik – görüntünün genişliğini piksel veya yüzde olarak belirlemek için kullanılır.

Görüntü yüksekliğini ve genişliğini ayarlama

Web sayfalarına yerleştirilen görsellerin boyutları yukarıdaki özellikler kullanılarak ayarlanabilir. Üstelik değerleri ya sabit piksel sayısı olarak ya da sayfa boyutuna göre yüzde olarak ayarlanır. Aşağıdaki HTML kodunda, ilk etiket orijinal görselin boyutlarını piksel cinsinden içerir (dikey olarak 60 piksel ve yatay olarak 60 piksel), ikinci etiket aynı görselin genişliğini sayfa genişliğinin %6'sı ve yüksekliğini ise sayfa genişliğinin %6'sı kadar ayarlar. Sayfa yüksekliğinin %10'u.

alt = "Bu bir resim!" yükseklik = "60" genişlik = "60" />

alt = "Bu bir resim!" yükseklik = "10%" genişlik = "6%" />

Not 2

Görüntüleri kendi penceresinde görüntülerken, tarayıcı her iki değer türünü de eşit derecede iyi işler. Ancak Web sayfalarını ziyaret edenlerin bilgisayarlarındaki ekran çözünürlüğünün sizinkinden farklı olabileceğini unutmamanız gerekir. Bu nedenle, bir görseli yeniden boyutlandırırken görselin her iki değerini de (yükseklik ve genişlik) belirtmeniz gerekir. Bu değerlerden yalnızca birini değiştirirseniz ekrandaki görüntü dikey veya yatay olarak uzatılmış görünebilir.

Görüntülerin daha hızlı yüklendiği yanılsamasını yaratmak için kullanılabilir. Bunu yapmak için görselin yeniden boyutlandırılıp boyutlandırılmadığına bakılmaksızın her zaman yükseklik ve genişlik niteliklerinin değerlerini belirtmeniz gerekir. Çünkü tarayıcıya, bir sayfaya resim yerleştirmek için gereken alan miktarı hakkında önemli bilgiler verirler. Buna yanıt olarak tarayıcı, görüntü için gereken alanı ayırır ve görüntünün yüklenmesini durdurmadan sayfanın diğer öğelerini oluşturmaya devam eder. Bu, sayfanın daha hızlı yükleniyor gibi görünmesini sağlar çünkü ziyaretçilerin sayfadaki diğer bilgileri görmeden önce görselin tam olarak yüklenmesini beklemelerine gerek kalmaz.

Herhangi bir ekrandaki görüntünün, çözünürlüğü ne olursa olsun, sayfa genişliği boyunca tam olarak belirli bir miktarda yer kaplamasını sağlamak için yüzde değerlerinin kullanılması gerekir. Resmin çözünürlüğünün sabit olmasını istiyorsanız (piksel cinsinden boyutu), piksel cinsinden değerleri kullanmanız gerekir.

Metin ve grafikleri hizalama

Bir görüntüyü metin satırının sağ veya sol kenarına hizalamak için etiketin hizalama özelliğini kullanın. Örneğin:

alt = "Bu bir resim!" yükseklik = "60" genişlik = "60" hizalama = "sağ" />

Bir görüntüyü bir metin dizesine göre dikey olarak hizalamak için üst, alt ve orta değerlerini alabilen bu özelliği de kullanabilirsiniz. Top değeri, görüntünün üst kenarının kendisini çevreleyen metnin üst kenarıyla hizalanması gerektiğini belirtir. Bottom değeri, görüntünün alt kenarının kendisini çevreleyen metnin alt kenarıyla hizalanması gerektiğini belirtir. Merkez değeri, görselin merkezinin metin satırının merkeziyle hizalanması gerektiğini belirtir.

Görselleri bağlantı olarak kullanma

Resimler ayrıca diğer belgelere köprüler oluşturmak için de kullanılır. HTML'de bir resim, metin kutusuyla aynı şekilde bir köprüye dönüşür. Bunu yapmak için, bağlantı olması gereken bir sayfa öğesini (bizim durumumuzda bir resim) çevreleyen bir etiket kullanılır. Bağlantı bu resme tıkladığınızda takip edilecektir.

Küçük resim resimleri

Bir görüntünün bir köprü görevi gördüğü yukarıdaki yönteme ek olarak, bir görüntüden diğerine geçiş yapan bir köprü olarak da kullanılabilir. Bu, bir Web sayfasında yayınlamak istediğiniz görselin boyutunun oldukça büyük olduğu ve yüklenmesinin çok uzun süreceği ve birçok ziyaretçi için kabul edilemez olduğu durumlarda gereklidir. Bu nedenle, bu görselin küçültülmüş bir kopyasını (küçük resim) oluştururlar ve onu bir köprü ile temsil ederler. Bir sayfa ziyaretçisi bu görselle ilgileniyorsa, görselin tamamını görmek için küçük resme tıklayabilir. İşte bir kod örneği:

alt = "Normal resmi görmek için tıklayın."

yükseklik = "60" genişlik = "60" />

Görselleri Başarıyla Kullanmanın Sırları

Resimler ziyaretçiler için pek çok görsel bilgi sağlar ve bu onları çekici kılar ve ayrıca bir Web sayfasına eklemek de oldukça basittir, ancak bir sitenin popüler olmasını istiyorsak takip edilmesi gereken bir site oluşturmanın belirli kuralları vardır. internet.

Sayfaları oluştururken, büyük görsellerin yüklenmesi uzun zaman alacağından ve bazı kullanıcılar ağa erişmek için hala düşük hızlı iletişim kanallarını kullandığından, üzerlerine küçük görseller yerleştirmeye çalışmalısınız. verim ve bu nedenle indirilen dosyaların boyutu onlar için temel öneme sahiptir.

Not 3

HTML belgesinin tamamının genel dosya boyutu da önemlidir; bu da yalnızca içerdiği resimlerin boyutuna değil aynı zamanda sayılarına da bağlı olacaktır. Metin mesajının içeriğinin her zaman görselin kendisiyle eşleşmesi için alt özelliğini kullanırken dikkatli olmanız gerekir. Ve tam tersi durumda: görüntünün sayfada sunulan metin bilgisine uygun olduğundan emin olmak gerekir.

Oluşturduğunuz sayfada internetten ödünç alınan görselleri kullanırken bu görsellerin telif hakkıyla korunup korunmadığını kontrol etmeniz gerekmektedir.

Bahsedildiği gibi, günümüzde HTML, World Wide Web'de herhangi bir web sayfasını yazmanın temelidir. CSS kullandığınızda HTML kodu oluşturma işlemi önemli ölçüde değişir. Yalnızca belirli görsel efektleri elde etmek için hantal HTML etiketlerini yeniden kullanmaya elveda diyebilirsiniz. Kullanımdan kaldırılan etiket gibi bazı HTML etiketleri veya nitelikleri hakkında...

Ev

Bir web sitesi sipariş edin ve iş yapmaya başlayın!

Bu tabir pek çok sitede duyulup görülebiliyor ve bu boşuna değil!

Web sitesi bu şirketin yüzü. Potansiyel tüketicilerle iletişimin en modern ve etkili kanalıdır. Yalnızca bir İnternet sitesinin yetenekleri, kullanıcıya bir bilgi mesajı iletmenin tüm yöntemlerini tam olarak kullanmanıza izin verir. Tüketiciyi bunlara alıştırmak için metin, ses ve video bilgileri tek bir sitede sunulabilir.

Kullanarak yazılım Sitede ödeme kabul edebilir, telefonda konuşabilir, veritabanlarını koruyabilir, faks gönderip alabilir, SMS mesajı gönderip alabilir ve daha birçok işlemi gerçekleştirebilirsiniz. Modern bir İnternet sitesi yalnızca herhangi bir şirket için değil, aynı zamanda herhangi bir İnternet kullanıcısı için de bir bilgi merkezidir.

Ve bu, fikirlerinizi veya gelişmelerinizi en geniş kitleye etkili ve aynı zamanda basit ve net bir şekilde aktarmanın bir kazan-kazan yoludur. Ve bugün, hiper metin biçimlendirme dili HTML ile yazılan Web belgeleri, Web ortamında veri sunumunun ana biçimi olmaya devam ediyor.

HTML'nin en önemli avantajları şunlardır:

  • basitlik, HTML'yi mümkün olan en kısa sürede öğrenmenize olanak tanır.
  • kendi Web sayfalarınızı oluşturma yeteneği
  • ve HTML, günümüzde mevcut olan tüm platformlarda tamamen aynı şekilde çalışır; ek ekipman satın almaya gerek yoktur. Ve mevcut herhangi birini kullanmak yeterli metin editörüörneğin Not Defteri.

Bu sitede, kendi Web sitenizi oluşturma sürecinin tamamını, yani bitmiş projenin tüm kullanıcıların erişimini sağlamak için internette yayınlanmasını ayrıntılı olarak anlatmaya çalıştım.

Umarım makalelerim birçok kişi için çok faydalı olacaktır çünkü ben programcı değilim ama bu çalışmadan çok ilham aldım.

Bir Web sayfasına yerleştirilen grafik görseller yalnızca bilginin daha iyi algılanmasına katkıda bulunmakla kalmaz, aynı zamanda sayfaları daha canlı ve akılda kalıcı hale getirir. Grafik görselleri kendiniz hazırlayabilir veya tasarımcıların hizmetlerinden yararlanabilirsiniz. Aşağıdaki gibi yazılım ürünlerinden grafik dosyası kitaplıklarını da kullanabilirsiniz: Microsoft Ofisi, CorelDraw vb.

Oluşturduğumuz Web sitesinin ana sayfasına Microsoft Office'in içerdiği Clip Art kütüphanesinden bir grafik görseli yerleştirelim. Bunu yapmak için şu adımları izleyin:

  1. Oluşturulan Web sitesini açın.
  2. Açık ana sayfa paneldeki index.htm dosya adına çift tıklayarak Klasör listesi(Klasör Listesi).
  3. Menüde Sokmak(Ekle) seçme komutu Çizim Resimler(Küçük Resim). FrontPage program penceresinde bir panel belirir Resim ekleme(Küçük Resim Ekle).
  4. Bu panelden komutu seçin Resimlerin toplanması(Medya Galerisi). Bir grafik görüntüsü seçmenizi sağlayan bir iletişim kutusu açılır (Şek. 15.8).

Pirinç. 15.8.

İletişim kutusunun üst kısmında, pencerede gösterilen nesnelerin görüntülenmesini ve nesnelerin kopyalanmasını ve silinmesini kontrol eden düğmelerin yanı sıra atama düğmeleri de vardır (tabloya bakın).

  1. Paneli Koleksiyonların listesi Bilgisayarınızın multimedya dosyalarının yanı sıra Küçük Resim kitaplığı resim dosyalarını içeren klasörlerini içerir. İlgilendiğiniz resim kategorisinin klasörünü açın. Bu kategorideki görseller pencerenin çalışma alanında görünecektir. İmleci bir görüntünün üzerine getirdiğinizde, görüntünün adını, boyutunu ve içerdiği dosyanın yanı sıra grafik görüntünün formatını belirten bir ipucu görünür (Şekil 15.9).
  1. Seçilen görselin sağ tarafındaki ok düğmesine tıklayın. Bir bağlam menüsü görüntülenir.
  2. Bağlam menüsünden komutu seçin Kopyala(Sora).
  3. Bir Web sayfasına gidin ve herhangi bir kullanışlı aracı kullanarak panodaki bir görüntüyü bu sayfaya yapıştırın. Örneğin tuş kombinasyonuna basın +.
  4. Düğmeye tıklayarak grafik görüntüsünü içeren Web sayfasını kaydedin Kaydetmek(Kaydet) seçeneğini standart araç çubuğunda seçin. Bir iletişim kutusu belirir Gömülü dosyaları kaydetme(Gömülü Dosyaları Kaydet) (Şek. 15.10), sayfaya yerleştirilen görüntüyü bir klasöre kaydetmeyi önerir görseller Dosyanın kütüphanede bulunduğu adın altındaki web sitesi. Bu pencere aşağıdaki düğmeleri içerir:
    • Yeniden isimlendirmek(Yeniden Adlandır) - dosyayı yeniden adlandırmanıza olanak tanır.
    • Klasörü değiştir(Klasörü Değiştir) - bir iletişim kutusu açar Klasörü değiştir(Klasör Değiştir), geçerli Web sitesinin klasörlerini içerir ve dosyayı kaydetmek için farklı bir klasör seçmenize olanak tanır.
    • Aksiyon(Eylemi Ayarla) bir iletişim kutusu açar Eylem görevi, değeri değiştirmenizi sağlar Kaydetmek Eylem sütununu şuraya kaydedin: Kaydetme(Kaydetme) Bir değer seçerken. KaydetmekÇizim belirttiğiniz Web sitesi klasörüne kaydedilir, aksi takdirde Web sayfası Küçük Resim kitaplığında bulunan görüntüye bir bağlantı içerecektir.

Bölge Çizim(Resim önizlemesi) yerleştirilen görüntüyü gösterir. İletişim kutusunda ayarlayarak Gömülü dosyaları kaydetmeİstenilen parametreler, düğmeye basın TAMAM. Grafik dosyası belirttiğiniz Web sitesi klasörüne kaydedilecektir.

Pirinç. 15.10.

Bir dosyadan grafik görüntü yerleştirme

Clip Ait kütüphanesinden bir grafik görüntüsünü bir Web sayfasına yerleştirmeyi inceledik. Bir dosyadaki grafik görüntüsünü sayfaya yerleştirmek için aşağıdakilerden birini yapın:

  • Menüde Sokmak(Ekle) seçme komutu Çizim(Resim) ve ardından açılan alt menüde - seçenek Dosyadan(Dosyadan)
  • Düğmeye tıklayın Dosyadan resim ekleme(Dosyadan Resim Ekle) standart araç çubuğunda
  • Düğmeye tıklayın Dosyadan resim ekleme(Dosyadan Resim Ekle) araç çubuğunda Çizimler(Resimler)

Bu eylemlerden herhangi birini gerçekleştirdiğinizde bir iletişim kutusu açılır Çizim(Resim) (Şekil 15.11). Bu pencereyi kullanarak gerekli grafik dosyasını bulun ve Web sayfasına yerleştirmek için düğmeye tıklayın. Sokmak(Sokmak). İletişim kutusu kapanacak ve resim sayfaya yerleştirilecektir.

Pirinç. 15.11.

Görüntü özelliklerini ayarlama

Bir görüntüyü Web sayfasına yerleştirdikten sonra iletişim kutusunu kullanarak özelliklerini yapılandırmanız gerekir. Resim özellikleri(Resim Özellikleri) (Şekil 15.12). Açmak için resme tıklayın ve ardından aşağıdakilerden birini yapın:

  • Menüde Biçim(Biçim) seçme komutu Özellikler(Özellikler)
  • Bir takım seçin içerik menüsü Resim özellikleri(Resim Özellikleri)
  • Tuş kombinasyonuna basın +

İletişim kutusu Resim özellikleriüç sekme içerir: Genel(Genel), Video kaydı(Video) Görüş(Dış görünüş). Bu görüntüleme penceresini kullanarak özelleştirme seçeneklerine daha yakından bakalım.