Yeni başlayanlar için HTML'nin temelleri. Yeni başlayanlar için HTML ve CSS'nin temelleri. Ücretsiz dil öğrenmek için nasıl

Temel HTML Bunlar, HTML dilinin temel kuralları, HTML sayfasının yapısının açıklaması, HTML öğeleri arasındaki HTML belgesinin yapısındaki ilişkisi.

HTML belgesi sıradan bir metin belgesidir, olağan metin düzenleyicide olduğu gibi oluşturulabilir. (Not defteri)ve uzmanlaşmış, aydınlatma kodu ile (Not Defteri ++, Visual Studio Code, vb.). HTML belgesi bir uzantıya sahiptir. HTML.

HTML belgesi, bir HTML öğesi ve metin ağacından oluşur. Her bir eleman ilk belge başlangıç \u200b\u200b(açılış) ve final (kapanış) etiketinde (nadir bir istisna) gösterilir.

Etiket başlatmak Elemanın nerede başladığını, nihai - bittiği yerde gösterir. Kapanış etiketi Etiketin adından önce bir çizgi eklenerek oluşturulur:<имя тега> … . İlk ve kapanış etiketleri arasında etiketin içeriği var.

Tek etiketler içeriği doğrudan saklayamaz, bir öznitelik değeri olarak reçete edilir, örneğin etiket Metinli bir düğme oluşturun Buton İçeride.

Etiketler birbirlerine yatırım yapabilir, örneğin,

Metin

. Yatırım yaparken, kapanışlarının sırası takip edilmelidir. ("Matryshka" prensibi)Örneğin, bir sonraki giriş yanlış olacaktır:

Metin

HTML öğelerinin özellikleri olabilir (tüm HTML elemanları ve kendi başına geçerli). Nitelikler, keşif öğesi etiketinde yazılır ve öznitelik adı \u003d "değer" formatında belirtilen adı ve değeri içerir. Öznitelikler, belirtilen öğenin özelliklerini ve davranışlarını değiştirmenizi sağlar.

Her bir elemanın birkaç sınıf değeri ve yalnızca bir kimlik değeri atanabilir. Çoklu sınıf değerleri boşlukla kaydedilir,

. Sınıf ve ID değerleri yalnızca harf, sayılar, tire ve alt alt çizgilerden oluşmalıdır ve yalnızca harflerle veya rakamlarla başlamalıdır.

Tarayıcı tarayıcılığı (yorumlar), bir HTML belgesini, yapısını (DOM) oluşturun ve bu dosyada (stiller, komut dosyaları) dahil olan talimatlara uygun olarak görüntülenir. İşaretleme doğruysa, HTML öğeleri içeren HTML sayfası tarayıcı penceresinde görüntülenir - başlıklar, tablolar, görüntüler vb.

Yorumlama süreci (Ayrıştırma) Web sayfası tamamen tarayıcıya yüklenmeden önce başlar. Tarayıcılar, HTML belgelerini sırayla, CSS'yi işleme koyarken ve tarzdaki sayfaları sayfa öğeleri ile ilişkilendirilir.

HTML belgesi iki bölümden oluşur - başlık - Etiketler arasında … ve anlamlı kısmı - Etiketler arasında …

.

Web Sayfası Yapısı

1. HTML Belge Yapısı

HTML Dili, belge reklam türü reklam dosyasında bulunan kuralları izler. (Belge Tipi Tanımı veya DTD). DTD, belirli bir HTML tipi için hangi etiketlerin, niteliklerin ve değerlerinin hangi etiketlerin geçerli olduğunu belirleyen bir XML belgesidir. HTML'nin her bir sürümü kendi DTD'si var.

DOCTYPE. Web sayfası tarayıcısının doğru ekranından sorumlu. DocType, yalnızca HTML sürümünü (örneğin, HTML) değil, aynı zamanda internetteki ilgili DTD dosyasını tanımlar.

...

Etiketin içinde bulunan unsurlar , sözde bir belge ağacı oluşturmak İşletim Belgesi Model, DOM (Belge Nesne Modeli). Aynı zamanda elementte Kök elemanıdır.

İncir. 1. En basit web sayfası yapısı

Web sayfası unsurlarının etkileşimini anlamak için, sözde sözde düşünmek gerekir. "İlgili ilişki" Elementler arasında. Birden fazla iç içe eleman arasındaki ilişki ebeveyn, bağlı ortaklıklara ve hemşireye bölünmüştür.

Ata - Diğer elemanlara giren bir unsur. Şekil 1, tüm elemanlar için ata . Aynı zamanda elementte İçinde bulunan tüm etiketlerin atasıdır:

,
, ,
vb.

Azalan - Bir veya daha fazla madde türünde bulunan bir öğe. Örneğin, Bu bir soyundan ve eleman
Aynı anda bir soyundan ve .

Ebeveyn elemanı - Alt seviyenin diğer unsurlarıyla ve üstlerindeki ağaçların diğer unsurlarıyla ilişkili unsur. Şekil 1. ve . Etiket
Sadece ebeveyn .

Kız elemanı - Eleman doğrudan daha yüksek bir seviyenin başka bir elementine yerleştirin. Şekil 1 Sadece öğeler
,
,
VE
bağlı ortaklıklar .

Hemşirelik elemanı - Bir seviyenin sözde öğeleri ile ortak bir ebeveyn öğesine sahip bir eleman. Şekil 1. ve - Bir seviyenin elemanlarının yanı sıra unsurlar
,
ve
Kendileri arasında hemşirelik var.

1.1. Eleman

1.2. Eleman

Bölüm ... Sayfa hakkında teknik bilgileri içerir: başlık, açıklama, arama motorları, kodlama, vb. Anahtar kelimeler. Buna girilen bilgiler tarayıcı penceresinde görüntülenmez, ancak tarayıcının sayfanın nasıl işleneceğini gösterdiği verileri içerir.

1.2.1. Eleman </h4> <p>Zorunlu Etiket Bölümü <head> etiket <title> . Bu etiketin içinde bulunan metin, Web tarayıcı başlık çubuğunda görüntülenir. Başlık uzunluğu, başlığa tam olarak uyması için en fazla 60 karakter olmamalıdır. Başlık metni, web sayfasının içeriğinin en eksiksiz tanımını içermelidir.</p> <h4>1.2.2. Eleman <meta></h4> <p>İsteğe bağlı kesit etiketi <head> aynı etiket <meta> . Bununla birlikte, sayfanın içeriğinin bir açıklamasını ve arama motorları için anahtar kelimelerin, HTML belgesinin yazarı ve meta verilerin diğer özelliklerini belirleyebilirsiniz. Eleman <head> birkaç element içerebilir <meta> Çünkü kullanılan niteliklere bağlı olarak, çeşitli bilgiler taşırlar.</p><p> <meta name="description" content="Sayfa İçerik Açıklaması"> <meta name="keywords" content="Virgül aracılığıyla anahtar kelimeler"> </p><p>Sayfanın ve anahtar kelimelerin içeriği açıklaması, örneğin Rusça ve İngilizce olarak, çeşitli dillerde aynı anda belirtilebilir:</p><p> <meta name="description" lang="ru" content="Sayfa İçerik Açıklaması"> <meta name="description" lang="en" content="Açıklama."> <meta name="keywords" lang="ru" content="Virgül aracılığıyla anahtar kelimeler"> <meta name="keywords" lang="en" content="Anahtar kelimeler."> </p><p>Etiketi kullanma <meta> Web sayfasının indekslenmesini arama motorlarına göre yasaklayabilir veya izin verebilirsiniz:</p> <p> <meta name="robots" content="index, follow"> </p><p> <meta name="robots" content="index, nofollow"> </p><p> <meta name="robots" content="noindex, nofollow"> </p><p>Sayfayı otomatik olarak yeniden başlatmak için belirli bir sürede yenileme değerini kullanmanız gerekir:</p><p> <meta content="30"> </p><p>Sayfa 30 saniye sonra yeniden başlatılacak. Ziyaretçiyi başka bir sayfaya aktarmak için URL parametresinde URL'yi belirtmeniz gerekir:</p><p> <meta content="0; url=http://yandex.ru/"> </p><table class="t3"> Tablo 2. Etiket nitelikleri <meta> <tbody><tr><th style="width: 20%;">Öznitelik</th> <th></th> </tr><tr><td> Charset.</td> <td>Geçerli HTML belgesi için karakterlerin kodlamasını belirtir: <meta charset="UTF-8"> </td> </tr><tr><td> İçerik</td> <td>Değerlerine bağlı olarak HTTP-EQUIV veya Ad özniteliğine bağlı değeri belirleyen rastgele metin içerir.</td> </tr><tr><td> Http-equiv.</td> <td>Bu Web sayfasındaki tarayıcının eylemlerini kontrol eder (HTTP başlıklarının eşdeğeri). Sayfayı görüntülerken, tarayıcı öznitelikte belirtilen talimatları izleyecektir: <br> Varsayılan tarz, sayfada kullanılacak tercih edilen stili belirtir. İçerik niteliği bir öğe tanımlayıcısı içermelidir <link> CSS stilleri tablosunu veya bir öğe tanımlayıcısını belirten<style> , содержащего таблицу стилей.<br> refresh указывает время в секундах до перезагрузки страницы или время до перенаправления на другую страницу, если в атрибуте content после указания времени идет строка "url=адрес_страницы" .<br> Автоматическая перезагрузка страницы через заданный промежуток времени, в данном примере, через 30 секунд:<br> <meta content="30"> <br> Если необходимо сразу перебросить посетителя на другую страницу, то можно указать URL-адрес в параметре url:<br> <meta content="0; url=http://mail.ru/"> </td> </tr><tr><td> name </td> <td>Ассоциируется со значением, содержащемся в атрибуте content . Не должен использоваться в случае, если для элемента уже заданы атрибуты http-equiv , charset или itemprop .<br> application-name указывает название веб-приложения, используемого на странице.<br> author указывает имя автора документа в свободном формате.<br> description определяет краткое описание к содержимому страницы, например:<br> <meta name="description" content="Описание содержимого страницы"> <br> generator указывает один из пакетов программного обеспечения, используемого для создания документа, например:<br> <meta name="generator" content="WordPress 4.0"> .<br> keywords содержит список ключевых слов, разделенных запятыми, соответствующих содержимому страницы, например:<br> <meta name="keywords" content="Ключевые слова через запятую"> .<br><i>Также атрибут name может принимать следующие значения из расширенной спецификации, такие как creator , googlebot , publisher , robots , slurp , viewport , хотя ни одно из них еще не было официально принято. </i> </td> </tr></tbody></table><h4>1.2.3. Элемент <style></h4> <p>Внутри этого элемента задаются стили, которые используются на странице. Для задания стилей в HTML-документе используется язык CSS. Таких элементов на странице может быть несколько.</p> <p>Внутрь этого элемента можно записывать код форматирования как самих элементов веб-страницы, так и веб-страницы целиком.</p><p> <style type="text/css"> .paper { width: 200px; height: 300px; background-color: #ef4444; color: #666666; } </p><p>Чтобы подключить к элементу заданный стиль, необходимо через атрибут class (или id) присвоить элементу соответствующее название:</p><p> <div class="paper"> ... </div> </p><p>CSS-код можно встраивать непосредственно в элемент разметки в виде значение атрибута style , например:</p><p> <h4>1.2.4. Элемент <link></h4> <p>Задать стили для документа можно также при помощи другого способа - записать их в отдельный файл с расширением.css , например, style.css .</p> <p>Подключить файл со стилями к веб-странице можно двумя способами:<br>через директиву @import url</p><p> <!DOCTYPE html> <html> <head> <style> @import url(style.css); </style> <meta> <title>
Öğeyi kullanma . Öğe bir kapanış etiketi gerektirmez. Bu eleman, geçerli sayfa ve diğer belgeler arasındaki ilişkiyi belirler. Sayfada çeşitli öğeler olabilir. Kayıt aşağıdaki forma sahip olacaktır:

Tablo 4. Etiket nitelikleri

Öznitelik Açıklama
Crossorigin. Sitedeki bir görüntü çıkarırken, CORS'lerin kullanılmasının (diğer etki alanı kaynaklarına bir web sayfası erişimi sağlamanızı sağlayan tarayıcı teknolojisi) belirtir.
Anonim - Etki Alanı Sorgusunda, tarayıcı, bir talebin yapıldığı etki alanı adını içeren orijin başlığını otomatik olarak ekler. Sunucu, Access-Control-Consum-meneni: * (Yıldızlar yerine Etki Alanı adı) cevap vermezse, görüntü yükü engellenir.
Kullanım-Kimlik Bilgileri - Sunucu, Access-Control-Allow-kimlik bilgilerini kullanarak kimlik bilgileri sağlamazsa: TRUE, ardından görüntü yükü engellenir.
HREF. Etiketin bir değer olarak ana niteliği, dosyanın stilleri ile yoludur.
HREFLANG. Bağlantının olduğu belgedeki metnin dilini belirtir.
Medya Referans kaynağının uygulanacağı cihazın türünü tanımlar.
Nonce Randing değişken, sunucuda rastgele oluşturulan, içeriği korumak için gömülü stilleri kullanma kurallarını belirleyen rastgele. Öznitelik değeri - Metin dizesi.
Rel. Öznitelik, mevcut belge arasındaki ilişkiyi ve referansların olduğu belge arasındaki ilişkiyi belirler.
Alternate - Aynı belgeye bağlantı, ancak başka bir biçimde (örneğin, yazdırma sayfaları, çeviri, ayna, RSS veya atom formatındaki şerit),
.

Arşivler - Bağlantıdaki belgenin tarihsel ilgiyi temsil ettiğini gösterir. Bağlantı, kayıt, belge ve diğer malzemeler koleksiyonunu gösterebilir.
Yazarın, belgenin yazarı veya sayfanın yazarın yazarı hakkında yazarın bağlantısı.
Atalar yoksa, bir link olan, bir bağlantı olan, bir bağlantı olan, bir bağlantı olan veya makale bölümünde yer imi referansı.
Dış, bağlantının bu sitenin bir parçası olmadığı sayfanın olduğunu belirtmek için kullanılır.
İlk önce, ilk belgeye giden bağlantıyı belge dizisinden belirtir.
Sertifika ile bir belgeye atıfta bulunma.
Simge, geçerli belge için kullanılacak olan simgenin yolunu tanımlar.
Son belgenin sırasındaki son belgeye giden bağlantıyı belirtir.
Belge için telif hakkı bilgilerine lisans başvurusu.
Daha sonra, bu belgenin serinin bir parçası olduğunu ve bağlantının bu serideki aşağıdaki belgeye yol açtığını gösterir.

Nofollow, bağlantının sayfanın yazarı tarafından onaylanmadığını veya bağlantının ticari olduğunu gösterir.
NorefErrer, istek kaynağının URL'sini içeren istemci istek başlığının bağlantı sırasında iletilmemesi gerektiğini belirtir.
Pingback, blogun buna bağlı siteleri otomatik olarak bildirmesini sağlayan PingBack Sunucu adresini belirtir.
Prefetch, dosyanın bağlantı yol açtığı önceden tutulması gerektiğini belirtir.
Önceki, bu belgenin seri bir parçası olduğunu ve bağlantının bu serideki önceki belgeye yol açtığını gösterir.

Arama, referans belgesinin arama arayüzünü ve ilgili kaynakları içerdiğini gösterir.
Sidebar, eğer mümkünse, eğer mümkünse, tarayıcının ek bağlamında ve bazı tarayıcıların ekrana tıkladığınızda bazı tarayıcıların, yer imleri paneline bir bağlantı eklemek için pencereyi açın.
Bu belge için stil sayfası olarak kullanılacak harici bir dosyaya stil sayfası bağlantısı.
Etiket, köprünün bu belgeye yol açtığı etiketin olduğunu gösterir.
Yukarı, sayfanın hiyerarşik yapının bir parçası olduğunu ve köprünün yapıda daha yüksek bir kaynak seviyesine yol açtığını gösterir.
Boyutları. Görsel ekran için simgelerin boyutunu belirtir. Boyutlar özniteliği sadece rel \u003d "simge" ile kullanılır ve aşağıdaki anlamları alabilir:
Genişlikler yüksekliktedir - boşluklarla ayrılan boyutların bir listesini tanımlar, her bir boyut biçiminde olmalıdır - yüksekliğin genişlikleri (simgelerin boyutları piksellerde ayarlanır), örneğin:
;
Herhangi bir - simge herhangi bir boyuta kadar ölçeklendirebilir.
Başlık Bağlantının başlığını veya alternatif stil tablolarının adının adını belirtir. Öznitelik Değeri - Metin.
Tip Bağlantının olduğu MIME türünü belirtir. Bu durumda, "Metin / CSS" değerini alır.
1.2.5. Eleman

Обратите внимание на иерархию элементов в структуре документа. Корневым элементом считается , а все последующие элементы идут внутри него, а в самом конце документа обозначает его закрытие. Все элементы, которые написаны до или после тега , не будут обрабатываться браузером.

Элемент является родительским для элементов и , а они соответственно дочерними, так как находятся внутри тега … . Такая иерархия будет распространяться на все вложенные элементы документа.

Элемент

В теге … содержится техническая информация о web-странице: кодировка, заголовок, описание, ключевые слова, подключение таблицы стилей, шрифтов и т.д. То, что находится в этом разделе, не выводится в окне браузера, но эти данные указывают браузеру, как именно показать страницу.

Обязательным тегом, входящим в … , является … . Это заголовок всего документа, он отображается на открытой вкладке браузера и в результатах выдачи поисковых систем, в так называемом, сниппете, а его размер не должен превышать 60 символов. Тег очень важен для SEO-продвижения сайта.</p><p> <title>Заголовок всего документа
Тег считается необязательным элементом раздела , но он используется почти всегда. Этот тег является одинарным и не требует закрытия, как, например, … . С его помощью указываются метаданные страницы, о которых говорилось выше, еще всевозможные элементы разметки, закрытие от индексации и т.д.

Описание страницы задается с помощью атрибута name и его значения - description . Описание так же важно для продвижения сайта в поисковых системах.

На счет значения keywords ходит много споров, многие вебмастера считают, что на ключевые слова поисковые системы давно не обращают внимания и поэтому вообще их не прописывают, а другие утверждают обратное.

Атрибут charset указывает кодировку документа, на данный момент стоит UTF-8 .

Тег как и является одинарным, используется для определения отношения между текущим документом и другими файлами или, проще говоря, подключает содержимое стороннего файла к нашей странице, таких подключений может быть несколько. Так же может указывать каноничность документа.

Элемент

Элемент это основная часть документа, которая выводится в окне браузера, то есть, что находится в теге …

, показывается пользователю при открытии HTML-документа. В этом разделе прописываются разные теги и их атрибуты с разными значениями, о которых просто не реально рассказать в одной статье, поэтому я рекомендую сайт htmlbook.ru . На этом сайте вы найдете все теги HTML и CSS с примерами использования и подробным описанием каждого. Также рекомендую посмотреть бесплатные мини-курсы по сайтостроению . Эти курсы состоят из видеоуроков и позволяют более наглядно познакомится с написанием кода.

HTML (H ypert ext M arkup L anguage) is the code that is used to structure a web page and its content. For example, content could be structured within a set of paragraphs, a list of bulleted points, or using images and data tables. As the title suggests, this article will give you a basic understanding of HTML and its functions.

So what is HTML?

HTML is not a programming language; it is a markup language that defines the structure of your content. HTML consists of a series of elements , which you use to enclose, or wrap, different parts of the content to make it appear a certain way, or act a certain way. The enclosing for paragraph. Note that the end tag" s name is preceded by a slash character>", and that in empty elements the end tag is neither required nor allowed. If attributes are not mentioned, default values are used in each case.">tags can make a word or image hyperlink to somewhere else, can italicize words, can make the font bigger or smaller, and so on. For example, take the following line of content:
My cat is very grumpy
If we wanted the line to stand by itself, we could specify that it is a paragraph by enclosing it in paragraph tags:

My cat is very grumpy

Anatomy of an HTML element

Let"s explore this paragraph element a bit further.

The main parts of our element are as follows:

The opening tag: This consists of the name of the element (in this case, p), wrapped in opening and closing angle brackets . This states where the element begins or starts to take effect - in this case where the paragraph begins.

The closing tag: This is the same as the opening tag, except that it includes a forward slash before the element name. This states where the element ends - in this case where the paragraph ends. Failing to add a closing tag is one of the standard beginner errors and can lead to strange results.

The content: This is the content of the element, which in this case is just text.

The element: The opening tag, the closing tag, and the content together comprise the element.

Elements can also have attributes that look like the following:

Attributes contain extra information about the element that you don"t want to appear in the actual content. Here, class is the attribute name , and editor-note is the attribute value . The class attribute allows you to give the element an identifier that can be used later to target the element with style information and other things.

An attribute should always have the following:

A space between it and the element name (or the previous attribute, if the element already has one or more attributes).

The attribute name, followed by an equals sign.

The attribute value, wrapped by opening and closing quotation marks.

Note : Simple attribute values that don"t contain ASCII whitespace (or any of the characters " " ` = < >) can remain unquoted, but it is recommended that you quote all attribute values, as it makes the code more consistent and understandable.

Nesting elements

You can put elements inside other elements too - this is called nesting . If we wanted to state that our cat is very grumpy, we could wrap the word "very" in a ) indicates that its contents have strong importance, seriousness, or urgency. Browsers typically render the contents in bold type."> element, which means that the word is to be strongly emphasized:

My cat is very grumpy.

You do however need to make sure that your elements are properly nested: in the example above, we opened the element represents a paragraph.">
element first, then the ) indicates that its contents have strong importance, seriousness, or urgency. Browsers typically render the contents in bold type."> element; therefore, we have to close the ) indicates that its contents have strong importance, seriousness, or urgency. Browsers typically render the contents in bold type."> element first, then the element represents a paragraph.">
element. The following is incorrect:

My cat is very grumpy.

The elements have to open and close correctly so that they are clearly inside or outside one another. If they overlap as shown above, then your web browser will try to make the best guess at what you were trying to say, which can lead to unexpected results. So don"t do it!

Empty elements

Some elements have no content and are called empty elements . Take the element embeds an image into the document. It is a replaced element."> element that we already have in our HTML page:

This contains two attributes, but there is no closing tag and no inner content. This is because an image element doesn"t wrap content to affect it. Its purpose is to embed an image in the HTML page in the place it appears.

Anatomy of an HTML document

That wraps up the basics of individual HTML elements, but they aren"t handy on their own. Now we"ll look at how individual elements are combined to form an entire HTML page. Let"s revisit the code we put into our index.html example (which we first met in the Dealing with files article):
My test page

Here, we have the following:

- The doctype. In the mists of time, when HTML was young (around 1991/92), doctypes were meant to act as links to a set of rules that the HTML page had to follow to be considered good HTML, which could mean automatic error checking and other useful things. However, these days no one cares about them, and they are just a historical artifact that needs to be included for everything to work right. For now, that"s all you need to know.

- the element represents the root (top-level element) of an HTML document, so it is also referred to as the root element. All other elements must be descendants of this element."> element. This element wraps all the content on the entire page and is sometimes known as the root element.

- the element contains machine-readable information (metadata) about the document, like its title, scripts, and style sheets."> element. This element acts as a container for all the stuff you want to include on the HTML page that isn"t the content you are showing to your page"s viewers. This includes things like keywords and a page description that you want to appear in search results, CSS to style our content, character set declarations, and more.

- This element sets the character set your document should use to UTF-8, which includes most characters from the vast majority of written languages. Essentially, it can now handle any textual content you might put on it. There is no reason not to set this, and it can help avoid some problems later on.

- the ) defines the document" s that is shown in a browser bar or page tab.> element. This sets the title of your page, which is the title that appears in the browser tab the page is loaded in. It is also used to describe the page when you bookmark/favourite it.</li> <li><body><script type="text/javascript">  </script><br> <br> </body> - the element. This contains <i>all </i> the content that you want to show to web users when they visit your page, whether that"s text, images, videos, games, playable audio tracks, or whatever else.</li> </ul><h2>Images</h2> <img src='https://i0.wp.com/images/firefox-icon.png' loading=lazy loading=lazy> <p>As we said before, it embeds an image into our page in the position it appears. It does this via the src (source) attribute, which contains the path to our image file.</p> <p>We have also included an alt (alternative) attribute. In this attribute, you specify descriptive text for users who cannot see the image, possibly because of the following reasons:</p> <ol><li>They are visually impaired. Users with significant visual impairments often use tools called screen readers to read out the alt text to them.</li> <li>Something has gone wrong causing the image not to display. For example, try deliberately changing the path inside your src attribute to make it incorrect. If you save and reload the page, you should see something like this in place of the image:</li> </ol><p><img src='https://i1.wp.com/mdn.mozillademos.org/files/9349/alt-text-example.png' height="36" width="108" loading=lazy loading=lazy></p> <p>The keywords for alt text are "descriptive text". The alt text you write should provide the reader with enough information to have a good idea of what the image conveys. In this example, our current text of "My test image" is no good at all. A much better alternative for our Firefox logo would be "The Firefox logo: a flaming fox surrounding the Earth."</p> <p>Try coming up with some better alt text for your image now.</p> <h2>Marking up text</h2> <p>This section will cover some of the essential HTML elements you"ll use for marking up the text.</p> <h3>Headings</h3> <p>Heading elements allow you to specify that certain parts of your content are headings - or subheadings. In the same way that a book has the main title, chapter titles, and subtitles, an HTML document can too. HTML contains 6 heading levels, <h1> – <h6> , although you"ll commonly only use 3 to 4 at most:</p><p> <h1>My main title</h1> <h2>My top level heading</h2> <h3>My subheading</h3> <h4>My sub-subheading</h4> </p><p>Now try adding a suitable title to your HTML page just above your element embeds an image into the document. It is a replaced element."> <img> element.</p> <p><b>Note </b>: You"ll see that your heading level 1 has an implicit style. Don"t use heading elements to make text bigger or bold, because they are used for accessibility and other reasons such as SEO . Try to create a meaningful sequence of headings on your pages, without skipping levels.</p> <h3>Paragraphs</h3> <h3>Lists</h3> <p>A lot of the web"s content is lists, and HTML has special elements for these. Marking up lists always consist of at least 2 elements. The most common list types are ordered and unordered lists:</p> <ol><li><b>Unordered lists </b> are for lists where the order of the items doesn"t matter, such as a shopping list. These are wrapped in a element represents an unordered list of items, typically rendered as a bulleted list."> <ul> element.</li> <li><b>Ordered lists </b> are for lists where the order of the items does matter, such as a recipe. These are wrapped in an element represents an ordered list of items, typically rendered as a numbered list."> <ol> element.</li> </ol><p><img src='https://i1.wp.com/mdn.mozillademos.org/files/9351/finished-test-page-small.png' width="100%" loading=lazy loading=lazy></p> <p>If you get stuck, you can always compare your work with our finished example code on GitHub.</p> <p>Here, we have only really scratched the surface of HTML. To find out more, go to our topic.</p> <p>Всем привет! Сегодня провел утро в объяснениях «на пальцах», как ручками прописывать текстовые ссылки и ссылки изображения. Думаю, что начальные знания HTML никому не помешают, поэтому кратенько изложу основную суть HTML. Чтобы, так сказать, начинающие SEO оптимизаторы и блогеры имели представление об этом языке и о том, как построены страницы.</p> <h2>Что такое HTML?</h2> <p>HTML расшифровывается, как язык гипертекстовой разметки. Это компьютерный язык, используемый для создания документов в интернете. Эти документы представляют собой текстовые файлы, содержащие ваш контент (текст, изображения, видео и т.д.) и HTML теги, используемые для структурирования этого содержимого. Браузеры читают страницу, а HTML и HTML-теги говорят им, что и как показать. HTML-теги не отображаются в браузере. Все теги начинаются с левой стороны значком меньше «<» и заканчиваются значком больше «>» . Чтобы построить базовую HTML страницу вам потребуется текстовый редактор Notepad++ (на мой взгляд лучший) либо любой простой текстовый редактор на выбор TextEdit, TextWrangler, SimpleText, TextPad или даже Блокнот. Так же существуют специализированные программы, которые упрощают жизнь вебмастерам, такие как Adobe Dreamweaver, но это не обязательно. Не используйте <a href="https://comuedu.ru/tr/computer/sohranenie-dokumenta-v-programme-microsoft-word-sohranenie-dokument-v-word.html">Microsoft Word</a>! HTML не чувствительны к регистру.</p> <h2>Подробнее о HTML-тегах</h2> <p>Есть два вида тегов: контейнерные и пустые. </p> <ul><li>Контейнерный тег «оборачивает» текст или изображение и должен состоять из открывающего и закрывающего тега, такие как <html> … </ html> . Закрывающий тег имеет косую черту / говоря браузеру, что тег закончился.</li> <li>Пустой тег стоит особняком, такой как <br> для разрыва строки или <hr> для горизонтальной линии. Пустые теги не требуют закрывающего тега, поскольку они ничего не «оборачивают».</li> </ul><h2>Как создать страницу HTML</h2> <p>Чтобы с чего-нибудь начать, предлагаю взглянуть на очень простой шаблон HTML.</p> <p><html> <br> <head> <br> <title> Название сайта либо страницы </ title> <br> </ head> <br> <body> <br> Основной контент страницы <br> </ body> <br> </ html></p> <p>Обратите внимание на то, что когда мы открываем тег, мы должны <b>обязательно </b> закрыть его. HTML документы делятся на две основные части — голова (head) и тело (body). <html> тег сообщает браузеру, что это HTML документ. <head> тег включает в себя информацию о документе, такую как:</p> <ul><li>заголовок страницы — тег <title> , который появляется в браузерах, в названии вкладки</li> <li>тег автора — <author></li> <li>тег ключевых слов — <keywords></li> <li>тег описания — <description>и т.д.</li> </ul><p>Здесь же подключаются файлы стилей (CSS)? но это уже для более продвинутых товарищей. Наконец, тег <body>, который содержит весь контент страницы сайта: текст, изображения, графики, и т.д.</p> <h2>Создание первой HTML страницы</h2> <p>Откройте текстовый редактор и вставьте следующий код в новый документ:</p> <p><html> <br> <head> <br> <title> Моя первая веб страница </ title> <br> </ head> <br> <body> <br> Обучение HTML<br> Здравствуйте!<br> Это моя первая веб-страница.<br> Я учусь основам HTML и тегам заголовков<br> HTML ОСНОВЫ</p><p> </ body> <br> </ html></p> <p>Должно выглядеть вот таким образом:</p> <p>Сохраните файл как example.html на рабочий стол. Откройте файл в веб-браузере, чтобы увидеть, как он преобразует теги. Это будет выглядеть довольно скучно, на данном этапе, но это только начало.</p> <p>Можно немного и приукрасить:).</p> <h2>Форматирование текста</h2> <p>Мы можем добавлять теги к тексту, чтобы добавить ему больше структуры. На первом этапе выделим заголовки, абзацы, разрывы строк и горизонтальную линию, но обо всем по порядку.</p> <h3>Рубрики</h3> <p>Есть 6 уровней заголовков в HTML, они определяют уровень важности. Например на блоге, ваше название статьи может быть h1 тегом, в то время, как названия абзацев вашего поста могут быть h2 или h3 тегами. Например:</p> <p><h1> Заголовок h1 </h1> <br> <h2> Заголовок h2 </h2> <br> <h3> Заголовок h3 </h3></p> <h3>Пункты</h3> <p>Для отдельных участков текста можно использовать <p>Тег для добавления пробела между параграфами.</p> <p><p>Параграф </p></p> <h3>Разрыв строк</h3> <p>Чтобы добавить один разрыв строки используем пустой тег <br>, то есть его не надо закрывать /. Это создает пустую строку и отправляет следующий код на следующую строку.</p> <h3>Горизонтальная линия</h3> <p>Чтобы создать горизонтальную линию поперек вашей странице мы используем тег </span> <span><hr>. </p> <h2>Как добавить форматирование текста на страницу?</h2> <p>Откройте example.html в текстовом редакторе снова и добавляйте форматирование текста следующим образом:</p> <p><img src='https://i1.wp.com/promotiger.ru/wp-content/uploads/2014/05/my_html_pages_1.png' align="center" width="100%" loading=lazy loading=lazy></p> <p>В результате этих телодвижений получаем следующее:</p> <p><img src='https://i0.wp.com/promotiger.ru/wp-content/uploads/2014/05/my_html_1.png' align="center" width="100%" loading=lazy loading=lazy></p> <p>Уже приятнее глазу.</p> <p>Вот абсолютные основы HTML и, вероятно, самая скучная часть! </span><span>Я планирую в будущих постах немного развить данную тему, т.к. любому SEO специалисту в конце-концов приходится сталкиваться с основами HTML. </p> <p>Этот раздел сайта полностью посвящен двум языкам создания сайта, а именно HTML и CSS. Здесь вы сможете поэтапно изучить языки, узнать все от основ до самых сложных моментов.</p> <p>Данный раздел построен по принципу пошагового изучения материала, поэтому перед каждым названием урока по HTML и CSS, стоит цифра соответствующая порядковому номеру урока. Это естественно на тот случай если вы хотите изучить все от самых основ и не сделать себе кашу в голове. Если же вы уже знаете, что-либо о языках HTML и CSS, то вы так же можете найти здесь недостающие вам знания, или же, углубить уже изученное.</p> <p>В данном разделе размещены уроки по стандартам языка HTML5 и CSS3, соответственно, если же будут какие либо более новые версии данных языков, они так же будут отражены в новых уроках этого раздела, и вы обязательно узнаете .</p> <br><br><img src='https://i1.wp.com/for-net.ru/src/htmlcss/ico_first.png' height="115" width="220" loading=lazy loading=lazy><p>Наверное, каждый человек, который хоть раз в своей жизни сталкивался с созданием сайта, безусловно, слышал о такой связке как html и css я могу с уверенностью заявить, что если вы хотите делать сайты самостоятельно, то вам ни как не обойтись без знаний этих двух вещей.</p> <h3></h3> <img src='https://i1.wp.com/for-net.ru/src/htmlcss/ico_first_html.jpg' height="140" width="220" loading=lazy loading=lazy><p>После того как вы получили общие понятия о том, что такое html у вас в голове, явно сложилась неоднозначная картина, и я думаю это не удивительно. Пора переходить непосредственно к практике и создать-таки свой первый html документ.</p> <h3></h3> <img src='https://i0.wp.com/for-net.ru/src/htmlcss/ico_first_css.jpg' height="140" width="220" loading=lazy loading=lazy><p>Как и в языке html, так и в CSS есть свои особенности, правила и структура. В этом уроке я расскажу вам об основных понятиях языка CSS, о его структуре, устройстве и мы сделаем с вами первую CSS таблицу стилей и узнаете, как подключить таблицу стилей к html документу.</p> <h3></h3> <p>Селекторы в CSS являются основой самого языка и их изучение и понимание очень важно, поэтому в этом уроке я вам расскажу еще о нескольких видах селекторах и опишу их возможности.</p> <h3></h3> <p>Очень важным моментом в создании сайта, является работа с текстом, и как вы понимаете, с текстом в html так же необходимо уметь работать, и знать какие теги бывают и как их можно использовать.</p> <h3></h3> <p>После того как вы узнали все html теги для работы с текстом, теперь пора перейти непосредственно к CSS работе с текстом, которая уже значительно расширит ваши познания и возможности.</p> <h3></h3> <p>В CSS огромное количество всевозможных удобных и качественно меняющих <a href="https://comuedu.ru/tr/windows/vidy-naushnikov-i-kak-ih-vybrat-dlya-kompyutera-kakie-vidy-naushnikov-byvayut.html">внешний вид</a> свойств и мы продолжаем изучать CSS работу с текстом и в этом уроке, мы углубимся в тему работы с текстом и рассмотрим новые свойства текста.</p> <h3></h3> <p>Работа с изображениями при создании с сайта, один из ключевых моментов, как при создании дизайна, также при простой верстке или написании каких либо материалов для вашего сайта.</p> <h3></h3> <p>CSS значительно расширяет возможности работы с любыми объектами html, в этом уроке я хотел бы вам подробно рассказать о тех параметрах которые можно применять к изображениям.</p> <script>document.write("<img style='display:none;' src='//counter.yadro.ru/hit;artfast_after?t44.1;r"+ escape(document.referrer)+((typeof(screen)=="undefined")?"": ";s"+screen.width+""+screen.height+""+(screen.colorDepth? screen.colorDepth:screen.pixelDepth))+";u"+escape(document.URL)+";h"+escape(document.title.substring(0,150))+ ";"+Math.random()+ "border='0' width='1' height='1' loading=lazy loading=lazy>");</script> </div> <div class="data"> <div class="datatop clearfix"> <div class="dataprint"> <a href='javascript:window.print(); void 0;'> Yazdır</a> </div> </div> <div class="databottom clearfix"> <div class="datashare"> <script src="//yastatic.net/es5-shims/0.0.2/es5-shims.min.js"></script> <script src="//yastatic.net/share2/share.js"></script> <div class="ya-share2" data-services="vkontakte,facebook,odnoklassniki,moimir,gplus,twitter,evernote,whatsapp,skype"></div> </div> </div> </div> <div class="navi"> <a href="https://comuedu.ru/tr/smartphone/skachat-obnovlennyi-gugl-versiya-google-chrome-dlya-ios.html" class="navi__prev"></a>  <a href="https://comuedu.ru/tr/modems/google-ua-poiskovaya-sistema-skachat-i-ustanovit-poslednyuyu-versiyu-google-chrome-ot.html" class="navi__next"></a>  </div> </div> </div> <div class="news-blocks clearfix"> <div class="news-block"> <div class="papers"> <div class="paperstitle">Ayrıca ilginç:</div> <div class="papersitems"> <style> </style> <div class="papersitem"> <div class="papersimg"> <a href="https://comuedu.ru/tr/internet/sochetanie-klavish-windows-7-sochetaniya-klavish-dlya-raboty-so-spravkoi.html"><img src="/uploads/bab77659abf9189d8ca95b3a1b3d4f25.jpg" style="width:70px; height:70px;" / loading=lazy loading=lazy></a> </div> <div class="papersovh"> <div class="papersname"> <a href="https://comuedu.ru/tr/internet/sochetanie-klavish-windows-7-sochetaniya-klavish-dlya-raboty-so-spravkoi.html">Windows Yardımı ile Çalışmak İçin Klavye Kısayolları</a> </div> <div class="paperscategory"> </div> </div> </div> <div class="papersitem"> <div class="papersimg"> <a href="https://comuedu.ru/tr/different/skachat-metlu-na-russkom-yazyke-polnaya-chistka-kompyutera-ot.html"><img src="/uploads/b54a240a7db0f53bdaba1f4410d58587.jpg" style="width:70px; height:70px;" / loading=lazy loading=lazy></a> </div> <div class="papersovh"> <div class="papersname"> <a href="https://comuedu.ru/tr/different/skachat-metlu-na-russkom-yazyke-polnaya-chistka-kompyutera-ot.html">Bir bilgisayarın çöpten temizleme: Ayrıntılı talimatlar</a> </div> <div class="paperscategory"> </div> </div> </div> <div class="papersitem"> <div class="papersimg"> <a href="https://comuedu.ru/tr/computer/programma-dlya-udaleniya-nenuzhnogo-musora-s-kompyutera-podborka-luchshih.html"><img src="/uploads/c058a3fccce3178dcb5fae7437c777bd.jpg" style="width:70px; height:70px;" / loading=lazy loading=lazy></a> </div> <div class="papersovh"> <div class="papersname"> <a href="https://comuedu.ru/tr/computer/programma-dlya-udaleniya-nenuzhnogo-musora-s-kompyutera-podborka-luchshih.html">Çöpten en iyi bilgisayar temizleme programlarının seçimi</a> </div> <div class="paperscategory"> </div> </div> </div> </div> </div> </div> <div class="news-block"> <div class="papers"> <div class="paperstitle">Okumanızı öneririz:</div> <div class="papersitems"> <div class="papersitem"> <div class="papersimg"> <a href="https://comuedu.ru/tr/computer/rabochii-stol-i-korzina-kak-rabotayut-ispolzovanie-korziny-v-windows-chto.html"> <img width="50" height="50" src="/uploads/2ff78ba645470a502c0356f4de3139d1.jpg" class="attachment-50 size-50 wp-post-image" alt="Windows'ta bir sepet kullanma" sizes="(max-width: 50px) 100vw, 50px" / loading=lazy loading=lazy> </a> </div> <div class="papersovh"> <div class="papersdate">12.04.2021</div> <div class="papersname"> <a href="https://comuedu.ru/tr/computer/rabochii-stol-i-korzina-kak-rabotayut-ispolzovanie-korziny-v-windows-chto.html">Windows'ta bir sepet kullanma</a> </div> </div> </div> <div class="papersitem"> <div class="papersimg"> <a href="https://comuedu.ru/tr/program/skachat-flash-player-dlya-vseh-versii-ustanovit-adobe-flash-player-poslednei-versii.html"> <img width="50" height="50" src="/uploads/7a1dbc0b5df5696839887a595d8f533d.jpg" class="attachment-50 size-50 wp-post-image" alt="Adobe Flash Player'ı En Son Sürümünü Yükle" sizes="(max-width: 50px) 100vw, 50px" / loading=lazy loading=lazy> </a> </div> <div class="papersovh"> <div class="papersdate">12.04.2021</div> <div class="papersname"> <a href="https://comuedu.ru/tr/program/skachat-flash-player-dlya-vseh-versii-ustanovit-adobe-flash-player-poslednei-versii.html">Adobe Flash Player'ı En Son Sürümünü Yükle</a> </div> </div> </div> <div class="papersitem"> <div class="papersimg"> <a href="https://comuedu.ru/tr/routers/skachat-120-dll-dlya-igr-kak-reshit-etu-problemu.html"> <img width="50" height="50" src="/uploads/04d15f979c10802bbe617c515846ca06.jpg" class="attachment-50 size-50 wp-post-image" alt="Oyunlar için 120 dll indirin. Bu sorunu nasıl çözebilirim" sizes="(max-width: 50px) 100vw, 50px" / loading=lazy loading=lazy> </a> </div> <div class="papersovh"> <div class="papersdate">12.04.2021</div> <div class="papersname"> <a href="https://comuedu.ru/tr/routers/skachat-120-dll-dlya-igr-kak-reshit-etu-problemu.html">Oyunlar için 120 dll indirin. Bu sorunu nasıl çözebilirim</a> </div> </div> </div> </div> </div> </div> </div> <div class="rate clearfix"> <div class="paperstitle">Konuya devam ediyor:</div> </div> <div class="rate clearfix"> <div class="rateimg"> <a href="https://comuedu.ru/tr/smartphone/obzor-programmy-minitool-power-data-recovery-obzor-programmy-minitool-power-data-recovery-data-recovery-na.html"> <img width="150" height="150" src="/uploads/80ace29a595239ef2a0f192494b58652.jpg" class="attachment-alm-thumbnail size-alm-thumbnail wp-post-image" alt="Minitool Güç Veri Kurtarma Veri Kurtarma Programı Rusça İnceleme" sizes="(max-width: 150px) 100vw, 150px" / loading=lazy loading=lazy> </a> </div> <div class="rateovh"> <div class="ratelabel"> <span>Akıllı telefon</span> </div> <div class="ratename"> <a href="https://comuedu.ru/tr/smartphone/obzor-programmy-minitool-power-data-recovery-obzor-programmy-minitool-power-data-recovery-data-recovery-na.html">Minitool Güç Veri Kurtarma Veri Kurtarma Programı Rusça İnceleme</a> </div> <div class="ratedescription"> <p>Minitool Güç Veri Kurtarma Serbest Sürümü, verileri kurtarmak için tasarlanmış kullanımı kolay bir programdır. Minitool Güç Veri Kurtarma ile çalışmak için ...</p> </div> </div> </div>  </div> <div class="button-menu"></div> <div class="pageright"> <div class="menu"> <div class="menuexit">×</div> <ul> <li><a href="https://comuedu.ru/tr/category/apple/" class="link-catalog">Elma.</a> </li> <li><a href="https://comuedu.ru/tr/category/routers/" class="link-catalog">Router</a> </li> <li><a href="https://comuedu.ru/tr/category/computer/" class="link-catalog">Bir bilgisayar</a> </li> <li><a href="https://comuedu.ru/tr/category/smartphone/" class="link-catalog">Akıllı telefon</a> </li> <li><a href="https://comuedu.ru/tr/category/internet/" class="link-catalog">internet</a> </li> <li><a href="https://comuedu.ru/tr/category/wi-fi/" class="link-catalog">Wifi</a> </li> <li><a href="https://comuedu.ru/tr/category/linux/" class="link-catalog">Linux</a> </li> <li><a href="https://comuedu.ru/tr/category/windows/" class="link-catalog">pencereler</a> </li> </ul> </div> <div id="husevi1" style="height:400px;width:290px;" align="center"></div> <div class="pagehidden-mobile"> <div class="papers"> <div class="paperstabs"> <div class="active" data-eq="0">Yeni Makaleler</div> <span>/</span> <div data-eq="1">Popüler</div> </div> <div class="papersblocks"> <div class="papersblock active"> <div class="papersitems"> <div class="papersitem"> <div class="papersimg"> <a href="https://comuedu.ru/tr/modems/skachat-brauzer-s-turbo-rezhimom-poslednei-versii-ekonomiya-trafika-i.html"> <img width="50" height="50" src="/uploads/342631e0984d154d2403731eddaad3ec.jpg" class="attachment-50 size-50 wp-post-image" alt="Trafik Tasarrufları ve Turbo" sizes="(max-width: 50px) 100vw, 50px" / loading=lazy loading=lazy> </a> </div> <div class="papersovh"> <div class="papersdate">12.04.2021</div> <div class="papersname"> <a href="https://comuedu.ru/tr/modems/skachat-brauzer-s-turbo-rezhimom-poslednei-versii-ekonomiya-trafika-i.html">Trafik Tasarrufları ve Turbo</a> </div> <div class="paperscategory"> <a href="https://comuedu.ru/tr/category/modems/">Modemler</a> </div> </div> </div> <div class="papersitem"> <div class="papersimg"> <a href="https://comuedu.ru/tr/apple/kak-naiti-samye-bystrye-proksi-chto-takoe-proksi-servery-i-kak-imi.html"> <img width="50" height="50" src="/uploads/7fdf4716c640907c4547419c419bc854.jpg" class="attachment-50 size-50 wp-post-image" alt="Proxy sunucuları nedir ve hızlı bir anonim proxy nasıl kullanılır?" sizes="(max-width: 50px) 100vw, 50px" / loading=lazy loading=lazy> </a> </div> <div class="papersovh"> <div class="papersdate">12.04.2021</div> <div class="papersname"> <a href="https://comuedu.ru/tr/apple/kak-naiti-samye-bystrye-proksi-chto-takoe-proksi-servery-i-kak-imi.html">Proxy sunucuları nedir ve hızlı bir anonim proxy nasıl kullanılır?</a> </div> <div class="paperscategory"> <a href="https://comuedu.ru/tr/category/apple/">Elma.</a> </div> </div> </div> <div class="papersitem"> <div class="papersimg"> <a href="https://comuedu.ru/tr/internet/chto-vhodit-v-materinskuyu-platu-kompyutera-osnovnye-komponenty-materinskoi.html"> <img width="50" height="50" src="/uploads/555d4b598b824d847bab7c072d6a880f.jpg" class="attachment-50 size-50 wp-post-image" alt="Anakartın ana bileşenleri" sizes="(max-width: 50px) 100vw, 50px" / loading=lazy loading=lazy> </a> </div> <div class="papersovh"> <div class="papersdate">12.04.2021</div> <div class="papersname"> <a href="https://comuedu.ru/tr/internet/chto-vhodit-v-materinskuyu-platu-kompyutera-osnovnye-komponenty-materinskoi.html">Anakartın ana bileşenleri</a> </div> <div class="paperscategory"> <a href="https://comuedu.ru/tr/category/internet/">internet</a> </div> </div> </div> <div class="papersitem"> <div class="papersimg"> <a href="https://comuedu.ru/tr/program/kupit-programmu-skaip-skype-skachat-besplatno-russkaya-versiya-skype-skachat.html"> <img width="50" height="50" src="/uploads/c331569f59c8263d318359b622562930.jpg" class="attachment-50 size-50 wp-post-image" alt="Skype ücretsiz Rus versiyonu" sizes="(max-width: 50px) 100vw, 50px" / loading=lazy loading=lazy> </a> </div> <div class="papersovh"> <div class="papersdate">12.04.2021</div> <div class="papersname"> <a href="https://comuedu.ru/tr/program/kupit-programmu-skaip-skype-skachat-besplatno-russkaya-versiya-skype-skachat.html">Skype ücretsiz Rus versiyonu</a> </div> <div class="paperscategory"> <a href="https://comuedu.ru/tr/category/program/">Programlar</a> </div> </div> </div> <div class="papersitem"> <div class="papersimg"> <a href="https://comuedu.ru/tr/smart-tv/vybiraem-zhestkii-disk-dlya-kompyutera-kak-vybrat-zhestkii-disk-sovety.html"> <img width="50" height="50" src="/uploads/e6210f12ae90a6968436a60eefd159d1.jpg" class="attachment-50 size-50 wp-post-image" alt="Sabit Sürücü Nasıl Seçilir: Profesyonel Tavsiye Sabit Disk Seçimi" sizes="(max-width: 50px) 100vw, 50px" / loading=lazy loading=lazy> </a> </div> <div class="papersovh"> <div class="papersdate">12.04.2021</div> <div class="papersname"> <a href="https://comuedu.ru/tr/smart-tv/vybiraem-zhestkii-disk-dlya-kompyutera-kak-vybrat-zhestkii-disk-sovety.html">Sabit Sürücü Nasıl Seçilir: Profesyonel Tavsiye Sabit Disk Seçimi</a> </div> <div class="paperscategory"> <a href="https://comuedu.ru/tr/category/smart-tv/">Akıllı televizyon.</a> </div> </div> </div> <div class="papersitem"> <div class="papersimg"> <a href="https://comuedu.ru/tr/windows/kak-udalit-s-android-zavodskie-prilozheniya-udalenie-udalennyh-failov-na-android.html"> <img width="50" height="50" src="/uploads/13b62184466284b8a12f97f63e42f351.jpg" class="attachment-50 size-50 wp-post-image" alt="Android'de Uzak Dosyaları Sil" sizes="(max-width: 50px) 100vw, 50px" / loading=lazy loading=lazy> </a> </div> <div class="papersovh"> <div class="papersdate">12.04.2021</div> <div class="papersname"> <a href="https://comuedu.ru/tr/windows/kak-udalit-s-android-zavodskie-prilozheniya-udalenie-udalennyh-failov-na-android.html">Android'de Uzak Dosyaları Sil</a> </div> <div class="paperscategory"> <a href="https://comuedu.ru/tr/category/windows/">pencereler</a> </div> </div> </div> </div> </div> <div class="papersblock"> <div class="papersitems"> <div class="papersitem"> <div class="papersimg"><a href="https://comuedu.ru/tr/android/kak-sdelat-pdf-fail-chto-takoe-pdf-fail-i-kak-ego-otkryt-osnovnye-programmy.html"> <img width="50" height="50" src="/uploads/548d8b424e1caec0a5dbb8129fd6dc7d.jpg" class="attachment-50x50 size-50x50 wp-post-image" alt="PDF dosyası nedir ve nasıl açılır?" sizes="(max-width: 50px) 100vw, 50px" / loading=lazy loading=lazy> </a></div> <div class="papersovh"> <div class="papersname"> <a href="https://comuedu.ru/tr/android/kak-sdelat-pdf-fail-chto-takoe-pdf-fail-i-kak-ego-otkryt-osnovnye-programmy.html">PDF dosyası nedir ve nasıl açılır?</a> </div> <div class="paperscategory"><a href="https://comuedu.ru/tr/category/android/" rel="tag">Android</a></div> </div> </div> <div class="papersitem"> <div class="papersimg"><a href="https://comuedu.ru/tr/wi-fi/ustranenie-oshibki-dxgi-dll-ne-byl-naiden-ustranenie-oshibki-dxgi-dll-ne.html"> <img width="50" height="50" src="/uploads/cce842ef4b2530262f6eaba23aec4efe.jpg" class="attachment-50x50 size-50x50 wp-post-image" alt="Hata kaldırma: "DXGI DLL, bir bilgisayarda yüklü DirectX'in doğrulama sürümü bulunamadı" sizes="(max-width: 50px) 100vw, 50px" / loading=lazy loading=lazy> </a></div> <div class="papersovh"> <div class="papersname"> <a href="https://comuedu.ru/tr/wi-fi/ustranenie-oshibki-dxgi-dll-ne-byl-naiden-ustranenie-oshibki-dxgi-dll-ne.html">Hata kaldırma: "DXGI DLL, bir bilgisayarda yüklü DirectX'in doğrulama sürümü bulunamadı</a> </div> <div class="paperscategory"><a href="https://comuedu.ru/tr/category/wi-fi/" rel="tag">Wifi</a></div> </div> </div> <div class="papersitem"> <div class="papersimg"><a href="https://comuedu.ru/tr/network/krasivyi-shrift-onlain-napisat-im-tekst-onlain-krasivye-statusy-v-vk.html"> <img width="50" height="50" src="/uploads/517a6f286b5ebe1bff1d714b09d2d865.jpg" class="attachment-50x50 size-50x50 wp-post-image" alt="Güzel harflerle VK sınıf cümlelerinde güzel durumlar" sizes="(max-width: 50px) 100vw, 50px" / loading=lazy loading=lazy> </a></div> <div class="papersovh"> <div class="papersname"> <a href="https://comuedu.ru/tr/network/krasivyi-shrift-onlain-napisat-im-tekst-onlain-krasivye-statusy-v-vk.html">Güzel harflerle VK sınıf cümlelerinde güzel durumlar</a> </div> <div class="paperscategory"><a href="https://comuedu.ru/tr/category/network/" rel="tag">Ağ</a></div> </div> </div> <div class="papersitem"> <div class="papersimg"><a href="https://comuedu.ru/tr/the-device/derevnya-ez-na-lazurnom-beregu-francii-ez---ot-drevnego-poseleniya.html"> <img width="50" height="50" src="/uploads/d1a3e732e2c7b3f45603bb1eb4fd2ae9.jpg" class="attachment-50x50 size-50x50 wp-post-image" alt="EZ - eski yerleşimden EZ köyünün ruhlarına güzel ve monaco arasında" sizes="(max-width: 50px) 100vw, 50px" / loading=lazy loading=lazy> </a></div> <div class="papersovh"> <div class="papersname"> <a href="https://comuedu.ru/tr/the-device/derevnya-ez-na-lazurnom-beregu-francii-ez---ot-drevnego-poseleniya.html">EZ - eski yerleşimden EZ köyünün ruhlarına güzel ve monaco arasında</a> </div> <div class="paperscategory"><a href="https://comuedu.ru/tr/category/the-device/" rel="tag">Aygıtlar</a></div> </div> </div> <div class="papersitem"> <div class="papersimg"><a href="https://comuedu.ru/tr/smart-tv/obzor-i-opyt-ekspluatacii-ipad-mini-s-displeem-retina-ipad-mini-c-ekranom-retina.html"> <img width="50" height="50" src="/uploads/0492f8202aa8b49fa9ebdd256c00800b.jpg" class="attachment-50x50 size-50x50 wp-post-image" alt="Retina Ekranı ile iPad Mini: Tasarım, Ekipman, Özellikler Yeni iPad Mini Retina" sizes="(max-width: 50px) 100vw, 50px" / loading=lazy loading=lazy> </a></div> <div class="papersovh"> <div class="papersname"> <a href="https://comuedu.ru/tr/smart-tv/obzor-i-opyt-ekspluatacii-ipad-mini-s-displeem-retina-ipad-mini-c-ekranom-retina.html">Retina Ekranı ile iPad Mini: Tasarım, Ekipman, Özellikler Yeni iPad Mini Retina</a> </div> <div class="paperscategory"><a href="https://comuedu.ru/tr/category/smart-tv/" rel="tag">Akıllı televizyon.</a></div> </div> </div> <div class="papersitem"> <div class="papersimg"><a href="https://comuedu.ru/tr/wi-fi/telefon-aifon-chto-v-chem-otlichiya-iphone-ot-smartfonov-v-chem.html"> <img width="50" height="50" src="/uploads/c0925e6f746c0b4ad355003b77518b68.jpg" class="attachment-50x50 size-50x50 wp-post-image" alt="Akıllı telefonlardan Fark iphone nedir" sizes="(max-width: 50px) 100vw, 50px" / loading=lazy loading=lazy> </a></div> <div class="papersovh"> <div class="papersname"> <a href="https://comuedu.ru/tr/wi-fi/telefon-aifon-chto-v-chem-otlichiya-iphone-ot-smartfonov-v-chem.html">Akıllı telefonlardan Fark iphone nedir</a> </div> <div class="paperscategory"><a href="https://comuedu.ru/tr/category/wi-fi/" rel="tag">Wifi</a></div> </div> </div> </div> </div> </div> </div> <div class="comments"> <div id="husevi2" class="husevi-sticky" style="height:500px;width:254px;" align="center"></div> </div> </div> </div> </div> </div> </div> <div class="footer"> <div class="footertop"> <div class="cnt"> <div class="footernav"> <ul> <li><a href="">İletişim</a></li> <li><a href="">Reklâm</a></li> <li><a href="">Site hakkında</a></li> </ul> </div> <div class="footercounter"> </div> <div class="footerlogo1" align="right"> <img style="max-height:60px;" src="/assets/logo.png" alt="" loading=lazy loading=lazy> </div> </div> </div> <div class="footerbottom"> <div class="cnt"> <div class="footer__copyright"> © comuedu.ru 2021 Site Bilgisayar Teknisyeni Hakkında</div> </div> </div> </div> <a href="https://comuedu.ru/tr/#top" class="up"></a> </div> <script src="https://comuedu.ru/wp-content/themes/tehnika-expert/js/jquery-1.12.0.js"></script> <script src="https://comuedu.ru/wp-content/themes/tehnika-expert/js/owl.carousel.min.js"></script> <script src="https://comuedu.ru/wp-content/themes/tehnika-expert/js/mousewheel.js"></script> <script src="https://comuedu.ru/wp-content/themes/tehnika-expert/js/jscrollpane.min.js"></script> <script src="https://comuedu.ru/wp-content/themes/tehnika-expert/js/scripts.js?v=8"></script>  <script type='text/javascript' src='https://comuedu.ru/wp-content/plugins/table-of-contents-plus/front.min.js?ver=1509'></script> <script type='text/javascript' src='https://comuedu.ru/wp-content/plugins/wp-ajaxify-comments/js/wp-ajaxify-comments.min.js?ver=1.5.0'></script> <script type='text/javascript' src='https://comuedu.ru/wp-content/plugins/wp-polls/polls-js.js?ver=2.73.8'></script> <script type='text/javascript' src='https://comuedu.ru/wp-content/plugins/wp-postratings/js/postratings-js.js?ver=1.85'></script> <script type='text/javascript' src='https://comuedu.ru/wp-content/plugins/wp_testme/js/testme.js?ver=1.1'></script> <script type='text/javascript' src='/wp-includes/js/comment-reply.min.js?ver=4.9'></script> <script type='text/javascript'> var q2w3_sidebar_options = new Array(); q2w3_sidebar_options[0] = { "sidebar" : "sidebar-2", "margin_top" : 10, "margin_bottom" : 112, "stop_id" : "", "screen_max_width" : 0, "screen_max_height" : 0, "width_inherit" : false, "refresh_interval" : 1500, "window_load_hook" : false, "disable_mo_api" : false, "widgets" : ['cb_widget-2'] } ; </script> <script type='text/javascript' src='https://comuedu.ru/wp-content/plugins/q2w3-fixed-widget/js/q2w3-fixed-widget.min.js?ver=5.0.4'></script> <script type='text/javascript' src='/wp-includes/js/wp-embed.min.js?ver=4.9'></script> <script type="text/javascript">  </script><br> <br> </body> </html>