Asas HTML mengandungi peraturan asas bahasa HTML, penerangan tentang struktur halaman HTML, dan hubungan dalam struktur dokumen HTML antara elemen HTML.

Dokumen HTML ialah dokumen teks biasa yang boleh dibuat sama ada dalam editor teks biasa (Notepad) atau dalam satu khusus dengan penyerlahan kod (Notepad++, Kod Visual Studio, dll.). Dokumen HTML mempunyai sambungan .html.

Dokumen HTML terdiri daripada pokok elemen HTML dan teks. Setiap elemen dikenal pasti dalam dokumen sumber dengan teg permulaan (pembukaan) dan penamat (penutupan) (dengan pengecualian yang jarang berlaku).

Teg permulaan menunjukkan di mana elemen bermula, teg akhir menunjukkan di mana ia berakhir. Tag penutup dibentuk dengan menambahkan garis miring / sebelum nama tag: .... Antara teg permulaan dan penutup ialah kandungan teg - kandungan.

Teg tunggal tidak boleh menyimpan kandungan secara langsung; ia ditulis sebagai nilai atribut, contohnya, teg akan mencipta butang dengan Butang teks di dalamnya.

Teg boleh bersarang di dalam satu sama lain, contohnya,

Teks

. Apabila melabur, anda harus mengikut urutan penutupan (prinsip "matryoshka"), sebagai contoh, entri berikut akan menjadi salah:

Teks

.

Elemen HTML boleh mempunyai atribut (global, digunakan pada semua elemen HTML, dan elemennya sendiri). Atribut ditulis dalam teg pembukaan elemen dan mengandungi nama dan nilai, yang dinyatakan dalam format atribut name="value" . Atribut membolehkan anda menukar sifat dan tingkah laku elemen yang mana ia ditetapkan.

Setiap elemen boleh diberikan berbilang nilai kelas dan hanya satu nilai id. Berbilang nilai kelas ditulis dipisahkan oleh ruang, . Nilai kelas dan id mestilah hanya terdiri daripada huruf, nombor, sempang dan garis bawah, dan mesti bermula dengan huruf atau nombor sahaja.

Penyemak imbas melihat (mentafsir) dokumen HTML, membina strukturnya (DOM) dan memaparkannya mengikut arahan yang disertakan dalam fail ini (helaian gaya, skrip). Jika penanda betul, tetingkap penyemak imbas akan memaparkan halaman HTML yang mengandungi elemen HTML - pengepala, jadual, imej, dsb.

Proses tafsiran (penghuraian) bermula sebelum halaman web dimuatkan sepenuhnya ke dalam pelayar. Pelayar memproses dokumen HTML secara berurutan, dari awal, sambil memproses CSS dan mengaitkan helaian gaya dengan elemen halaman.

Dokumen HTML terdiri daripada dua bahagian - pengepala - antara tag ... dan bahagian kandungan - antara tag ....

Struktur laman web 1. Struktur dokumen HTML

HTML mengikut peraturan yang terkandung dalam fail pengisytiharan jenis dokumen (Definisi Jenis Dokumen, atau DTD). DTD ialah dokumen XML yang mentakrifkan teg, atribut dan nilainya yang sah untuk jenis HTML tertentu. Setiap versi HTML mempunyai DTD sendiri.

DOCTYPE bertanggungjawab untuk paparan yang betul bagi halaman web oleh penyemak imbas. DOCTYPE menentukan bukan sahaja versi HTML (cth. html) tetapi juga fail DTD yang sepadan di Internet.

...

Unsur-unsur di dalam teg membentuk pepohon dokumen, model objek dokumen yang dipanggil, DOM (model objek dokumen). Dalam kes ini, unsur adalah unsur akar.

nasi. 1. Struktur laman web yang paling mudah

Untuk memahami interaksi elemen halaman web, adalah perlu untuk mempertimbangkan apa yang dipanggil "hubungan keluarga" antara elemen. Hubungan antara berbilang elemen bersarang diklasifikasikan sebagai ibu bapa, anak dan kakak.

Moyang ialah unsur yang mengandungi unsur lain. Dalam Rajah 1, moyang bagi semua unsur ialah . Pada masa yang sama, elemen itu ialah nenek moyang semua teg yang terkandung di dalamnya: ,

, , dan lain-lain.

Keturunan ialah unsur yang terletak dalam satu atau lebih jenis unsur. Sebagai contoh, ialah keturunan , dan unsur

Merupakan keturunan kedua-duanya dan .

Elemen induk ialah elemen yang berkaitan dengan elemen lain pada tahap yang lebih rendah dan terletak di atasnya dalam pokok. Dalam Rajah 1 dan . Tag

Adakah ibu bapa hanya untuk .

Elemen kanak-kanak ialah elemen yang berada di bawah secara langsung kepada elemen lain di peringkat yang lebih tinggi. Dalam Rajah 1 hanya terdapat unsur , ,

Dan merupakan anak kepada .

Unsur kakak ialah unsur yang mempunyai unsur induk yang sama dengan unsur yang dimaksudkan, unsur yang dipanggil tahap yang sama. Dalam Rajah 1 dan adalah unsur-unsur tahap yang sama, serta unsur-unsur , dan

Mereka adalah adik beradik antara satu sama lain.

1.1. Elemen 1.2. unsur

Bahagian ... mengandungi maklumat teknikal tentang halaman: tajuk, penerangan, kata kunci untuk enjin carian, pengekodan, dsb. Maklumat yang anda masukkan di sana tidak dipaparkan dalam tetingkap penyemak imbas, tetapi ia mengandungi maklumat yang memberitahu penyemak imbas cara memproses halaman tersebut.

1.2.1. unsur

Teg bahagian yang diperlukan ialah . Teks yang diletakkan di dalam teg ini muncul dalam bar tajuk pelayar web. Tajuk hendaklah tidak lebih daripada 60 aksara panjang untuk dimuatkan sepenuhnya dalam tajuk. Teks tajuk hendaklah mengandungi penerangan paling lengkap tentang kandungan halaman web.

1.2.2. unsur

Teg bahagian pilihan ialah teg tunggal. Dengan bantuannya, anda boleh menetapkan perihalan kandungan halaman dan kata kunci untuk enjin carian, pengarang dokumen HTML dan sifat metadata lain. Satu elemen boleh mengandungi berbilang elemen kerana ia membawa maklumat yang berbeza bergantung pada atribut yang digunakan.

Penerangan kandungan halaman dan kata kunci boleh dinyatakan secara serentak dalam beberapa bahasa, contohnya, dalam bahasa Rusia dan Inggeris:

Menggunakan teg, anda boleh menyekat atau membenarkan pengindeksan halaman web oleh enjin carian:

Untuk memuat semula halaman secara automatik selepas tempoh masa tertentu, anda perlu menggunakan nilai muat semula:

Halaman akan dimuat semula selepas 30 saat. Untuk mengubah hala pelawat ke halaman lain, anda perlu menentukan URL dalam parameter url:

Kawasan tajuk halaman Web. Dengan kata lain, bahagian pertamanya. Sama seperti elemen sebelumnya, HEAD berfungsi hanya untuk membentuk struktur umum dokumen. Elemen ini boleh mempunyai atribut lang dan dir.

< title >

Elemen untuk meletakkan tajuk halaman Web. Baris teks yang terletak di dalam elemen ini tidak muncul dalam dokumen, tetapi dalam bar tajuk tetingkap penyemak imbas. Elemen ini sangat mempengaruhi promosi dalam enjin carian kerana enjin carian memberi perhatian khusus kepada tag TITLE. Nasihat saya: jangan sekali-kali membuat teks yang sangat panjang dalam tag ini ( 65 aksara sudah memadai).

Elemen ini mengandungi maklumat perkhidmatan yang tidak ditunjukkan semasa melihat halaman Web. Tiada teks di dalamnya dalam erti kata biasa, jadi tiada teg hujung. Setiap elemen META mengandungi dua atribut utama, yang pertama mentakrifkan jenis data, dan yang kedua mentakrifkan kandungan.

< body >

Elemen ini menggabungkan hiperteks, yang mentakrifkan halaman Web itu sendiri. Ini ialah bahagian dokumen yang boleh dilihat yang dibangunkan oleh halaman auto dan yang dipaparkan oleh penyemak imbas. Sehubungan itu, tag akhir elemen ini harus ditemui di penghujung halaman Web. Di dalam elemen BODY, anda boleh menggunakan semua elemen yang dimaksudkan untuk reka bentuk halaman Web. Dalam teg permulaan elemen BODY, anda boleh meletakkan banyak atribut yang berfungsi untuk menetapkan keseluruhan halaman. Mari kita lihat mereka dalam susunan.

Salah satu atribut yang paling berguna bagi teg ini, yang mempunyai kesan pada reka bentuk halaman, ialah

background="laluan ke fail latar belakang"

Reka bentuk latar belakang yang lebih ringkas adalah untuk menetapkan warnanya

bgcolor=”#FFFFFF”

Warna latar belakang ditentukan oleh tiga nombor heksadesimal dua digit yang menentukan keamatan warna merah, hijau dan biru (rbg).

Memandangkan anda boleh menukar latar belakang halaman, anda juga boleh menukar warna teks. Untuk tujuan ini terdapat atribut berikut

text="#RRGGBB"

Untuk menetapkan warna teks hiperpautan, gunakan atribut berikut

pautan=”#RRGGBB”

Anda juga boleh menentukan perubahan warna untuk hiperpautan pilihan terakhir pengguna

Elemen pengepala. Terdapat enam peringkat tajuk, yang ditetapkan seperti berikut.
Tajuk
Tajuk
Tajuk
Tajuk
Tajuk
Tajuk

Tajuk Tahap 1 ialah yang terbesar, dan tahap 6 menyediakan tajuk terkecil. Untuk tajuk, anda boleh menggunakan atribut yang menentukan penjajaran kiri, tengah atau kanan:

align=”left” align=”center” align=”right”

Untuk membuat perenggan baharu, gunakan teg

Dan untuk berpindah ke baris baharu tanpa membuat perenggan - tag
iaitu pemindahan berlaku. Tidak perlu menutup tag ini. Sudah tentu, jika anda tidak menggunakan dalam tag

Elemen ALIGN, yang boleh menetapkan penjajaran perenggan:

Dibiarkan

Berpusat

Betul

Teks antara elemen ini dijajarkan dengan lebar

Garis mendatar ( peraturan mendatar) adalah elemen yang sangat biasa. Pertama, kerana ia menjadikannya sangat mudah dan mudah untuk membahagikan halaman kepada beberapa bahagian. Kedua, kerana pengarang halaman mempunyai pilihan elemen reka bentuk yang sangat kecil. Elemen tidak mempunyai tag akhir, tetapi mempunyai beberapa atribut untuk kiri, tengah, kanan, justifikasi:

• align="left"
• align="center"
• align=”kanan”
• align="justify"

Dokumen HTML boleh menjadi sangat menyusahkan, dan tidak begitu mudah untuk pengguna yang perlu bergerak cepat ke bahagian dokumen yang dikehendaki. Untuk melakukan ini, anda boleh menggunakan mekanisme hiperpautan. Untuk melakukan ini, letakkan tanda yang sesuai di tempat yang betul dalam teks.

Teks Percuma

Dalam kes ini, baris dokumen yang diberikan diberi nama, dan oleh itu hiperpautan boleh dibuat ke bahagian lain dokumen, atau malah pada dokumen lain, yang membawa kepada label itu.

Untuk memasukkan imej ( Gambar) dalam dokumen HTML teg berikut digunakan ( memberikan penerangan lengkap tentang atribut tag ini):

Senarai

(senarai) dibangunkan dalam HTML, tidak syak lagi dipengaruhi oleh kejayaan penyunting teks. Senarai berbeza daripada teks biasa, pertama sekali, kerana pengguna tidak perlu memikirkan tentang menomborkan itemnya: HTML mengambil tugas ini. Jika senarai ditambah dengan item baharu atau dipendekkan, penomboran diteruskan secara automatik. Dalam kes senarai tidak bernombor, HTML mendahului setiap item dengan tanda: bulatan, segi empat tepat, berlian dan imej lain. Akhirnya, senarai itu mengambil bentuk yang baik. Terdapat dua kumpulan teg sedemikian: beberapa mentakrifkan rupa umum senarai ( dan membolehkan anda menentukan atribut), manakala yang lain menentukan struktur dalamannya. Anda boleh menggunakan atribut standard dalam senarai. Terdapat beberapa jenis senarai.

Yang paling biasa ialah senarai tidak bernombor ( senarai tidak teratur). Ia dibentangkan di bawah:

• Senaraikan item 1
• Senaraikan item 2
• Senaraikan item 3

Elemen ul ialah sejenis penyerlahan senarai. Ia membolehkan anda memisahkan satu senarai daripada yang lain. Elemen li mewakili setiap item.

Meja

Mereka adalah salah satu cara yang paling diperlukan untuk memformat data pada halaman Web. Kemudahan utama ialah penyemak imbas menjaga lukisan keseluruhan jadual. Saiz bingkai boleh dilaraskan secara automatik kepada saiz tetingkap tontonan penyemak imbas dan, sudah tentu, kepada saiz baris teks dan gambar dalam sel jadual. Sebagai tambahan kepada semua yang lain, jadual membolehkan anda menyelesaikan banyak masalah reka bentuk: menyelaraskan bahagian halaman secara relatif antara satu sama lain, meletakkan gambar dan teks bersebelahan antara satu sama lain, mengurus skema warna dan sebagainya. Apabila membuat jadual, prinsip bersarang digunakan: di dalam elemen jadual utama (JADUAL), beberapa elemen dicipta yang mentakrifkan baris (TR), dan di dalam elemen ini terdapat elemen untuk menerangkan setiap sel dalam baris (TD, TH).

Untuk memahami struktur jadual sedia ada atau membangunkan jadual baharu, terdapat satu peraturan bahawa jujukan elemen menerangkan jadual dari atas ke bawah dan dari kanan ke kiri. Sebagai contoh, jika elemen JADUAL diikuti oleh elemen TR, ini menunjukkan bahawa baris jadual baharu sedang ditakrifkan. Segala-galanya di belakang elemen ini akan diletakkan pada satu baris (dari kanan ke kiri). Ini boleh menjadi urutan elemen TD ( sel), meja lain dan sebagainya. Selepas elemen TR baharu muncul, penerangan bagi baris seterusnya bermula, dan seterusnya sehingga penghujung jadual (tag).
Jadual boleh dijajarkan secara mendatar menggunakan atribut align:

• align="left" - kiri;
• align="center" - di tengah;
• align="right" - ke kanan.

Lebar jadual boleh ditetapkan tepat dalam piksel atau sebagai peratusan lebar halaman dalam tetingkap penyemak imbas. Contohnya: lebar=400 atau lebar=50%

Dua atribut digunakan untuk mengawal penampilan bingkai. Hakikatnya ialah penyemak imbas mencipta imej bingkai, mensimulasikan tiga dimensinya ( cembung) menggunakan perbezaan pencahayaan muka

Senario

Hampir semua tuan web mahu halaman laman web mereka mempunyai rupa moden, berbilang fungsi, cantik dan dinamik. Ini adalah mustahil dengan alat HTML standard, jadi alat yang berbeza digunakan: applet, objek, helaian gaya berlatarkan dan sebagainya. Tetapi jenis yang paling popular dan meluas ( penerimaan) ialah penggunaan skrip.

Skrip ialah kod program yang disertakan sebagai teks sumber dalam halaman dan dilaksanakan oleh penyemak imbas apabila halaman itu dilihat. Skrip boleh ditulis dalam JavaScript, dibangunkan oleh Netscape, atau dalam Skrip Visual Basic ( VBScript), dibangunkan oleh Microsoft.

Teg ini membolehkan anda memisahkan teks program skrip daripada maklumat halaman lain. Teg SCRIPT mesti mengandungi atribut bahasa, yang menentukan bahasa dan boleh mengambil nilai berikut:

• javascript - kod dalam JavaScript;
• vbscript - kod dalam bahasa VBScript.

Atribut jenis juga boleh menunjukkan jenis bahasa, walaupun penggunaannya tidak diperlukan. Untuk tidak melanggar semua peraturan, anda boleh meletakkan definisi berikut di dalam elemen:

type="text/javascript"

Salah satu ciri skrip yang paling hebat ialah keupayaan untuk menukar kandungan halaman hasil daripada pelaksanaan program. Tetapi ini hanya ciri, bukan peraturan. Menggunakan atribut tangguh (yang tidak menerima sebarang nilai) anda boleh "memberitahu" penyemak imbas bahawa perubahan tersebut tidak akan dibuat. Dalam sesetengah kes, ini membolehkan halaman dimuatkan dengan lebih pantas.

Daripada atribut standard, anda boleh menggunakan atribut charset.

tag SCRIPT ( atau beberapa elemen tersebut) boleh terletak sama ada di dalam elemen HEAD atau di dalam elemen BODY. Jika skrip berada di dalam elemen BODY, mungkin juga sesetengah penyemak imbas yang tidak menyokong elemen SCRIPT akan melihat kod program sebagai teks biasa dan memaparkannya pada skrin. Untuk mengelakkan ini daripada berlaku, kod skrip dimasukkan sebagai ulasan:

—
—
—

Semua pelayar moden mengenali teknik ini dan mengabaikan aksara komen. Jika anda perlu memasukkan ulasan dalam teks skrip, maka notasi yang berbeza digunakan untuk ini: dua garis miring // dimasukkan pada permulaan baris.
Kod skrip dilaksanakan apabila halaman dimuatkan, i.e. apabila kandungannya masih kelihatan pada skrin. Di bawah ialah contoh senario paling mudah ( memaparkan mesej dalam tetingkap).

—
—
—
- Hanya skrip
—
- alert("Anda telah menulis skrip pertama anda!")
—
—
—
—

Ia adalah halaman yang mudah, tetapi ia termasuk skrip satu baris. Menggunakan kaedah amaran, mesej dipaparkan sebelum dimuatkan. Dan ia akan digantung sehingga pengguna mengklik butang OK, muat turun tidak akan diteruskan.
Ada kemungkinan halaman itu akan dilihat dalam penyemak imbas yang tidak menyokong skrip; elemen NOSCRIPT disediakan untuk ini. Program tontonan moden mengabaikan kandungannya. Elemen ini boleh digunakan dalam beberapa cara. Sebagai permulaan, anda boleh memaparkan iklan di dalamnya seperti berikut: “ Pelayar anda tidak boleh melaksanakan skrip yang diperlukan untuk melihat halaman web ini!"Kedua, di dalam elemen anda boleh membangunkan versi ringkas halaman, tanpa skrip. Ketiga, anda boleh membuat pautan ke dokumen HTML yang lain. Elemen NOSCRIPT mesti mempunyai tag akhir.

Oleh itu, kami melihat asas-asas bahasa pengaturcaraan WEB seperti HTML. Walaupun selepas membaca artikel pendek ini, anda sudah mempunyai idea, dan juga keupayaan untuk memprogram dalam bahasa ini. Semoga berjaya!

HTML ialah bahasa penanda hiperteks yang menjadikan Internet seperti yang kita tahu dan suka. Berkat alat hebat ini tapak kelihatan cantik dan moden, dan juga memastikan kemudahan penggunaan. HTML hanya menyusun elemen halaman web ke dalam format yang mesra pengguna. Kerjanya setanding dengan apa yang dilakukan oleh orang seperti MS Word atau OpenOffice. Mereka menukar jisim huruf tanpa ciri kepada dokumen yang mengandungi perenggan, teks tebal, condong, jadual dan juga imej. Bahasa HTML melakukan lebih kurang perkara yang sama, dengan satu-satunya perbezaan ialah dokumennya dipaparkan dalam penyemak imbas, dan keupayaan alat ini jauh lebih luas daripada editor teks. Tag digunakan untuk markup - arahan khas yang menerangkan struktur halaman web. Ia disertakan dalam kurungan sudut - supaya penyemak imbas boleh membezakannya daripada sebahagian besar teks. Seterusnya, kami akan membincangkan asas HTML untuk pemula.

Editor visual

Pemula yang baru sahaja memulakan langkah untuk mempelajari HTML selalunya memulakan kerja mereka dengan program yang membolehkan anda membuat tapak web tanpa pengetahuan. Di dalamnya anda boleh mengatur elemen pada skrin dengan cara ia akan dipaparkan dalam penyemak imbas. Nampaknya ini adalah sumber rahmat abadi yang membolehkan anda menyingkirkan majoriti pembangun web. Tetapi tidak semuanya begitu mudah, kerana editor visual mempunyai banyak kekurangan yang menjadikannya mustahil untuk menggunakannya dalam projek yang serius.

Semua program ini mencipta banyak teg yang tidak perlu yang menjadikan halaman akhir sukar digunakan dan tidak optimum. Sudah tentu, pada zaman Internet berkelajuan tinggi kita, ini kurang penting berbanding sebelum ini, tetapi terdapat beberapa sebab mengapa laman web yang ringkas dan ditulis dengan baik ternyata lebih praktikal daripada rakan sejawatannya yang dibuat dalam editor visual. Halaman web yang dibuat dalam program sedemikian akan diproses dengan buruk oleh robot carian, kerana setiap kilobait kod adalah penting bagi mereka, dan kod besar dan tidak logik dengan sekumpulan tidak mungkin sesuai dengan citarasa mereka. Di samping itu, editor sering ketinggalan zaman, menjadi tidak relevan, dan membelanjakan sumber untuk pembangunan mereka adalah tidak praktikal, kerana tiada profesional menggunakan produk ini. Oleh itu, sesiapa yang ingin bekerja dalam industri pembangunan laman web mesti tahu asas HTML.

Tag

Seperti yang dinyatakan di atas, teg menerangkan struktur halaman web kepada penyemak imbas. Kebanyakannya mempunyai tag pembukaan dan penutup, tetapi bukan semua. Sebagai contoh, ..., di mana bukannya titik terdapat kandungan. Yang pertama menunjukkan tempat teg bermula, dan yang kedua menutupnya. Mungkin terdapat elemen penanda halaman lain di dalamnya; ia boleh bersarang di dalam satu sama lain seperti anak patung bersarang. Adalah penting untuk menutup teg tepat pada masanya supaya halaman dipaparkan dengan betul.

Terdapat juga tag tunggal yang tidak perlu ditutup. Di dalamnya, kandungan terletak di dalam, sama seperti ia boleh ditulis untuk kebanyakan teg HTML, dan menetapkan sifat elemen. Ia ditunjukkan dalam teg pembukaan dan kelihatan seperti ini: attribute="...", di mana bukannya titik terdapat nilai atribut. Mengetahui teg ialah langkah pertama dan paling penting untuk menguasai HTML. Asas seni ini juga melibatkan pemahaman struktur halaman web.

Struktur dokumen

Setiap dokumen HTML mempunyai sambungan yang sepadan, contohnya Index.html. Dengan cara ini penyemak imbas boleh memahami perkara yang dihadapinya dan memaparkan halaman dengan betul. Adalah dinasihatkan untuk menyimpan semua fail yang digunakan untuk membuat laman web dalam satu direktori, yang akan menjadikan hidup anda lebih mudah pada masa hadapan. Asas bahasa penanda hiperteks HTML memerlukan pemahaman yang jelas tentang struktur dokumen. Ia bermula dengan teg yang memberitahu pelayar versi HTML yang sedang digunakan dalam dokumen ini. Pada masa ini, versi kelima bahasa adalah relevan, jadi tidak perlu mencipta apa-apa, anda boleh memasukkan teg di atas dengan selamat pada permulaan mana-mana halaman.

Kemudian terdapat struktur berpasangan utama yang membentuk "rangka" tapak. Teg pertama, di mana semua yang lain bersarang, ialah .... Apa-apa sahaja di luarnya tidak dikenali oleh penyemak imbas sebagai halaman web, jadi ia membuka dokumen dan menutupnya. Tag ini diperlukan untuk sebarang dokumen. Ia juga mengandungi beberapa lagi teg yang diperlukan, yang akan dibincangkan di bawah.

kepala

Di dalam teg ... ialah maklumat teknikal yang tidak akan muncul pada halaman, tetapi tetap merupakan bahagian penting dalam dokumen HTML. Asas tapak diletakkan di tempat ini; di sini pengekodan dipilih dan nama halaman dimasukkan. Ia terkandung di dalam teg yang diperlukan.... Tajuk dipaparkan di bahagian atas penyemak imbas, di mana anda juga boleh meletakkan ikon kecil yang mencirikan kandungan halaman. Adalah dinasihatkan untuk segera menunjukkan pengekodan dokumen untuk paparan yang betul. Ini boleh dilakukan menggunakan tag. Tag meta memberikan maklumat tentang struktur halaman dan biasanya terletak di dalam kepala.

Pautan

Mengetahui asas HTML juga melibatkan penggunaan gaya berlatarkan, atau css. Mereka menetapkan sifat elemen yang akan dipaparkan pada halaman. Pendekatan moden untuk tugas ini melibatkan pemindahan ciri seperti warna, ketinggian dan lokasi elemen ke fail luaran untuk kemudahan yang lebih baik. Untuk memasukkan fail css, gunakan teg. Dalam bentuk siapnya, ia kelihatan seperti ini: di mana href menunjukkan lokasi fail, dan jenis menunjukkan jenisnya.

Badan

Di bahagian dokumen HTML inilah bahagian halaman yang kelihatan dibuat. Semua yang dilakukan di dalam "badan" akan ditunjukkan oleh penyemak imbas. Ia menggunakan sejumlah besar tag HTML. Asasnya ialah pemformatan teks, bekerja dengan pautan, dan alatan asas untuk menstruktur halaman web. Untuk mula bekerja dalam HTML, anda hanya perlu mengetahui teg asas dan boleh menggunakannya. Di bawah adalah yang paling popular:

• - digunakan untuk menyerlahkan subrentetan yang akan tertakluk kepada gaya khas yang diterangkan dalam css;
• - mencipta pautan pada halaman web; alamat peralihan ditentukan oleh atribut href;
• - salah satu tag yang paling popular pada zaman kita; sesiapa yang memutuskan untuk mempelajari asas-asas bahasa HTMLl harus memberi perhatian khusus kepadanya, kerana ini adalah elemen blok, berdasarkan bahagian terbesar tapak moden dibuat (parameter untuk blok ditetapkan dalam css, dan blok lain boleh terletak di dalam tag ini);

• Memilih perenggan daripada teks; kandungan perenggan adalah antara tag pembuka dan penutup;

• - senarai bernombor yang unsur-unsurnya disertakan dalam tag berpasangan
• - senarai bertitik tumpu, di mana, seperti dalam senarai bernombor, elemen ditetapkan oleh tag
  • - - tajuk dokumen (nombor menunjukkan tahap tajuk, iaitu, tajuk utama, dan pilihan berikutnya adalah subtajuknya; dengan cara itu, tajuk tahap hampir mustahil untuk dicari di Internet), ia juga penting untuk diingat bahawa terdapat hanya boleh menjadi satu tajuk pada halaman;
  • - lakaran kecil;
  • - huruf condong;
  • - memasukkan gambar ke tapak web (ini adalah teg tunggal, ia tidak memerlukan teg penutup, tetapi ia mesti menyertakan atribut alt, yang menentukan teks untuk imej);
  • - memasukkan video ke dalam halaman web;
  • - tag yang memasukkan fail audio ke dalam dokumen.

  Ini bukan semua teg yang anda perlukan untuk membuat halaman web anda sendiri, tetapi ia cukup untuk meletakkan asas HTML untuk pemula.

  CSS

  Perkembangan bahasa HTML telah membawa kepada fakta bahawa setiap tag telah memperoleh banyak atribut, dan keperluan untuk penampilan halaman web telah meningkat dengan ketara. Kod itu menjadi rumit dan menyusahkan, sukar untuk membacanya, apatah lagi menyesuaikan atau mengubahnya. Di samping itu, jika tapak anda mempunyai sepuluh halaman dengan banyak tajuk yang ditandakan dengan warna hijau, dan anda tiba-tiba mahu menjadikannya merah, anda perlu bekerja keras, menukar setiap satu secara manual. Dengan kemunculan Cascading Style Sheets, proses ini menjadi mudah dan logik, dan kod HTML menjadi lebih mudah dibaca.

  

  Menggunakan CSS

  Untuk membuat halaman web, anda perlu mengetahui asas HTML dan CSS, kerana kini tiada apa yang perlu dilakukan di kawasan ini tanpa pengetahuan tentang helaian gaya cascading. Mereka menetapkan atribut untuk sebarang elemen yang digunakan pada keseluruhan dokumen. Dengan cara ini anda boleh menetapkan warna untuk semua elemen sekaligus

  Ataupun dengan menulis satu peraturan sahaja. Memandangkan keperluan moden untuk penampilan halaman web, penggunaan helaian gaya berlatarkan adalah wajib.

  Untuk menyambungkan fail css ke dokumen, terdapat teg pautan. Prinsip penggunaannya diterangkan sedikit lebih tinggi, tetapi ia bukan satu-satunya pilihan untuk menggabungkan semua gaya di satu tempat. Terdapat juga teg, yang terletak di "kepala" dokumen dan membolehkan anda menulis gaya tanpa menggunakan fail CSS. Ia tidak perlu menggunakan satu kaedah atau yang lain. Mereka boleh berjaya digabungkan untuk mendapatkan hasil yang terbaik. Untuk membuat fail dengan helaian gaya, anda perlu mencipta fail dengan sambungan .css, contohnya, Styles.css.

  JavaScript

  Selalunya, seseorang yang memutuskan untuk mula menyedari bahawa alat yang ditawarkan HTML tidak mencukupi untuk tugasnya. Asas akan membolehkan anda membuat halaman yang cantik, tetapi bagaimana jika anda tiba-tiba perlu menjadikannya interaktif? Untuk tujuan ini, terdapat pengaturcaraan unik yang berinteraksi dengan sempurna dengan HTML. Ia dipanggil JavaScript, kerana ia dianggap sebagai adik kepada bahasa Jawa yang popular. Hari ini, bahasa-bahasa ini telah memperoleh perbezaan yang ketara, dan jurang antara mereka hanya semakin meningkat.

  

  JavaScript boleh memanjangkan keupayaan HTML dengan membenarkan anda membuat dan mengedit teg. Selain itu, menggunakan alat hebat ini, anda boleh bekerja dengan Cokie, memuat turun data dari pelayan tanpa memuatkan semula halaman, dan menjadikan tapak lebih interaktif daripada yang dibenarkan oleh keupayaan HTML. Bahasa ini juga mempunyai had yang berkaitan dengan keselamatan. Jika JavaScript tidak digunakan pada bahagian pelayan, ia akan dilaksanakan dalam keadaan yang mengehadkan keupayaannya, supaya penyerang tidak boleh menggunakan kod hasad pada mana-mana komputer.

  Editor

  Asas HTML untuk pemula memerlukan pengetahuan tentang program yang paling mudah dan praktikal untuk mencipta halaman web. Seperti yang ditulis di atas, editor visual seperti Dreamweaver dan seumpamanya tidak sesuai untuk tujuan ini. Jadi, patutkah anda menulis tag dalam notepad biasa? Pilihan ini juga boleh dipersoalkan, kerana pad nota standard tidak mempunyai alat susun atur khas. Notepad++ boleh mengendalikan tugas ini dengan baik. Kelebihan besar produk ini ialah ia adalah sumber terbuka dan diedarkan secara percuma. Ia mempunyai penonjolan sintaks yang mudah dan penutupan tag secara automatik. Notepad++ juga menyediakan pelbagai pilihan bahasa antara muka, dan keupayaannya mudah dikembangkan dengan banyak alat tambah.

  

  Sublime Text 3 ialah program yang serupa dengan Notepad++, tetapi tersedia dengan bayaran. Dialah yang memenangi hati kebanyakan pemaju. Teks Sublime 3 sesuai untuk JavaScript, CSS dan HTML. Anda perlu mempelajari asas bekerja dengannya sendiri, tetapi ia berbaloi. Ia mengandungi kemungkinan yang benar-benar tidak terhad untuk penalaan halus, yang membolehkan anda menyesuaikan program dengan keperluan anda sebanyak mungkin.

  Asas HTML dan CSS untuk Pemula

  Seperti yang anda lihat, mempelajari seni mencipta halaman web tidaklah sesukar yang kelihatan pada pandangan pertama. Hanya beberapa bulan latihan akan mengubah anda daripada pengguna yang pemalu kepada pembangun baru. Reka letak pembelajaran adalah lebih mudah daripada menguasai bahasa pengaturcaraan atau Linux. Sebenarnya, tidak begitu banyak teg HTML; adalah penting untuk memahami aspek praktikal penggunaannya.

  

  Kemahiran dalam bekerja dalam Adobe Photoshop tidak akan berlebihan dalam perkara ini. Program ini membolehkan anda bekerja dengan gambar, gambar dan elemen grafik lain halaman web. Pada masa ini, Photoshop yang paling baik menangani tugas-tugas sedemikian; ia mempunyai sedikit pesaing. Bagi mereka yang tidak menyukai produk Adobe ini, terdapat program Lightroom, GIMP, Illustrator dan lain-lain yang mempunyai fungsi yang serupa.

  Apakah yang diberikan oleh pengetahuan tentang HTML?

  Kemahiran mencipta halaman web sangat relevan hari ini, kerana Internet berkembang dengan pesat. Setiap perusahaan, walaupun kedai terkecil, bengkel dan kelab sukan - semua orang mahu mempunyai tapak web mereka sendiri. Dan sudah tentu, untuk ini mereka memerlukan pembangun yang mengetahui CSS dan HTML. Asasnya mudah dikuasai, selepas itu ia adalah soal latihan. Memandangkan teknologi susun atur sentiasa berkembang, pembangun bahagian hadapan akan sentiasa mendapat permintaan. Sesiapa yang memutuskan untuk menumpukan dirinya kepada industri yang menarik ini tidak akan ditinggalkan tanpa kerja.