Mundarija:
- 1 -qadam: Notepad -dan foydalanish
- 2 -qadam: Asosiy HTML hujjatlari daraxtini qo'shish
- 3 -qadam:.html sahifasi sifatida saqlash
- 4 -qadam: veb -sahifangizga sarlavha qo'shish
- 5 -qadam: Veb -sahifangizga tarkib qo'shish
- Mening veb -sahifamga xush kelibsiz
- 6 -qadam: O'zgarishlarimizni hozirgacha ko'rish
- 7 -qadam: Paragraf yorlig'ini qo'shish
- Mening veb -sahifamga xush kelibsiz
- 8 -qadam: Bir oz rang bering
- Mening veb -sahifamga xush kelibsiz
- 9 -qadam: rasm qo'shish
- Mening veb -sahifamga xush kelibsiz
- 10 -qadam: Yakuniy mahsulotni ko'rish
Video: Yalang'och suyaklar veb -sahifasi: 10 qadam
2024 Muallif: John Day | [email protected]. Oxirgi o'zgartirilgan: 2024-01-30 13:27
Bugun biz noldan juda oddiy, yalang'och suyaklar veb -sahifasini yaratmoqchimiz. Biz HTML elementlari, veb -sahifangizni uslublash (ranglar, shriftlar, hizalama va hk) va nihoyat veb -sahifangizga rasmni qanday kiritish haqida gaplashamiz!
Bu ko'rsatma oxirida siz noldan veb -sahifa yaratish bo'yicha asosiy ko'nikmalarga ega bo'lasiz va kodlash ko'rinadigan darajada qiyin emasligini bilib olasiz!
1 -qadam: Notepad -dan foydalanish
Birinchi veb -sahifani yaratish uchun biz Windows -dagi Notepad -dan foydalanmoqchimiz. Har qanday matn muharriri bajarsa-da, bloknot Windows mashinalarida oldindan o'rnatilgan bo'lib keladi, shuning uchun bu juda yaxshi boshlanish nuqtasi.
Notepadni ochish uchun ekranning chap pastki burchagidagi qidirish satriga o'ting va "Notepad" ni kiriting. Keyin qidiruv natijalarida paydo bo'ladigan "Notepad" dasturini tanlang. Yangi oyna ochilishi kerak.
2 -qadam: Asosiy HTML hujjatlari daraxtini qo'shish
Veb -brauzeringiz (Chrome, Firefox, Edge, Internet Explorer, Safari …) veb -sahifangizni qayta ishlashi va ko'rsatishi uchun barcha veb -sahifalar standart skelet tuzilishiga mos kelishi kerak.
Bu html hujjatlar daraxti deb ataladi. Notepadda ekran tasvirida ko'rsatilgandek html "elementlar" yoki "teglar" ni kiriting. Nusxalash va joylashtirishdan xavotirlanmang:
3 -qadam:.html sahifasi sifatida saqlash
Endi biz Notepad -dagi asosiy HTML tuzilmamizga ega bo'lib, hech qanday ishni yo'qotmasligimiz uchun va yo'riqnoma bo'ylab harakatlanayotganimizda o'zgarishlarni ko'rishimiz uchun saqlaylik.
- "Fayl"> "Saqlash …" -ni tanlang (1 -rasm)
- Fayl turini "Barcha fayllar" ga o'zgartiring (2 -rasm)
- Faylingizga o'zingiz xohlagan nom bering. Hujjatni kompyuterda qayerda saqlayotganingizga e'tibor bering, shunda uni keyinroq ochishingiz mumkin. ESLATMA: Bu faylni saqlashning eng muhim qismi - fayl nomining oxiriga ".html" qo'shilishi. Bu sizning kompyuteringizga veb -sahifa sifatida tan olish imkonini beradi. Agar siz faylingizga "my_webpage" deb nom bermoqchi bo'lsangiz, uning oxiriga.html qo'shganingizga ishonch hosil qiling, masalan. "my_webpage.html"
4 -qadam: veb -sahifangizga sarlavha qo'shish
Shunday qilib, bizda veb -sahifani sharhlash va ko'rsatish uchun veb -brauzerlar uchun zarur bo'lgan asosiy HTML tuzilishi bor, lekin bizda hech qanday tarkib yo'q. Keling, buni o'zgartiraylik!
Biz qilishimiz kerak bo'lgan birinchi narsa - bu bizning veb -sahifamizga Sarlavha berish. Ko'pgina veb -sahifalar sarlavhaga ega. Bu sizning veb -brauzeringizdagi yorliqda ko'rsatiladi (ekran tasvirini ko'ring). Men o'z veb -sahifamga "Teylorning sayti" nomini beraman. Buning uchun biz "sarlavha" elementini qo'shishimiz kerak.
Teylor veb -sayti
Bu vaqtda siz har bir tegda "ochilish" va "yopish" yorlig'i borligini ko'rasiz. Kabi
va.
Bu sarlavha qaerdan boshlanishini va qaerda tugashini aniqlashdir. Deyarli barcha html teglari bunga amal qiladi, lekin ba'zi istisnolar mavjud.
5 -qadam: Veb -sahifangizga tarkib qo'shish
Xo'sh, bizning veb -sahifamiz uchun sarlavha bor, lekin bizda hali bu borada haqiqiy ma'lumotlar yo'q. Keling, bir oz qobiliyat qo'shaylik!
Biz veb -sahifamizga "sarlavha" elementi yordamida sarlavha qo'shdik. Sarlavha elementi bo'lgan "h1" elementi yordamida veb -sahifamizga katta e'tibor qaratadigan sarlavha beraylik.
Teylor veb -sayti
Mening veb -sahifamga xush kelibsiz
6 -qadam: O'zgarishlarimizni hozirgacha ko'rish
Bizda sarlavha bor, bizda ba'zi ma'lumotlar bor, keling, bizning veb -sahifamizni hozirgacha qanday ketayotganini ko'rib chiqaylik.
- Faylingizni bloknotda saqlang
- Fayl saqlangan joyga o'ting va uni ikki marta bosing. U standart veb -brauzerda avtomatik ravishda ochilishi kerak. Yaxshi ko'rinish!
7 -qadam: Paragraf yorlig'ini qo'shish
Bizda sarlavha, sarlavha bor, endi yana matnli paragraf qo'shamiz. Paragraf uchun element nomi 'p'. Siz uning ishlatilishini quyida ko'rishingiz mumkin:
Teylor veb -sayti
Mening veb -sahifamga xush kelibsiz
Bugun biz juda oddiy veb -sahifani yaratishni o'rganamiz!
Eslatma: O'zgartirishlaringizni xohlagan vaqtda bloknotni saqlash va faylni ochish orqali ko'rishingiz mumkin.
8 -qadam: Bir oz rang bering
Bizda veb -sahifa bor, lekin bu juda oddiy. Keling, paragraf yorlig'iga rang bering!
Biz "p" yorlig'iga "uslub" atributini quyida batafsil ko'rsatib, turli elementlarni rang berishimiz mumkin:
Teylor veb -sayti
Mening veb -sahifamga xush kelibsiz
Bugun biz juda oddiy veb -sahifani yaratishni o'rganamiz!
9 -qadam: rasm qo'shish
Rasmsiz veb -sayt nima? Veb -saytimizga rasm qo'shamiz!
Birinchi qadam - sizga yoqadigan rasmni topish. Oltin retrieverni qidirish uchun Google rasmlaridan foydalanardim. Rasmni yuqoriga ko'taring va url.jpg,.png,.gif,-j.webp
O'z rasmingizni tanlagandan so'ng, biz uni "img" yorlig'i yordamida html sahifasiga qo'shishimiz kerak. Mening rasmim:
Uni "src" atributiga ega "img" yorlig'i yordamida o'z sahifangizga qo'shing:
Teylor veb -sayti
Mening veb -sahifamga xush kelibsiz
Bugun biz juda oddiy veb -sahifani yaratishni o'rganamiz!
10 -qadam: Yakuniy mahsulotni ko'rish
Notepad faylini saqlang va yakuniy mahsulotni oching. Siz veb -sahifangizni ko'rishingiz kerak!
Tavsiya:
Yalang'och Arduino -ni sinovdan o'tkazing, sig'imli kirish va LED yordamida o'yin dasturiy ta'minoti: 4 qadam
Yalang'och Arduinoni, O'yin dasturiy ta'minoti yordamida, sig'imli kirish va LED yordamida tekshiring: " Itaring " Yalang'och Arduino taxtasi yordamida interaktiv o'yin, tashqi qismlar va simlar kerak emas (sig'imli "sensorli" kirish ishlatiladi). Yuqorida ko'rsatilgandek, u ikki xil taxtada ishlayotganini ko'rsatadi. Push-Bu ikkita maqsadga ega. /V ni tezda ko'rsatish uchun
Yalang'och minimal - Breadboard -dagi Arduino: 5 qadam
Bare Minimal - Breadboard -dagi Arduino: Arduino ATMega328p chipidan foydalanadi. Biz buni SMD formatida (ATMega328p-AU) yoki teshiklarni lehimlash uchun DIP formatida (ATMega328p-PU) olishimiz mumkin. Ammo chip o'z -o'zidan ishlamaydi. Unga yana bir nechta komponentlar kerak bo'ladi va ularning hammasi yalang'och deb ataladi
Yalang'och metallli LEDli Raspberry Pi tugmasi: 8 qadam
Yalang'och metall svetodiodli Raspberry Pi tugmasi: Bu malina pi 3 yalang'och metallni dasturlash bo'yicha ikkinchi darsligim! Birinchisini bu erda tekshiring. O'tgan safar men sizga malinali pi 3 uchun bitta chiroq yonib turadigan operatsion tizim tasvirini qanday yaratishni ko'rsatgan edim, bu darslikda men sizga ko'rsataman
Haqiqatan ham yalang'och suyaklar taxtasini (RBBB) Arduino klonini yig'ish - YANGILANGAN: 16 qadam
Haqiqatan ham yalang'och suyaklar taxtasini yig'ish (RBBB) Arduino Clone - YANGILANGAN: 16.08.2008: oxirgi bosqichda turli xil konfiguratsiyalar tasvirlari qo'shilgan. Zamonaviy Device Company RBBB - bu ajoyib kichkina Arduino klonidir. Agar sizda Arduino loyihasi bo'lsa, unda kichik maydonni yoki qimmat bo'lmagan taxtani talab qilsangiz, bu
Yalang'och suyaklar Breadboard Arduino yorliqlari: 4 qadam
Yalang'och suyaklar Breadboard Arduino yorliqlari: Bu ko'rsatma juda oddiy. Menga Arduino -da non yugurish uchun uDuino yalang'och suyaklar interfeysi ilhom berdi, lekin bir narsa etishmayapti deb o'yladim. D0, D1, A0, A2 va hokazo Arduino pin tavsiflari to'g'ridan -to'g'ri ATMeg bilan mos kelmaydi