Mempelajari asas kod html untuk dummies. Pelan pengajian untuk penguasaan mudah HTML dan CSS. Kajian selari html dan css

Selamat datang ke halaman blog saya. HTML ialah bahasa penanda mudah yang digunakan untuk membuat halaman web. Saya berkata ia mudah supaya anda tidak akan gentar dengan mempelajarinya. Bahasa html hanya sesuai untuk pemula - lebih sukar untuk menguasai bahasa pengaturcaraan dari awal, tetapi html sebenarnya lebih mudah.

Dalam artikel ini saya ingin memberitahu anda cara mempelajari bahasa ini paling cepat dan berkesan, supaya dalam masa satu atau dua bulan anda mengetahuinya dengan sempurna. Adakah anda fikir ia mustahil? Saya mula belajar html pada penghujung bulan Mac. Pada penghujung Mei, saya sudah mengetahui 90% daripada teg yang diperlukan untuk kerja tanpa sebarang masalah.

Bagaimana untuk belajar bahasa secara percuma?

Sudah tentu, untuk kebanyakan cepat belajar anda harus mencari beberapa laman web yang berguna. Pertama, anda memerlukan rujukan html. Malah pengaturcara berpengalaman menggunakannya, kerana adalah mustahil untuk menyimpan berpuluh-puluh tag dan atributnya di kepala anda.

Daripada buku rujukan yang saya boleh cadangkan kepada anda - htmlbook. Ini adalah tapak yang sangat hebat yang mengumpulkan semua teg dan menunjukkan hasil kerja mereka Penerangan terperinci. Tetapi ini hanyalah panduan alat tambahan, kesan terbesar boleh dicapai dengan amalan sebenar.

Kursus interaktif

Dan di sini saya bercakap tentang kursus interaktif. Ini ialah keupayaan untuk menulis kod dan segera melihat bagaimana ia dipaparkan. Semasa kursus anda akan diberikan tugasan. Pertama, yang mudah, sebagai contoh, mengubah teks menjadi tajuk atau membuat jadual. Kemudian ia lebih sukar. Akhirnya anda akan mendapat pemahaman tentang perkara yang boleh anda lakukan dengan HTML. Jika anda fikir anda perlu membayar untuk ini, anda silap.

ialah tapak yang menarik dengan kursus tentang html dan css. 16-18 kursus pertama adalah percuma! Jika anda ingin meneruskan pengajian anda dan mendapat akses kepada yang berbayar, anda perlu membayar 300 rubel sebulan atau 1800 setahun. Secara peribadi, saya memberikan 300 rubel, saya menyelesaikan segala-galanya dalam sebulan kursus berbayar dan mendapat banyak manfaat daripadanya.

Kepentingan rekod

Satu lagi nasihat daripada saya - tuliskannya! Tulis semua maklumat yang baru dan penting kepada anda. Tanpa menulisnya, anda berisiko tidak menyimpan pengetahuan yang diperlukan dalam ingatan anda. Secara peribadi, saya mempunyai tiga buku nota umum di rak saya, hampir penuh dengan tulisan, dan dari semasa ke semasa saya melihatnya apabila saya terlupa harta ini atau itu.

Kajian selari html dan css

HTML hanyalah satu teknologi web yang membantu mencipta struktur dan susun atur halaman web. CSS bertanggungjawab sepenuhnya untuk reka bentuk dalam pembangunan laman web. Bahasa-bahasa ini perlu dipelajari serentak kerana ia berinteraksi antara satu sama lain.

Amalan bebas

Apabila anda telah mendapat sedikit pengetahuan, anda boleh berlatih sendiri. Bagaimana hendak melakukannya? Cuba susun rencana dengan gambar, jadual, senarai bersarang, susun atur halaman dua lajur yang ringkas atau sesuatu yang lain. Anda perlu berlatih kerana ia satu-satunya cara cepat tanamkan dalam otak anda pemahaman tentang bagaimana segala-galanya berfungsi. Perkara terbaik, sudah tentu, adalah untuk mencari diri anda seorang guru dalam perkara ini, tetapi kemungkinan besar anda perlu membayar untuk ini.

Pengajaran daripada pasukan webformyself

Webformyself ialah portal Internet hebat yang menyediakan banyak maklumat tentang pembinaan laman web. Di laman web mereka, anda boleh menemui banyak artikel percuma tentang HTML, CSS dan susun atur tapak web, tetapi mereka juga telah mengeluarkan tutorial video berbayar, yang tujuannya adalah untuk menyampaikan pengetahuan berguna kepada anda secepat mungkin.

Pada penghujung hari, anda sepatutnya mempunyai sebab mengapa anda mempelajari teknologi web ini. Ini biasanya dilakukan untuk mempelajari cara membuat reka letak laman web sendiri. Jika anda juga mempunyai matlamat sedemikian, maka pilihan yang sangat baik anda akan membeli akses kepada pelajaran premium di webformyself.com. Hasilnya, anda bukan sahaja boleh mendapatkan akses kepada pelajaran tentang HTML dan CSS, tetapi juga banyak lagi. Contohnya, JavaScript dan WordPress.

Terdapat pelajaran berguna di sana, termasuk peluang untuk membuat reka letak pertama anda menggunakan pelajaran. Ini sangat penting, kerana anda akan mendapat amalan yang baik, selepas itu anda akan dapat meningkatkan kemahiran anda sendiri, cuba membuat susun atur lain untuk tapak yang anda temui di Internet.

Berapa lama masa yang diambil untuk mempelajari bahasa?

Secara purata, HTML dan CSS boleh dipelajari dengan cepat, dengan pendekatan yang betul. Sebagai contoh, saya mengambil masa beberapa bulan. Jika anda tahu di mana untuk mendapatkan ilmu, proses pembelajaran boleh dipercepatkan beberapa kali.

Tapak yang baik dengan bahan yang berguna Saya memberikannya kepada anda - kemudian terpulang kepada anda. Pada dasarnya, sumber di atas adalah yang terbaik di Internet. Sebagai contoh, lebih daripada seratus ribu orang telah menyelesaikan kursus dari Htmlacademy, dan lebih daripada 87 ribu orang telah melanggan kemas kini Webformyself.

Daripada pengarang: Hello semua. Kita semua ingin lebih memahami pembinaan tapak web untuk terlibat projek yang menarik dan menghidupkan idea anda. Tetapi bagaimana jika anda seorang pemula yang lengkap? kami html tutorial untuk dummies dengan pelajaran praktikal akan membantu anda akhirnya membuat kejayaan penting dalam pembinaan laman web dari tahap sifar kepada sekurang-kurangnya pemahaman asas.

Dalam pembelajaran membina laman web, seperti dalam hampir semua perkara lain, latihan adalah penting. Anda boleh membaca semula resipi untuk membuat borscht 1000 kali, tetapi itu tidak akan menghalang anda daripada memasaknya. Anda boleh mempelajari prinsip asas memandu kereta, tetapi sehingga anda berada di belakang roda, semuanya adalah misteri. Tidak dinafikan terdapat beberapa faedah daripada pengetahuan teori, tetapi tidak sehebat daripada kemahiran sebenar.

Jadi, jika kita bercakap tentang belajar html, maka ada juga teori, dan kemudian ada praktikal. Teori dalam kes ini hanyalah sejenis siri artikel, pelajaran mengenai topik bahasa, tag asas dan aplikasinya, dsb.

Latihan bermula untuk anda apabila anda membuat fail html sendiri, tulis di sana kod mula dan mula belajar dengan tangan anda sendiri bagaimana semuanya berfungsi. Saya menulis teg dan melihat cara ia berfungsi. Saya memasukkan gambar dan menyemaknya. Menambah beberapa atribut, dsb. Ia adalah amalan yang membolehkan anda memahami dan mengingati tag utama dengan cepat. Kemudian anda hanya menulisnya secara automatik dan anda tidak perlu mengingati selama setengah jam cara membuat senarai.

Nah, untuk tag yang jarang berlaku, anda harus sentiasa menggunakan kamus. Tiada siapa, tiada seorang pereka reka letak super atau pembangun web, saya fikir, mengetahui semua teg dengan hati. Ia tidak perlu. Jika anda menggunakan tag setiap 10 tahun sekali, maka mengapa menyimpannya di kepala anda? Saya rasa ini jelas.

Tetapi saya akan memanggil amalan ini hanya sejenis permainan kotak pasir. Anda hanya menulis tag yang berbeza, cuba memikirkan semuanya dengan terperinci yang mungkin, tetapi untuk apa? Mesti ada tujuan. Lazimnya, html dan css dikaji untuk membuat halaman web anda sendiri dan tapak web sepenuhnya.

Jadi, amalan terbaik– adalah untuk mengambil susun atur tapak web siap sedia dan susun aturnya. Layout ialah proses mencipta halaman web daripada lukisan berbilang lapisan menggunakan bahasa html dan css. Walaupun semasa reka letak mereka boleh menggunakan rangka kerja, javascript dan perpustakaan aplikasi, tetapi ini adalah topik untuk perbualan lain. Semua ini adalah tambahan. HTML ialah teknologi asas yang perlu difahami dengan baik.

Tetapi saya akan menggembirakan anda - ia adalah asas, ia adalah yang paling mudah. Sangat mudah untuk mengetahui cara teg tertentu berfungsi dan cara menggunakannya. Tiada apa-apa dalam html algoritma yang kompleks, fungsi, kaedah, kelas, seperti yang berlaku dalam bahasa pengaturcaraan. Ini adalah bahasa penanda, hanya kaji sedikit, dan semuanya akan menjadi sangat jelas.

Bagaimana untuk mempelajari bahasa dengan betul dan di mana untuk mendapatkan latihan?

Sekali lagi, saya bercakap tentang pembelajaran yang mudah hanya jika anda pergi ke jalan yang betul. Iaitu, tonton tutorial video pintar di mana perkara yang perlu diterangkan langkah demi langkah, daripada mudah kepada kompleks. Jika anda menonton pelajaran yang tidak berstruktur mengikut format ini, kemungkinan besar anda tidak akan memahami kebanyakan bahan.

Nasib baik, di laman web kami semua pelajaran berstruktur dan disusun daripada mudah kepada kompleks. Oleh itu, jika anda belajar html menggunakan pelajaran kami, anda tidak akan menghadapi sebarang masalah untuk menguasai bahan tersebut.

Saya boleh memberi jaminan bahawa CSS lebih menarik untuk dipelajari! Dan dalam beberapa cara ia lebih mudah. Pertama, CSS juga mempunyai beberapa sifat dan peraturan yang mesti anda ingat. Kedua, bahasa ini mempunyai sintaks yang sangat mudah, jadi walaupun pemula tidak akan menghadapi sebarang masalah menulis kod di dalamnya. Ketiga, memandangkan CSS bertanggungjawab untuk penampilan halaman, pada mulanya anda akan gembira kerana anda membuat halaman menjadi merah dan memberikan gambar itu bingkai.

Secara umumnya, pembelajaran css adalah mudah dan menarik, jadi saya syorkan untuk tidak berlengah-lengah dan mulakan serta-merta selepas anda selesai dengan asas-asas html.

Latihan terakhir anda

Akhirnya, anda mempunyai peperiksaan. Tetapi jangan risau, ia tidak akan menjadi sukar. Selain itu, anda tidak perlu melakukannya sendiri, tetapi hanya mengikut arahan yang terdapat dalam pelajaran. Peperiksaan ini adalah kursus. Di dalamnya anda akhirnya akan mencapai matlamat perantaraan utama - anda akan mereka bentuk laman web pertama anda dan memperoleh pemahaman tentang cara menggunakan html dan css dalam pembinaan laman web sebenar. Walaupun ia adalah tapak yang mudah, pengetahuan yang anda perolehi sudah cukup untuk berkembang lebih jauh dan mencipta reka letak yang lebih kompleks.

Artikel ini tidak berpura-pura panduan menyeluruh Bahasa penanda dokumen HTML. Ia merangkumi asas HTML - prinsip asas, konsep dan definisi teknologi ini, setelah menguasai yang mana, anda boleh dengan mudah meneruskan dalam kajian pengekodan HTML.

Untuk mempelajari pelajaran, muat turun arkib dengan fail yang diperlukan.

HTML ialah bahasa penanda dokumen. Sebutan yang betul ialah HTT.

Adakah anda mungkin pernah bekerja dalam editor dokumen Word atau aplikasi pejabat yang serupa? Anda mungkin tahu bahawa jenis editor ini mempunyai keupayaan yang kaya untuk mengedit teks, menyusun elemen, memasukkan gambar, dsb.

Mengapa, anda mungkin bertanya, menulis tentang pemproses perkataan dalam artikel tentang HTML? Tapi kenapa. Jika anda memikirkannya, apakah itu editor pejabat? Ini adalah aplikasi untuk mengedit dan memaparkan dokumen.

Kata kunci di sini ialah dokumen. Iaitu, kami mencipta, mengedit dan melihat dokumen dalam beberapa program, dalam kes ini - dalam editor pejabat. Jika kita membuka dokumen sedemikian dalam editor teks mudah, sebagai contoh, Notepad, kita akan melihat banyak simbol dan tanda pelik. Kekacauan simbol ini tidak dapat difahami oleh manusia, tetapi boleh difahami oleh komputer. Terima kasih kepada bahasa dalaman ini, Dokumen perkataan memperoleh struktur dan penampilan tertentu dalam editor itu sendiri, dan dokumen itu muncul di hadapan kita dalam segala kemuliaannya dengan teks dan gambar yang diformat sebagai gantinya.

HTML ialah bahasa penanda dokumen untuk penyemak imbas. Word ialah penyemak imbas di sini, dan dokumen ialah halaman HTML. Ini adalah asasnya teknologi HTML, pemahaman yang diperlukan untuk tidak mengelirukan bahasa penanda dokumen web dengan bahasa pengaturcaraan. Nama itu bercakap untuk dirinya sendiri - menggunakan HTML kami menanda, di mana pada halaman elemen, gambar atau teks akan ditunjukkan, dan dalam susunan apa ia akan muncul bersebelahan antara satu sama lain.

Ya, menaip dan memformat teks yang mudah dalam aplikasi pejabat tidak ada kaitan dengan pengaturcaraan. Tetapi pembaca yang teliti akan melihat butiran penting - dalam pemproses perkataan Kami menaip, mengedit dan memformat teks dan gambar menggunakan butang dan menu visual, tetapi mengapa kod HTML ditulis dengan tangan? Mengapa mempelajari begitu banyak butiran teknikal menulis markup untuk dokumen?

Sebenarnya, terdapat banyak editor yang boleh anda gunakan untuk mencipta dan mengedit halaman HTML, sama seperti Word. Iaitu, kod HTML sumber disembunyikan untuk kami dan kami tidak memasukinya.

Sejenis Word untuk HTML. begitu penyunting visual dipanggil:

WYSIWYG editor - W hat Y ou S ee I s W hat Y ou G et. Iaitu, jika kita menterjemahkannya ke dalam bahasa Rusia: apa yang kita lihat adalah apa yang kita dapat.

Saya memanggil mereka "wuzivoogies". Walaupun ini secara fonetik tidak betul, ia jelas menunjukkan ketiadaan makna ciptaan ini. Pemula sangat kerap menggunakan editor sedemikian untuk mencipta tapak web pertama mereka. Sudah tentu, ini mudah - anda tidak perlu menyelidiki kajian tag, gaya reka bentuk dan lain-lain, pada pandangan pertama, perkara yang tidak menyenangkan dan kompleks. Editor itu sendiri secara automatik menukar tindakan kami kepada kod HTML.

Tetapi, seperti yang mereka katakan, tiada apa yang berlaku. Lebih khusus lagi, pendekatan ini mempunyai kelemahan yang sangat serius. Perkara yang menghalang semua orang daripada menggunakan editor visual reka bentuk HTML muka surat? Hakikatnya ialah halaman yang dibentuk dengan cara ini biasanya mempunyai banyak kod yang tidak diperlukan dan banyak ralat dari sudut semantik. Kini, sudah tentu, tiada masalah dengan sambungan Internet berkelajuan tinggi dan perbezaan dalam saiz halaman 400 kb dan 100 kb tidak penting untuk kelajuan, bagaimanapun, kod HTML yang dioptimumkan dan ditulis dengan betul menghapuskan banyak masalah dan memberikan banyak kelebihan, iaitu:

  • Kod HTML yang cekap mempunyai kesan positif pada pengoptimuman enjin carian dan kelajuan merangkak robot carian tapak. Kilobait kod yang dijana oleh vuzivuga tidak boleh diterima malah berbahaya;
  • Kod HTML yang dihasilkan oleh editor WYSIWYG mempunyai banyak kesilapan semantik. Iaitu, tag yang dihasilkan oleh editor sedemikian digunakan untuk tujuan lain, di mana ia perlu digunakan, sebagai contoh, senarai
      , editor akan menjana teg lain yang kami tidak perlukan. Bergantung, sudah tentu, pada editor, tetapi di sini kami maksudkan penyelesaian yang kompleks untuk membuat tapak web, bukan penyuntingan mudah teks dalam kawasan teks menggunakan WYSIWYG.
    • Banyak tag yang tidak perlu dihasilkan dan struktur dokumen menjadi kembung. Katakan anda memindahkan elemen dalam program sedemikian, pertama ke kanan, kemudian ke kiri, kemudian di tengah - setiap tindakan meninggalkan jejak dalam HTML asal kod. Editor ialah program dan ia tidak dapat mengetahui apa sebenarnya yang anda ingin dapatkan sebagai hasilnya; ia menghasilkan banyak kod dengan mengambil kira segala-galanya pilihan yang mungkin tingkah laku dokumen dalam penyemak imbas.
    • Sebagai peraturan, editor untuk reka bentuk visual kod HTML dengan cepat menjadi ketinggalan zaman. Dan disebabkan oleh kekurangan minat di pihak profesional, mereka secara amnya kehilangan sokongan dan berhenti membangun. Dan HTML sedang berkembang. Semuanya berkembang kecuali wuzivoogi. Sehubungan itu, mereka tidak boleh menjana kod yang betul dan moden yang akan menggunakan ciri dan penyelesaian baharu.
    • Untuk menyokong dan membangunkan projek sedemikian adalah hukuman syurga. Tidak boleh bercakap sama sekali tentang menggunakan corak dan menggunakan semula kod.

    Jadi, kami akan menulis HTML hanya dengan pen. Alat yang mencukupi untuk visual penyuntingan HTML Mereka belum lagi dicipta, dan mereka tidak mungkin muncul. Bahasa penanda HTML mudah dipelajari dan difahami serta alat automasi menulis HTML Terdapat banyak kod, tetapi lebih banyak tentang itu dalam pelajaran lain.

    Selepas bermain-main sedikit dengan editor WYSIWYG, guru HTML muda meninggalkan tugas sia-sia ini dan meneruskan.

    Struktur Dokumen HTML

    Untuk kelas, saya mengesyorkan memuat turun dan memasang editor Teks Sublime. Saya sangat mengesyorkan agar tidak menggunakan Windows Notepad terbina dalam untuk susun atur HTML jika anda tidak mahu memecahkan jiwa anda pada peringkat awal pembelajaran HTML.

    Kami memutuskan bahawa kod dokumen HTML Kami akan menulisnya dengan tangan, iaitu, kami akan menaipnya. Susun Atur HTML - proses Penciptaan HTML dokumen. Dalam orang biasa dan kalangan berpengetahuan, ia hanyalah reka letak. Mana-mana dokumen mempunyai struktur dan peraturan pembinaan tertentu. Apakah elemen yang terdiri daripada kod, apakah struktur HTML?

    Mari buat templat awal pada komputer - fail index.html, bukanya menggunakan editor dan tampal kod berikut ke dalamnya:

    Badan Dokumen Pengepala Sila ambil perhatian bahawa dokumen HTML mempunyai sambungan .html.

    Jadi, mengikut urutan dari contoh.

    - jenis dokumen (doctype)

    Pembinaan ini sentiasa ditunjukkan pada permulaan dokumen supaya penyemak imbas dengan betul "memahami" versi HTML yang digunakan semasa membina dokumen.

    Disebabkan oleh fakta bahawa HTML sentiasa berkembang, ia mempunyai beberapa versi, seperti mana-mana produk perisian. Versi terkini HTML ialah yang kelima dan doctype yang diberikan dalam contoh adalah semasa.

    Pada dasarnya, tidak ada gunanya mendalami kajian jenis dokumen, kerana dengan keluaran HTML5 reka bentuk ini telah menjadi standard. Hanya masukkannya pada permulaan dokumen setiap kali anda mula membuat reka letak tapak web.

    - permulaan dokumen

    Teg pertama yang kita lihat selepas doctype ialah .

    Teg HTML ialah unit struktur penanda dokumen HTML. Kod HTML terdiri daripada blok binaan yang dipanggil tag. Setiap teg mempunyai fungsinya sendiri, dan mempelajari bahasa penanda HTML pada akhirnya adalah tentang mempelajari teg dan sifatnya dalam dokumen.

    Saya ingin ambil perhatian bahawa mempelajari HTML tidaklah sesukar yang kelihatan pada pandangan pertama. Mempelajari teg yang digunakan dalam penanda dokumen tidak begitu mudah. tekanan yang besar pada otak.

    Jadi, penanda dokumen bermula dengan tag dan berakhir dengan tag penutup. Setiap teg yang mengandungi teg atau elemen lain mesti ditutup dengan teg penutup. Contohnya, , , , dsb.

    Teg adalah wajib kerana ia mengandungi keseluruhan struktur dokumen dan merupakan pembalut untuk elemen lain.

    Tag

    Seterusnya, kita melihat teg, yang mengandungi elemen lain yang belum jelas kepada kita. Mengandungi elemen lain - ini bermakna elemen atau teg berada di antara teg pembukaan dan penutup binaan:

    kandungan atau tag lain

    Tujuan teg adalah untuk menyimpan maklumat meta dokumen HTML, iaitu maklumat yang tidak dipaparkan dalam dokumen itu sendiri, tetapi penting dan sebahagian besarnya menentukan bagaimana dokumen itu akan kelihatan dan berkelakuan.
    Teg ini diperlukan dalam dokumen.

    Tag - tajuk dokumen Tajuk

    Tajuknya ialah tag yang diperlukan, mengandungi metamaklumat tekstual yang dipaparkan dalam pelayar atau tajuk tab. Tag mestilah dalam . Selain itu, kandungan tag ini digunakan oleh enjin carian untuk memaparkan dokumen dalam hasil carian.

    Tag meta

    Teg meta ialah teg khusus yang direka untuk menyediakan data berstruktur tentang halaman. Tag meta paling kerap digunakan dalam . Tag meta adalah pilihan dalam struktur HTML dokumen.

    Favicon

    Melampirkan fail dengan imej favicon pada dokumen. Favicon ialah ikon kecil yang dipaparkan bersebelahan dengan tajuk dokumen dalam tab penyemak imbas. Favicon ialah fail grafik, 16 x 16 (atau 32 x 32) piksel dalam saiz, yang boleh mempunyai pelbagai format, seperti png, jpg, ico, gif. Format ico digunakan secara tradisional. Favicon animasi ialah fail gif yang mengandungi animasi. Anda boleh melihat favicon animasi, sebagai contoh, pada VKontakte, apabila mesej baharu tiba.

    Gaya dokumen CSS

    Bersambung ke dokumen CSS Fail penggayaan HTML.

    CSS- melata gaya dokumen HTML. Setiap teg yang terletak dalam teg mempunyai satu set sifat, seperti warna, lebar, ketinggian, kedudukan berbanding dengan elemen lain. Semua sifat ini ialah gaya CSS yang boleh dieksport ke fail luaran. Reka bentuk menghubungkan fail luaran ke dokumen HTML, termasuk gaya CSS.

    Nota: Harta href bagi sesuatu konstruk menentukan lokasi fail luaran. Dalam contoh kami, fail style.css Dan favicon.ico, terletak dalam folder yang sama dengan fail index.html. tidak mempunyai tag penutup.

    Tag

    Teg mengandungi kod atau pautan ke fail JavaScript dan paling kerap digunakan di dalam teg, walaupun alat pengoptimuman kelajuan memuatkan halaman Google mengesyorkan menggunakan teg ini pada penghujung dokumen, sebelum teg penutup.

    Dalam contoh kami, fail luaran disambungkan script.js, yang terletak dalam folder yang sama dengan fail index.html utama.

    Jadi, kawan-kawan, kami telah melihat elemen utama yang paling kerap digunakan dalam tag. Selain elemen ini, terdapat beberapa elemen lain yang lebih khusus dan pilihan.

    Badan aka badan

    Di sinilah semua perkara yang menyeronokkan dan ketara bermula dalam susun atur HTML dokumen.

    Mari teruskan terus ke susun atur bahagian halaman yang kelihatan. Semua yang kami tulis dan susun atur di dalam teg akan dipaparkan dalam penyemak imbas. Mari buka fail kami index.html dalam penyemak imbas untuk melihat dengan jelas apa yang kami lakukan dalam editor.

    Tag boleh mengandungi sebarang tag HTML perlu untuk menyediakan dokumen dan memastikan kefungsiannya (bentuk). Saya akan menyediakan jadual tag yang paling banyak digunakan dan menerangkan secara ringkas setiap satu. Anda boleh segera menjalankan contoh yang diberikan dalam editor.

    Tag Penerangan
    Teg untuk membuat pautan dalam dokumen.
    Contoh: teks pautan Atribut href menentukan dokumen yang akan dibawa oleh pautan.
    , Membuat teks huruf condong atau tebal (ditekankan).
    Contoh: teks condong teks tebal (ditekankan).
    , , , , , Tajuk dokumen. Terdapat 6 peringkat tajuk secara keseluruhan, tetapi dalam praktiknya hanya h1 hingga h4 digunakan. Perlu ada hanya satu tajuk dalam dokumen, diserlahkan dengan tag h1, sebagai tajuk utama dokumen.
    Contoh: Tajuk peringkat pertama Tajuk peringkat kedua Tajuk peringkat ketiga... dsb.
    ,
    Senarai dokumen. Ia adalah senarai bernombor atau bulet. Elemen senarai sedemikian ialah tag

  • Contoh:
  • Item senarai bernombor 1
  • Item senarai bernombor 2
  • Perenggan. Teg ini mentakrifkan perenggan teks yang diasingkan daripada perenggan lain. Adalah sangat disyorkan untuk menutup tag ini.
    Contoh:

    Penampilan penanda HTML sebahagian besarnya ditentukan oleh gaya CSS.

    Walau bagaimanapun, sesetengah juruweb memilih untuk tidak menggunakan gaya pada peringkat awal sesuatu projek.

    Gambar. Menggunakan tag ini, anda boleh memasukkan gambar ke dalam penanda HTML. Pastikan anda memasukkan teks alternatif untuk semua imej - atribut "alt". Tag ini ditutup sendiri.
    Contoh:
    + + Borang dan elemen input.
    Borang direka bentuk untuk memasukkan maklumat ke dalam sistem pada pelayan. Lebih kurang Maklum balas pengguna dan tapak. Sebagai contoh, borang digunakan apabila anda perlu menghantar beberapa mesej kepada pelayan. Di samping itu, borang boleh melaksanakan fungsi lain, tetapi tugas utama adalah untuk menghantar data ke pelayan.
    Contoh - bentuk mudah menghantar mesej di mana pengguna tapak menunjukkan namanya, E-mel dan beberapa teks: Teks mesej
    Mentakrifkan subrentetan dalam rentetan.
    Digunakan untuk menggayakan sebahagian daripada garisan menggunakan CSS. Salah satu tag yang paling kerap digunakan. Tanpa reka bentuk, ia tidak menampakkan dirinya dalam sebarang cara dalam penyemak imbas.
    Contoh: Pembelajaran HTML, dalam kebanyakan kes, tidak menyebabkan sebarang kesulitan untuk pemula.
    , Teg direka untuk memasukkan video dan audio ke dalam dokumen. Tag penutup diperlukan.
    Contoh: Parameter kawalan memberitahu kami bahawa halaman harus memaparkan kawalan kandungan media, sama seperti pemain audio/video biasa.
    Benar-benar tag diraja. Tag yang paling banyak digunakan dan popular di Penanda HTML muka surat. Ini ialah elemen blok yang direka untuk mengurus blok di tapak. Konsep susun atur "indah" sering digunakan - ini bermakna semua blok di tapak dibentangkan menggunakan tag ini. Mungkin mengandungi tag lain.
    Contoh: Teks dalam blok bersarang Semua elemen, dalam kebanyakan kes, dihiasi dengan sifat gaya CSS. Tag penutup diperlukan.
    Teg ini memuatkan halaman luaran ke dalam dokumen.
    Contoh:

    Kami tidak mempertimbangkan semua teg, dan ini tidak perlu pada peringkat ini. Perkara utama ialah memahami idea asas HTML, belajar cara menggunakan tag yang dibentangkan di atas, dan kemudian teruskan.

    Sila ambil perhatian bahawa semua nama dalam fail yang disertakan mesti ditulis dalam aksara Latin, tanpa ruang.

    Sebagai contoh, jangan:

    Ini diperlukan untuk keserasian kandungan halaman yang lebih baik. Di samping itu, piawaian untuk menulis kod HTML menentukan.

    Jadi, sekarang kita tahu beberapa asas HTML: struktur apa yang perlu ada pada dokumen HTML biasa, kita tahu beberapa teg paling popular, sudah tiba masanya untuk pergi ke bahagian yang paling lazat - iaitu kuki.

    Tugasan praktikal mengenai reka letak HTML

    Jika anda belum memuat turun arkib dengan contoh lagi, lakukannya. Sebagai contoh, anda boleh melihat fail example.html, yang turut terdapat dalam arkib.

  • Buka pembungkusan arkib dan buat fail index.html dalam folder dengan fail yang tidak dibungkus. Buka fail yang dibuat menggunakan editor teks Sublime Text;
  • Buat struktur dokumen awal dengan doctype, tag yang mengandungi dan dan teruskan untuk mengedit kandungan tag;
  • Buka fail readme.txt dan lengkapkan tugasan yang sesuai dalam fail index.html yang anda buat. Untuk menyemak keputusan, buka index.html dalam penyemak imbas kegemaran anda.
  • Ini menyimpulkan pelajaran tentang asas HTML, dalam pelajaran seterusnya "Asas CSS" kita akan belajar cara mengurus gaya elemen dokumen, mengenali helaian gaya berlatarkan, belajar cara menggunakan kelas gaya dan menjadikan reka letak kita cantik dan berwarna-warni .

    Jumpa lagi kawan-kawan!

    Hello kawan-kawan!

    Saya ingin memberitahu anda sumber dan kursus dalam talian yang saya gunakan untuk mempelajari HTML dan CSS. Dengan tutorial ini, anda akan dengan cepat dan mudah menguasai HTML dan CSS dari awal ke tahap yang sangat maju.

    HTML, CSS untuk pemula dari awal dan banyak lagi.

    Ingat, dalam artikel terakhir saya telah mengatakan bahawa saya tidak lama lagi akan memberitahu anda tentang semua sumber, tapak, perkhidmatan, kursus yang saya anggap berguna dan berkesan untuk Latihan HTML dan CSS? Masa ini telah tiba, hari ini saya akan memberitahu anda apa yang saya gunakan dan di mana saya terus bekerja pada masa ini.

    Apa yang saya akan bincangkan telah diuji pada saya pengalaman peribadi dan saya menjamin kualitinya. Jika anda menggunakan cadangan saya, masa anda tidak akan sia-sia.

    Saya akan menganggap bahawa anda sekurang-kurangnya masuk garis besar umum anda tahu apa itu HTML dan CSS, perkara yang boleh anda lakukan dengannya, dan mengapa anda memerlukan semua ini. Keberkesanan cadangan saya dan latihan anda akan bergantung pada sejauh mana anda sudah menguasai disiplin ini, matlamat yang anda tetapkan untuk diri sendiri dan tahap penguasaan yang anda rancang untuk capai.

    Dalam artikel ini saya akan memberi tumpuan kepada pemula, kepada mereka yang baru mengambil langkah pertama dalam mempelajari HTML dan CSS; ia adalah untuk mereka bahawa nasihat saya akan paling relevan. Selepas melalui peringkat-peringkat ini, anda pasti akan faham sama ada anda berminat untuk melanjutkan pelajaran dan meningkatkan kemahiran anda. Jika ya, teruskan mengkaji dan memahami semua kehalusan dan kemungkinan baharu.

    Saya sendiri kini berada di peringkat ini, mengambil kursus dan pelajaran lanjutan secara beransur-ansur, mengkaji keupayaan HTML5 dan CSS3. Pada masa yang sama, saya mendapat keseronokan daripada kelas, serta dari perasaan fleksibiliti, peluang besar dan idea-idea baru yang lahir dalam proses yang menarik ini.

    Perjalanan saya dalam mempelajari HTML dan CSS

    Perkenalan pertama saya dengan HTML dan CSS berlaku semasa tahun pertama saya di institut (walaupun saya mula berminat dalam pengaturcaraan), kemudian saya faham apa yang masing-masing bertanggungjawab. Pada masa itu, masih biasa untuk menggunakan gaya terbina dalam secara aktif dan membina grid halaman menggunakan jadual. Hanya sebilangan kecil yang beralih kepada div, yang saya tidak tahu apa-apa pada masa itu dan tidak mementingkan perkara ini.

    Setelah memahami perkara asas, saya hidup dengan pengetahuan yang tidak lengkap dan ketinggalan zaman ini untuk masa yang lama. Saya cuba mencipta halaman saya sendiri dan menambah gaya padanya. Baru-baru ini saya, akibatnya reka bentuk juga berubah.

    Dan kemudian, selepas menggali kod selama beberapa hari, saya menyedari betapa terhad dan tidak mencukupi pengetahuan saya. Ia seperti rangka kerja yang tidak kelihatan di mana anda meletakkan diri anda dan hidup di dalamnya, membiasakan diri dengan keadaan ini. Tidak ada kebebasan untuk merealisasikan idea atau pemikiran kreatif.

    Terdapat soalan yang tidak berkesudahan: "bagaimana untuk melakukan ini dan tidak merosakkan segala-galanya?", yang saya selesaikan. Saya tidak ingat bahawa pemikiran saya berlarutan untuk masa yang lama mengenai soalan seperti ini: "adakah betul untuk melakukan ini dalam situasi ini dan adakah saya tidak mencipta semula roda kedua dengan tangan saya yang tidak cekap?"

    Tiba masanya apabila keadaan ini tidak lagi sesuai dengan saya, dan saya memutuskan untuk akhirnya mengawal keadaan. Pada penghujung tahun, idea ini muncul pada halaman artikel tentang. Tetapi kini rancangan ini sedang dilaksanakan, dan saya hanya boleh berfikir: "apa yang menghalang saya, dan mengapa saya tidak melakukan ini lebih awal?" Ia serupa dengan cara saya baru-baru ini menguasai dan kini berjaya menangkap pemikiran dalam bentuk ayat.

    Bagaimana untuk belajar HTML dan CSS dari awal?

    Sekali lagi, saya ulangi bahawa sentiasa ada beberapa pilihan untuk mencapai matlamat. Saya akan menerangkan pengalaman saya, kerana... Saya rasa ia cukup bagus untuk dibincangkan.

    Peringkat pembelajaran HTML dan CSS

    Ia paling mudah untuk memecahkan keseluruhan proses kepada berperingkat:

    • Memperkenalkan HTML dan mempelajari asasnya
    • Memperkenalkan CSS dan menguasai konsep asas
    • Tahap maju. Mempelajari HTML5 dan CSS3

    Ia diketahui umum dan kita semua telah mengujinya berkali-kali bahawa pengulangan perlu untuk menghafal. Tetapi supaya proses itu tidak membosankan, kita tidak akan mengulangi perkara yang sama berulang kali. Sebaliknya kita akan merujuk kepada sumber yang berbeza pada setiap peringkat, sekali gus meluaskan pengetahuan dan pemahaman kita.

    Dan walaupun di suatu tempat salah satu momen kelihatan tidak jelas sepenuhnya, di tempat lain anda akan menutup semua titik buta, berasa yakin dan boleh meneruskan dengan mudah.

    Dengan mematuhi pelan ini, anda secara beransur-ansur akan menjadi biasa dengan teknologi, mudah mengingati segala-galanya dalam amalan, akibatnya anda akan menjadi pakar yang sangat kuat dalam HTML dan CSS, anda akan mengetahui teknologi baharu HTML5, CSS3, serta yang terbaik dan pendekatan moden dalam susun atur halaman.

    Tutorial HTML dan CSS terbaik

    Dan berikut adalah sumber itu sendiri, yang akan saya rujuk dan yang saya galakkan untuk anda gunakan secara aktif:

    • Kursus
    • Kursus Codecademy, HTML & CSS. Kami hanya akan menggunakan pelajaran. Ujian dan Projek di sana dibayar, kita boleh lakukan tanpanya.
    • Akademi HTML. Anda boleh menggunakan kod gabungan saya 1115104d039 untuk mendapatkan diskaun yang baik untuk kursus lanjutan.

    Ia juga harus disebut tentang Sekolah Kod, di mana kualiti tinggi penyampaian bahan, tetapi ia dibayar dan akan mudah hanya untuk mereka yang tahu bahasa Inggeris dengan baik.

    Saya juga ingin menyebut direktori htmlbook.ru, yang sering anda temui pada masa hadapan apabila menggunakan enjin carian.

    Bukan kebetulan bahawa kursus E. Popov berada di tempat pertama. Orang ini akan menjadi panduan anda pada peringkat pertama.

    Saya menganggap Akademi HTML sebagai sekolah terkuat dan paling serius di kalangan sumber bahasa Rusia; di sanalah saya sedang mengikuti kursus lanjutan yang hanya tersedia melalui langganan, tetapi ia tidak mahal sama sekali (300 rubel sebulan) berbanding dengan Sekolah Kod (harga di sana adalah dari 20 hingga 30 dolar bergantung pada promosi). Dengan menggunakan kod gabungan Akademi HTML saya - 1115104d039, anda mendapat diskaun apabila anda melanggan.

    Kami akan beralih kepada Akademi HTML setiap kali selepas kursus Popov dan Codecademy; ini akan membuatkan anda berasa lebih tenang dan lebih yakin apabila menyelesaikan masalah, sesetengah daripadanya agak serius. Tidak semua orang mempunyai saraf besi.

    Rancangan Pengajian untuk Penguasaan Mudah HTML dan CSS

    Saya cadangkan anda berpegang pada rancangan ini. Inilah yang saya lakukan sendiri, saya suka hasilnya dan proses pembelajaran itu sendiri.

  • . Apa yang anda akan pelajari di sana dan bagaimana untuk mendapatkannya, lihat artikel saya.
  • Kursus Codecademy, HTML & CSS. Unit 1, Unit 2, Unit 3
  • Akademi HTML, enam kursus pertama sebelum kursus "Pengenalan kepada CSS", kemudiannya
  • . Lihat artikel saya untuk butiran.
  • Kursus Codecademy, HTML & CSS. Unit 4, Unit 5, Unit 6. Di sinilah kita akan selesai menggunakan Codecademy.
  • Akademi HTML, Bermula dengan kursus "Pengenalan kepada CSS" 5 kursus, berakhir dengan kursus "Merancang teks menggunakan CSS"
  • Kursus: Amalkan HTML5 dan CSS3
  • Akademi HTML, semua baki kursus dari peringkat asas, bermula dengan "Model Dokumen Sekat" dan berakhir dengan kursus "Ujian Akhir". Sesetengah mungkin berfikir bahawa kursus Popov mengenai susun atur harus diambil selepas Akademi HTML (iaitu, menukar dua langkah terakhir). Pandangan ini juga patut dihormati, tetapi nampaknya anda akan mengikuti kursus dari Akademi HTML dengan lebih bertanggungjawab selepas anda menyelesaikan halaman yang dicadangkan oleh Evgeniy sendiri, dan anda akan mengingati segala-galanya dengan lebih baik.
  • Tahap maju. Kami hanya mempunyai sekolah Akademi HTML yang tinggal, di mana anda perlu melalui tahap selanjutnya melalui langganan. Jangan lupa tentang kod gabungan saya, yang saya nyatakan di atas. Kaji "Kursus Lanjutan" dan "Preprocessors". Pada masa penulisan, saya mengambil kursus Kecerunan Linear. Saya bercadang untuk menyelesaikan semua kursus ini hingga tamat.
  • Ini adalah pelan kerja yang digariskan untuk mereka yang ingin belajar memahami HTML dan CSS dengan baik. Ia mungkin kelihatan seperti semua ini sangat panjang dan sukar. Ketakutan, seperti yang anda tahu, mempunyai mata yang besar. Semuanya bermula dengan langkah pertama. Jika anda tidak malas dan rajin belajar pada masa lapang, senarai akan menyusut.

    Tidak dinafikan, saya tidak bercakap tentang sumber lain yang mungkin juga berguna. Jika anda mengenali orang sedemikian, tidak semestinya hanya dalam HTML dan CSS, maka beritahu kami tentang mereka! Alangkah baiknya jika anda meninggalkan maklumat dalam komen.

    Kursus HTML5 dan CSS3, reka letak moden dan reka bentuk web

    Saya memutuskan untuk memberitahu anda tentang beberapa lagi kursus tentang HTML dan CSS, serta topik mengenai reka letak moden, reka bentuk web dan penciptaan laman web. Pelan latihan HTML dan CSS saya, yang saya cadangkan di atas, diuji dan memberi keputusan cemerlang. Tetapi mungkin menyusahkan seseorang untuk melompat melalui sumber yang berbeza; mereka mahu segala-galanya berada di satu tempat. Dalam kes ini, ambil kursus pengarangan profesional dengan pelajaran terperinci, yang saya akan memberitahu anda tentang, akan menjadi lebih menyenangkan dan lebih berkesan.
    Di bawah saya hanya akan memberikan anda senarai kursus latihan, dan anda boleh melihat sendiri siapa yang suka apa.

    • Amalkan asas susun atur penyesuaian dalam HTML5 dan CSS3
    • HTML5 dan CSS3 daripada Sifar kepada Pro
    • Amalan reka letak laman web untuk peranti mudah alih
    • Reka bentuk web: kursus praktikal untuk mencipta halaman pendaratan
    • Pereka web adalah seorang profesional. Mencipta susun atur dalam permintaan
    • Trend Pembangunan Web Moden
    • Semua tentang penciptaan laman web
    • Pelan langkah demi langkah untuk membuat tapak web
    • JavaScript&jQuery dari awal hingga profesional
    • Rahsia SEO praktikal
    • PHP moden: bekerja dengan VKONTAKTE
    • Belajar untuk membuat halaman langganan dan jualan yang cantik dan moden
    • Sekolah blog

    Satu minit lagi. Saya fikir, bagaimana jika topik

    Saya memutuskan untuk memberi lebih perhatian kepada pemula yang ingin menimba ilmu dalam bidang pembinaan laman web. Guru saya mendorong saya untuk melakukan ini, kerana dia membuat banyak kesilapan dalam manual latihan. kerja makmal. Saya berbesar hati untuk melihat sumber dari mana maklumat pendidikan itu diambil, dan meninggalkan beberapa baris pendapat saya di sana. Tetapi itu bukan tentang itu sekarang. Dalam kuliah pertama saya, saya akan bercakap tentang

    Apakah struktur dokumen HTML?

    Teg menunjukkan bahawa struktur dokumen html bermula dan berakhir. Kebanyakan maklumat untuk pelayar dan enjin carian disimpan di antara tag. Tag mengandungi tajuk halaman kami. Teg menunjukkan bahawa maklumat lanjut ditujukan untuk pengguna, dan secara semula jadi menunjukkan bahawa maklumat untuk pengguna berakhir.

    Sekarang biar saya terangkan sedikit. Semua tag ( tag - elemen bahasa penanda hiperteks) dibahagikan kepada dua jenis: "single" dan "closing". Selain itu, tag disertakan dalam aksara berikut< и >, merekalah yang membezakan tag daripada tag biasa teks html. Mari lihat beberapa teg "tunggal" yang paling mudah:


    — teg yang bertanggungjawab untuk memecahkan baris baharu di tempat teg ini dipasang. Mari lihat kod menggunakan tag ini.

    Laman web pertama saya Hello semua!
    Dan ini adalah tapak pertama saya.

    Hasilnya boleh dilihat.

    — tag yang melukis garisan mendatar. Tag ini merujuk kepada elemen blok, baris sentiasa bermula dengan baris baru. Mempunyai 5 sifat:

    • align — Menentukan penjajaran garisan. Boleh ambil nilai kiri, tengah, kanan.
    • warna — Menetapkan warna garisan.
    • noshade - Melukis garisan tanpa kesan 3D.
    • saiz — Menetapkan ketebalan garisan.
    • lebar — Menetapkan lebar garisan.

    Kod menggunakan tag:

    Tapak pertama saya Hello semua! Ini adalah tapak pertama saya.

    Contoh visual boleh didapati di sini.

    Satu lagi teg "tunggal" ialah . Teg ini digunakan untuk menyimpan maklumat yang dimaksudkan untuk pelayar dan enjin carian. Enjin carian melihat teg meta untuk mendapatkan penerangan tapak, kata kunci dan data lain. Anda dibenarkan menggunakan bilangan meta tag yang tidak terhad, kesemuanya mestilah antara dan . Parameter mana-mana tag meta adalah dalam bentuk "nama=nilai", yang ditentukan oleh kandungan kata kunci, nama atau http-equiv . Kerana tag meta ditujukan untuk mesin, mereka tidak membuat sebarang perubahan visual, jadi saya hanya akan memberikan kod sumber:

    Baris ini menunjukkan bahawa pencipta halaman percaya bahawa halaman itu menggunakan pengekodan UTF-8. Dalam HTML5 semuanya menjadi lebih mudah; untuk menentukan pengekodan, anda hanya perlukan baris berikut:

    Terdapat tag tunggal lain (, ,
    , , , , , , , , , , , , , ), tetapi saya akan memperkenalkan anda kepada mereka sedikit kemudian.

    Sekarang mari kita bercakap tentang teg "menutup". Nama "teg penutup" menunjukkan bahawa teg memerlukan penutupan wajib. Ini dilakukan untuk mengehadkan dengan jelas bahagian teks yang dipengaruhi oleh teg.

    Untuk contoh yang jelas, mari lihat teg, yang digunakan untuk menyerlahkan teks; ia menetapkan fon kepada tebal. Tag ialah sempadan yang menentukan kawasan pemilihan teks. Berikut ialah kod di mana mereka terlupa untuk menutup teg dalam baris terakhir:

    Laman web pertama saya Hello semua! Dan ini adalah tapak pertama saya.
    Hai semua! Dan ini adalah tapak pertama saya.

    Seperti yang anda lihat, tidak ada yang rumit, kini anda boleh membuat beberapa halaman yang dipautkan antara satu sama lain.

    Tag untuk menyerlahkan teks

    Terdapat beberapa cara untuk menyerlahkan teks pada halaman. Ini boleh dilakukan menggunakan gaya, atau anda boleh menggunakan tag. Kami (buat masa ini) berminat dengan pilihan kedua.

    — menetapkan fon kepada tebal.

    — menetapkan gaya fon condong.

    — menambah garis bawah pada teks.

    - bertujuan untuk menekankan teks. Pelayar memaparkan teks ini dalam huruf condong.

    - menconteng teks. Teg ini telah dialih keluar daripada HTML5, adalah disyorkan untuk menggunakannya sebaliknya

    — memaparkan teks sebagai teks monospace. Dialih keluar daripada HTML5.

    — memaparkan fon sebagai superskrip. Fon muncul di atas garis dasar teks dan pada saiz yang lebih kecil.

    — memaparkan fon sebagai subskrip. Teks diletakkan di bawah garis dasar aksara yang tinggal dalam baris dan dikecilkan saiznya.

    - bertujuan untuk menekankan teks. Pelayar memaparkan teks ini dalam huruf tebal.

    - mengurangkan saiz fon sebanyak satu berbanding dengan dalam teks biasa. DALAM saiz HTML fon diukur dalam unit konvensional daripada 1 hingga 7, saiz teks purata yang digunakan secara lalai ialah 3. Teg mengurangkan teks dengan satu unit konvensional. Teg bersarang dibenarkan dan saiz fon akan lebih kecil sebanyak 1 dengan setiap tahap bersarang, tetapi tidak boleh kurang daripada 1.

    — meningkatkan saiz fon sebanyak satu berbanding dengan teks biasa. Dalam HTML, saiz fon diukur dalam unit dari 1 hingga 7, saiz teks lalai purata ialah 3. Oleh itu, menambah teg meningkatkan teks sebanyak satu unit. Teg bersarang dibenarkan dan saiz fon akan lebih besar dengan setiap peringkat.

    — digunakan untuk menyerlahkan petikan dalam teks. Kandungan bekas dipaparkan secara automatik dalam pelayar dalam tanda petikan.

    — direka untuk menyerlahkan petikan panjang dalam dokumen. Teks yang ditandakan dengan teg ini secara tradisinya dipaparkan sebagai blok yang dijajarkan dengan padding di sebelah kiri dan kanan (kira-kira 40 piksel), serta padding di bahagian atas dan bawah.

    — mentakrifkan blok teks pra-format. Teks sedemikian biasanya dipaparkan dalam fon monospace dan dengan semua ruang antara perkataan. Secara lalai, sebarang bilangan ruang dalam kod berturut-turut ditunjukkan sebagai satu pada halaman web. Tag Membolehkan anda memintas ciri ini dan memaparkan teks seperti yang diperlukan oleh pembangun.

    - mentakrifkan perenggan teks. Tag

    Ia adalah elemen blok, sentiasa bermula pada baris baharu, perenggan teks yang mengikuti satu sama lain dipisahkan dengan pelapik. Jumlah padding boleh dikawal menggunakan gaya. Jika tiada teg penutup, penghujung perenggan dianggap bertepatan dengan permulaan elemen blok seterusnya.

    .... - HTML menawarkan enam tajuk tahap yang berbeza, yang menunjukkan kepentingan relatif bahagian selepas tajuk. Oleh itu, teg mewakili tajuk tahap pertama yang paling penting, dan teg berfungsi untuk menunjukkan tajuk tahap keenam dan merupakan yang paling tidak penting. Secara lalai, tajuk tahap pertama dipaparkan dalam fon tebal terbesar, dan tajuk tahap berikutnya bersaiz lebih kecil. Teg ,..., rujuk pada elemen blok, ia sentiasa bermula pada baris baharu, dan selepasnya elemen lain dipaparkan pada baris seterusnya. Selain itu, ruang putih ditambah sebelum dan selepas tajuk. Teg mempunyai atribut penjajaran, yang menentukan penjajaran tajuk; ia boleh mengambil nilai berikut: kiri - tajuk dijajar kiri, tengah - dijajarkan di tengah, kanan - dijajarkan ke kanan, justify - dibenarkan (kedua-dua kanan dan kiri) . Nilai ini hanya berfungsi untuk pengepala yang lebih panjang daripada satu baris.

    — ialah bekas untuk menukar ciri fon, seperti saiz, warna dan muka taip. Walaupun teg ini masih disokong oleh semua penyemak imbas, ia dianggap usang dan penggunaannya disyorkan untuk ditinggalkan demi gaya. Teg mempunyai 3 atribut: warna — menetapkan warna teks, muka — menentukan muka taip fon, saiz — menetapkan saiz fon dalam unit konvensional.

    — menandakan teks sebagai petikan atau nota kaki kepada bahan lain. Sorotan ini berguna untuk menukar gaya teks melalui CSS, dan juga digunakan untuk memisahkan kod HTML kepada elemen struktur. Penyemak imbas biasanya menetapkan teks di dalam bekas menjadi condong.

    — menunjukkan bahawa urutan aksara ialah singkatan. Dengan menggunakan atribut tajuk penyahkodan singkatan diberikan, yang membolehkan orang yang tidak biasa dengannya memahami singkatan itu. Di samping itu, enjin carian mengindeks versi teks penuh singkatan, yang boleh digunakan untuk meningkatkan kedudukan dokumen.

    Secara lalai, teks yang disertakan dalam bekas digariskan dengan garis putus-putus.

    Di bawah ialah kod yang saya gunakan semua tag ini:

    tapak pertama saya

    HTML dan CSS ialah dua daripada teknologi teras untuk membina halaman Web. HTML menyediakan struktur halaman, CSS reka letak (visual dan aural), untuk pelbagai peranti. Bersama-sama dengan grafik dan skrip, HTML dan CSS adalah asas untuk membina halaman Web dan Aplikasi Web. Ketahui lebih lanjut di bawah tentang:

    Apakah HTML?

    HTML ialah bahasa untuk menerangkan struktur laman web. HTML memberi pengarang cara untuk:

    Terbitkan dokumen dalam talian dengan tajuk, teks, jadual, senarai, foto, dsb.
    Dapatkan maklumat dalam talian melalui pautan hiperteks, dengan mengklik butang.
    Reka bentuk borang untuk menjalankan transaksi dengan perkhidmatan jauh, untuk digunakan dalam carian untuk pengetahuan, membuat tempahan, memesan produk, dsb.
    Sertakan hamparan, klip video, klip bunyi dan aplikasi lain secara langsung dalam dokumen mereka.
    Dengan HTML, pengarang menerangkan struktur halaman menggunakan markup. Unsur-unsur bahasa melabelkan kepingan kandungan seperti “perenggan,” “senarai,” “jadual,” dan sebagainya. Apakah XHTML?

    XHTML ialah a varian HTML yang menggunakan sintaks XML, Extensible Bahasa penanda. XHTML mempunyai semua elemen yang sama (untuk perenggan, dll.) sebagai varian HTML, tetapi sintaksnya berbeza sedikit. Oleh kerana XHTML ialah aplikasi XML, anda boleh menggunakan alatan XML lain dengannya (seperti XSLT, bahasa untuk mengubah kandungan XML).

    Apakah CSS?

    CSS ialah bahasa untuk menerangkan persembahan halaman Web, termasuk warna, reka letak dan fon. Ia membolehkan untuk menyesuaikan pembentangan kepada pelbagai jenis peranti, seperti skrin besar, skrin kecil atau pencetak. CSS adalah bebas daripada HTML dan boleh digunakan dengan mana-mana bahasa penanda berasaskan XML. Pemisahan HTML daripada CSS menjadikannya lebih mudah untuk mengekalkan tapak, berkongsi helaian gaya merentas halaman dan menyesuaikan halaman dengan persekitaran yang berbeza. Ini dirujuk sebagai pemisahan struktur (atau: kandungan) daripada pembentangan.

    Apakah WebFonts? WebFonts ialah teknologi yang membolehkan orang ramai menggunakan fon atas permintaan melalui Web tanpa memerlukan pemasangan dalam sistem operasi. W3C mempunyai pengalaman dalam fon yang boleh dimuat turun melalui HTML, CSS2 dan SVG. Sehingga baru-baru ini, fon yang boleh dimuat turun bukanlah perkara biasa di Web kerana kekurangan format fon yang boleh dikendalikan. Usaha WebFonts merancang untuk menanganinya melalui penciptaan format fon terbuka yang disokong industri untuk Web (dipanggil "WOFF").

    Kuliah telah sampai ke penghujungnya, semoga ilmu yang diperolehi berguna kepada anda! Dalam kuliah seterusnya, saya akan memberitahu anda apa yang disimpan oleh tag, kita akan belajar cara melakukan semua jenis manipulasi dengan imej, dan berkenalan dengan jadual.

    Semasa menulis artikel ini, penerangan beberapa tag telah diambil dari sini