Css içerik karakter kodları. Html'de boşluk karakterleri ve bunların kod biçimlendirmesi, ayrıca bölünemez boşluk özel karakterleri ve diğer anımsatıcılar

Merhaba, blog sitesinin sevgili okuyucuları. Biraz önce, içindeki tasarımı da nasıl öğrendiğimizden bahsetmeyi başardık. Bugün, HTML'de bir boşluk kavramına ve ayrıca yazarken onunla ilişkili kodun biçimlendirmesine sahibiz (sonraki okuma ve algılama kolaylığı için).

Pekala, bölünemez boşluk ve yumuşak heceleme konusuna değineceğimiz için, dikkatimizi Html dilinde kullanılan sözde özel karakterlere veya anımsatıcılara odaklamamız gerekecek, bu da eklemenize izin verecek yukarıda belirtilenler gibi web belgesi koduna birçok ek karakter. Ama önce ilk şeyler.

Html Dilinde Boşluklar ve Boşluk Karakterleri

Bunun için özel olarak tasarlanmış etiketler (paragraf, başlıklar vb.) yardımıyla metin biçimlendirme konusuna geçmeden önce, HTML dilinde boşlukların, satır sonlarının (Enter) ve tablolamanın nasıl yorumlandığı an üzerinde durmak istiyorum. , yeniden boyutlandırıldığında tarayıcı penceresindeki metnin dökümünün nasıl gerçekleştirildiği.

Doğru, bu tür görsel biçimlendirme için (web sayfasında görünmeyecek), çoğu zaman boşlukları değil, tablo ve satır sonu karakterlerini kullanırlar. Böyle bir kural var - iç içe bir Html etiketi yazmaya başladığınızda, o zaman sekme ile girinti(klavyede Tab tuşu) ve bu etiketi kapattığınızda girintiyi kaldırın (Klavyede Shift + Tab tuş kombinasyonu).

Bunu, açılış ve kapanış etiketleri aynı dikey seviyede olacak şekilde yapmanız gerekir (Html ​​düzenleyicinizin sayfasının sağ kenarından aynı sayıda sekme, örneğin benim yazdığım Notepad ++ hakkında). Ek olarak, açılış elemanını yazdıktan hemen sonra birkaç satır sonu yapmanızı ve daha sonra yapmayı unutmamak için kapatma elemanını hemen aynı seviyede (sekme sayısı) yazmanızı tavsiye ederim.

Onlar. açılış ve kapanış elemanları dikey olarak aynı seviyede olmalı ve iç etiketleri bir sekme karakteri kaydırıp kapanış ve açılış elemanlarını tekrar aynı seviyeye yerleştiriyoruz.

Basit web belgeleri için bu aşırıya kaçmış gibi görünebilir, ancak az ya da çok karmaşık belgeler oluştururken, kod çok daha net olacak ve boşlukların bolluğu nedeniyle okunabilir ve ayrıca etiketlerin simetrik düzeni nedeniyle içindeki hataları fark etmek çok daha kolay olacaktır.

Html kodunda özel karakterler veya anımsatıcılar

Şimdi, bu makalenin başında kullanılabilirliğini duyurduğum sözde özel karakterlerden bahsedelim. Özel karakterlere bazen anımsatıcılar veya ikameler de denir. Hipermetin biçimlendirme dilinde uzun süredir ortaya çıkan, kullanılan kodlamalarla ilgili bir sorunu çözmeye yöneliktirler.

Klavyeden yazı yazdığınızda, dilinizin karakterleri önceden belirlenmiş bir algoritmaya göre kodlanır ve daha sonra kod çözme nedeniyle kullandığınız yazı tipleriyle (site için nereden bulunur ve site için nasıl kurulur) kullanılarak sitede görüntülenir.

Pek çok kodlama vardır, ancak Html dili için varsayılan olarak genişletilmiş bir kodlama sürümü benimsenmiştir.

Bu metin kodlamasında, yalnızca 256 karakter yazmak mümkündü - 128'i ASCII'den ve 128'i de Rus dilinin harfleri için. Sonuç olarak, ASCII'ye dahil olmayan ve Windows 1251 (CP1251) kodlamasının parçası olan Rusça karakterler olmayan karakterlerin sitelerde kullanılmasıyla ilgili bir sorun oluştu. Eh, yaklaşık işareti veya kesme işareti kullanmayı kafanıza koydunuz, ancak Html dilinin kullandığı kodlamanın başlangıçta bu tür yetenekleri yok.

Bu tür durumlar için ikameler veya başka bir deyişle anımsatıcılar icat edildi. İlk olarak özel karakterler sayısaldı, ancak daha sonra en yaygın olanları için, hatırlama kolaylığı için alfabetik karşılıkları eklendi.

Genel olarak konuşursak, bir anımsatıcı "&" işaretiyle başlayan ve noktalı virgül ";" ile biten bir karakterdir. Tarayıcının Html kodunu ayrıştırırken ondan özel karakterler çıkarması bu gerekçelerledir. Sayısal değiştirme kodundaki ve işaretinin hemen ardından, bazen karma olarak adlandırılan "#" diyez işareti gelmelidir. Ve ancak o zaman Unicode kodlamada istenen karakterin sayısal kodunu takip eder.

Unicode'da 60.000'den fazla karakter yazılabilir - asıl önemli olan, ihtiyacınız olan anımsatıcı sembolün sitenizde kullanılan yazı tipi tarafından desteklenmesidir. Hemen hemen tüm Unicode karakterlerini destekleyen yazı tipleri vardır ve yalnızca belirli bir karakter kümesine sahip seçenekler vardır.

Özel karakterlerin tam listesi çok büyük olacak, ancak en sık kullanılan anımsatıcılarörneğin şu tablodan ödünç alabilirsiniz:

oldukça ilginç bir durum var anımsatıcıların Html kodunu almanın yoluİhtiyacınız olan karakter için. Bunun için Microsoft Word editörünü açıp yeni bir belge oluşturup üst menüden "Ekle" - "Sembol" seçeneğini seçmeniz yeterli olacaktır (2003 sürümünü kullanıyorum bu yüzden benzerini nasıl yapacağımı bilmiyorum) sonraki sürümlerde işlem).

Açılan pencerede, bir yazı tipi seçmeniz gerekir, örneğin, Times New Roman (veya site ziyaretçilerinizin çoğu bilgisayarında kesinlikle bulunacak herhangi bir yazı tipi - örneğin Courier veya Arial).

Word belgenize açılan listeden ihtiyacınız olan tüm özel karakterleri ekleyin ve bu Word belgesini (kaydederken ".html" açılır listesinden seçilen) bir web sayfası olarak kaydedin. Pekala, o zaman bu web sayfasını herhangi bir Html düzenleyicide açmanız yeterlidir (aynı Notepad ++ iyidir) ve ihtiyacınız olan anımsatıcıların tüm dijital kodlarını göreceksiniz:

Yöntem biraz karmaşık, ancak sitenizin sayfasında bazı nadir özel semboller kullanmak istiyorsanız, o zaman yukarıdaki gibi İnternette tablolar aramaktan daha kolay olacaktır. Ortaya çıkan özel karakter kodunu doğru yere girmeniz gerekecek ve bunun yerine web sayfasında tarayıcı ihtiyacınız olan karakteri (örneğin, bölünmez bir boşluk) gösterecektir.

Örneklerde bölünemez boşluk ve yumuşak tireleme

Yukarıda bahsettiğim ve hemen yukarıda verilen özel karakterler tablosundan da görebileceğiniz gibi, Html'deki bazı anımsatıcılar, dijitale ek olarak, daha kolay ezberlenmeleri için sembolik bir atama aldı. Onlar. karakter varyantlarında pound işareti "#" (karma) yerine kelimeler kullanılır. Örneğin, aynı bölünmez boşluk (dijital anımsatıcı) veya (karakter) olarak yazılabilir.

Makale yazarken, bir ve işareti (&) veya bir açık açılı ayraç (<), то для этого обязательно нужно использовать спецсимволы. Дело в том, что эти знаки в Html означают начало тега и браузер будет рассматривать их именно с этой точки зрения и отображать в тексте не будет.

Yani, metne örneğin görüntüleme etiketi eklemeniz gereken bir makale yazıyorsanız< body>veya küçüktür işareti eklemeniz yeterlidir (<), то сделав это без использования подстановок на веб странице вы ничего не увидите, т.к. браузер, обнаружив «<» , поймет, что это Html тег, а не текст статьи.

Bu nedenle, böyle bir sorunu çözmek için aşağıdaki yapıyı eklemeniz gerekecektir:

Aynı şey anımsatıcıların kodunun görüntülenmesi için de geçerlidir, çünkü bunlar bir ve işaretiyle başlar. Metne ve işaretinin yerine ikamesiyle (özel karakter) bir kod eklemeniz gerekecek:

Bu sayfaya girmek için yapılması gerekecek<, а не отображение левой угловой скобки (<), в которую преобразует браузер мнемонику <, обнаружив при разборе знак амперсанда. Хитро, но вы все поймете попробовав это на практике.

Ayrıca, büyük olasılıkla, bir web sayfasında normal bir boşluk gibi görünecek, bölünemez bir boşluk kullanacaksınız, ancak tarayıcı bunu bir boşluk karakteri olarak ele almayacak ve onun üzerinden transfer olmaz(Örneğin 1400 GB vb. gibi farklı satırlara kısa çizgi eklenmesi istenmeyecek ifadeler için bu uygun olacaktır):

1400 GB.

Bazen metinde çok uzun kelimeler olduğunda ve gerekirse tarayıcının olduğundan emin olmak istediğinizde tam tersi bir durum ortaya çıkabilir. bir transferle bu sözleri kırabilir. Bu amaçlar için özel bir "yumuşak transfer" sembolü sağlanmıştır -

Uzun, uzun kelime;

Başka bir satıra geçmek gerektiğinde, tarayıcı soft wrap mnemonic yerine bir tire koyar ve kelimenin geri kalanını bir sonraki satıra gönderir. Tüm bu kelimeyi tek bir satıra sığdırmak için yeterli alan varsa, tarayıcı herhangi bir yeni satır çizmeyecektir. İşte bu kadar basit.

Sana iyi şanslar! Yakında blog sayfaları sitesinde görüşmek üzere

giderek daha fazla video izleyebilirsiniz

ilginizi çekebilir

MailTo - nedir ve Html'de bir e-posta bağlantısı nasıl oluşturulur
Html 4.01 standardına göre H1-H6 başlıkları, yatay satır Hr, satır sonu Br ve P paragrafı etiketleri ve nitelikleri
HTML'ye bir bağlantı ve bir resim (fotoğraf) nasıl eklenir - IMG ve A etiketleri

Merhaba, blog sitesinin sevgili okuyucuları! En azından yüzeysel olarak tanışmayı başaranlar, muhtemelen genel anlamda da olsa çoktan not almışlardır. Bu, genellikle belge kodunda hangi HTML karakterlerinin kullanıldığına dair bir fikir sahibi oldukları anlamına gelir.

Bugünün makalesinde, HTML'de boşluğun ne olduğunu anlamaya çalışacağız, hangi durumlarda kolay algı için kodu biçimlendirirken boşluk karakterlerini kullanabilirsiniz. Bölünemez bir boşluk kullanmanın ne zaman gerekli olduğunu öğreneceğiz ve ayrıca diğer özel karakterlerle (veya aynı zamanda anımsatıcılar olarak da adlandırılır) tanışacağız.

Aslında, çeşitli özel karakterlerin kullanılması konusunu göz ardı etmemenizi tavsiye ederim, çünkü bu, köprü metni biçimlendirme dili çalışmasını tamamlamak için önemli bir bileşendir. Genel olarak, bu yayında verilen bilgiler kesinlikle gereksiz olmayacaktır. Peki, şimdi konuya.

HTML'de Boşluklar ve Boşluk Karakterleri

Öncelikle önemli bir açıklama yapmak gerekiyor. Bilgisayar klavyesinde metin ayrımını uygulamanıza izin veren özel tuşlar vardır (bununla ilgili daha fazlası aşağıda). Ancak, yalnızca geniş boşluk çubuğu, yalnızca düzenleyicide değil, tarayıcı penceresinde de sözcükler arasında bir ayrım sağlar. Çizgileri sararken ve kenardan girinti yaparken nüanslar vardır.

Bildiğiniz gibi, bir web tarayıcısında belirli öğelerin görüntülenmesi etiketler tarafından belirlenir. Metin biçimlendirme için, blok tabanlı olan iyi bilinen bir format kullanılır. Yani, içeriği mevcut tüm genişlikte bulunur.

İle P paragrafının içindeki satırları kaydır, bunun yapılabileceği tek bir BR etiketi kullanmanız gerekir. Bir metin düzenleyicide yazdığımız bir şiirden bazı satırları metne eklememiz gerektiğini varsayalım:

Ayetin satırlarının doğru yerleştirilmesine ve tirelerin doğru yerlere yapılmasına rağmen tarayıcıda her şey farklı görünecek:

Bir web tarayıcı penceresinde aynı görüntüyü elde etmek için, her satır sonuna BR yazmanız gerekir:

Şimdi görevi başardık ve tarayıcıda şiirsel satırlar oldukça doğru bir şekilde görüntülenecek:

Böylece gerekli satır sonları tamamlanmış olur. Burada ayrıca öyle bir özelliği de not etmek gerekir ki, birbiri ardına gelen birden çok boşluk web tarayıcısı tarafından tek olarak görüntülenir. Bunu, aynı düzenleyicide iki kelime arasına bir değil birkaç boşluk koymaya çalışırsanız ve "Kaydet" düğmesine tıklayarak tarayıcıdaki sonuca bakarsanız doğrulayabilirsiniz.

Boşluk, sekme ve satır sonu

Temel olarak, bunlarla boşluk karakterleri editörde metinle çalışmaya başlar başlamaz birbirimizi tanır ve doğru şekilde biçimlendiririz. Böyle bir görevi gerçekleştirmek için, her biri kendi boşluk karakterine karşılık gelen özel tuşlar vardır:

• Boşluk - bir bilgisayar klavyesindeki en geniş tuş (yazısız);
• Tablolama - solda "Sekme" yazan bir anahtar ve farklı yönleri gösteren iki ok;
• Satır sonu - "Enter" tuşu.

Ancak yukarıda da söylediğim gibi sadece bir metin editöründe değil, bir tarayıcıda da sadece ilk tuşu kullanırken istediğimiz nihai sonucu alıyoruz. Üç tuşun tümü (sekme ve satır sonu dahil) HTML kodunu biçimlendirirken kullanışlıdır.Diyelim ki, tüm boşluk karakterleri görüntülendiğinde bir kod parçası NotePad ++ 'da (bu düzenleyici hakkında açıklayıcı malzeme) şöyle görünüyor:

Boşluklar sayesinde okunması ve anlaşılması kolay bir kod elde ederiz. Turuncu oklar Tab tuşuyla oluşturulan girintileri, CR ve LF karakterleri ise Enter tuşuyla yapılan satır sonlarını işaretler.

İç içe kaplar görüntülendiğinde, açılış ve kapanış etiketleri iyi bir şekilde öne çıkıyor. Bu formda, bu kod kolayca düzenlenebilir. Şimdi, böyle bir metin ayrımı olmayan aynı kodla karşılaştırın:

Aynı şekilde, boşluk karakterlerini kullanarak, görsel olarak anlaşılır ve sindirilebilir görünecek CSS kuralları yazabilirsiniz:

Tüm stilleri ortak bir paydaya getirdikten ve stil dosyasını düzenlemeyi tamamen bitirdikten sonra, koddaki tüm boşlukları kaldırarak onu konu alabilirsiniz. Bu, bir kaynağı tanıtırken çok önemli olan artırmak için gereklidir.

HTML kodundaki özel karakterler (veya anımsatıcılar)

Şimdi yazının başında bahsettiğim özel karakterlerin kullanılması gereken durumlara bakalım. Bazen anımsatıcı olarak adlandırılan HTML özel karakterleri, köprü metni biçimlendirme dilinde uzun süredir devam eden bir kodlama sorununu çözmek için tanıtıldı.

Klavyede metin yazdığınızda, kullandığınız dilin karakterleri kodlanır. Bir web tarayıcısında, yazılan metin, ters kod çözme işleminin bir sonucu olarak seçtiğiniz yazı tiplerinde işlenecektir.

Gerçek şu ki, bu tür birçok kodlama var, şimdi bunları ayrıntılı olarak analiz etme hedefimiz yok. Sadece her biri, gösterilmesi gereken belirli karakterlerden yoksun olabilir. Diyelim ki tek tırnak veya aksan işareti yazmak istiyorsunuz ve bu simgeler sette bayat eksik.

Bu sorunu ortadan kaldırmak için, çok sayıda çeşitli anımsatıcı içeren bir özel karakter sistemi getirildi. Hepsi bir "&" işaretiyle başlar ve genellikle noktalı virgül ";" ile biter. İlk başta, her özel karakterin kendi dijital kodu vardı. Örneğin, aşağıda daha ayrıntılı olarak ele alacağımız bir bölünemez boşluk için aşağıdaki giriş doğru olacaktır:

Ancak bir süre sonra, en yaygın sembollere, hatırlamalarını kolaylaştırmak için gerçek karşılıkları (anımsatıcılar) atandı. Diyelim ki aynı kırılmaz alan için şöyle görünüyor:

Sonuç olarak, tarayıcı ilgili sembolü görüntüler. Anımsatıcıların listesi çok hacimlidir, HTML'de en sık kullanılan özel karakterler aşağıdaki tablodan bulabilirsiniz:

Bölünemez boşluk ve yumuşak tire dahil olmak üzere bazı özel karakterlerin kullanıldığı durumlar

Tabloyu biraz incelediyseniz, yukarıda söylediğim kelimelerin onayını aldınız, tüm özel karakterleri görüntülemek için, harflerin () yazıldığı bir sayısal kod () veya onun alfabetik analoğu (karakter anımsatıcı) kullanılır. kafes ve sayıların bir kombinasyonu yerine.

Şimdi bu kodları ne zaman uygulamak gerektiğine bakalım. Diyelim ki bir makalede bilgi amaçlı bazı HTML etiketleri belirtmeniz gerekiyor, örneğin,