ขอความรู้Htmlค่ะ

By namprik on 9 November 2009 - 09:59 Tag:

การเขียนhtml ต้องมีtag < html >< head > < / head > < body > < / body > < / html > ใช่มั้ยค่ะ แล้วเวลาเราจะเขียนรายละเอียดต่างๆเราก็จะเขียนคำสั่งเพิ่มลงใน< body > < / body > แต่ว่าทำไมลงเขียนดูระหว่าง< head >< / head >หรือ< html > < / html > ก็แสดงผลเหมือนกับใส่ใน< body > < / body >

จึงอยากทราบว่า
1.เพราะเหตุใดตามหนังสือจึงบอกว่า< body > < / body >เป็นส่วนที่พิมพ์เนื้อหาของโปรแกรมที่ต้องการให้แสดงบนบราวเซอร์ทั้งที่ๆใส่นอก< body > < / body >ก็แสดงผลได้เหมือนกันนะค่ะ
2.ถ้ามี< body > หลายๆครั้งก็ได้ แต่ทำไมจึงมักเห็นแค่ครั้งเดียว
3.ถ้าเราเราพวกคำสั่งสร้างเฟรม ฟอร์ม ตาราง ใส่ภาพ ฯ ไปใส่นอก< body >จะได้มั้ยค่ะ (ลองทำแล้วก็แสดงผลได้)ไม่ทราบว่าจะมีผลกับอะไรหรือไม่

*(พอดีจะไปสอนเด็กนักเรียนเลยอยากรู้ให้จริงนะค่ะ) ขอบคุณนะค่ะ

ตัวอย่าง

< html >
< head >mamama< / head >
< body >hello< / body >
a b c d e f< table border="0" >< tr >< td >123456789</ td >< / tr >< / table >
< / html >

ผลลัพธ์

mamama hello a b c d e f123456789

Hiring! บริษัทที่น่าสนใจ

CP AXTRA Public Company Limited - Lotus's

CP AXTRA Lotus's is revolutionizing the retail industry as a Retail Tech company.

Token X

Blockchain, ICO, Tokenization, Digital Assets, and Financial Service

Carmen Software

Hotel Financial Solutions

Next Innovation (Thailand) Co., Ltd.

We are web design with consulting & engineering services driven the future stronger and flexibility.

United Information Highway Co., Ltd.

UIH is Thailand’s leading Digital Infrastructure and Solution Provider for Business

KKP Dime

KKP Dime บริษัทในเครือเกียรตินาคินภัทร

Kiatnakin Phatra Financial Group

Financial Service

Fastwork Technologies

Fastwork.co เว็บไซต์ที่รวบรวม ฟรีแลนซ์ มืออาชีพจากหลากหลายสายงานไว้ในที่เดียวกัน

Thoughtworks Thailand

Thoughtworks เป็นบริษัทที่ปรึกษาด้านเทคโนโยลีระดับโลกที่คว้า Great Place to Work 3 ปีซ้อน

Iron Software

Iron Software is an American company providing a suite of .NET libraries by engineer for engineers.

CLEVERSE

Cleverse is a Venture Builder. Our team builds several tech companies.

Nipa Cloud

#1 OpenStack cloud provider in Thailand with our own data center and software platform.

CDG GROUP

Provider of IT solutions to public, state, and private sectors in Thailand for over 56 years

Bangmod Enterprise

The leader in Cloud Server and Hosting in Thailand.

CIMB THAI Bank

MOVING FORWARD WITH YOU - CIMB is the leading ASEAN Bank

Bangkok Bank

Bangkok Bank is one of Southeast Asia's largest regional banks, a market leader in business banking

Gofive

“We create world-class software experience”

KBTG - KASIKORN Business-Technology Group

KBTG - "The Technology Company for Digital Business Innovation"

Siam Commercial Bank Public Company Limited

"Let's start a brighter career future together"

Icon Framework co.,Ltd.

Global Standard Platform for Real Estate แพลตฟอร์มสำหรับธุรกิจอสังหาริมทรัพย์ครบวงจร มาตรฐานระดับโลก

REFINITIV

The Financial and Risk business of Thomson Reuters is now Refinitiv

H LAB

Re-engineering healthcare systems through intelligent platforms and system design.

LTMH TECH

LTMH TECH มุ่งเน้นการพัฒนาผลิตภัณฑ์ที่สามารถช่วยพันธมิตรของเราให้บรรลุเป้าหมาย

Seven Peaks

We Drive Digital Transformation

Wisesight (Thailand) Co., Ltd.

The Best Choice For Handling Social Media · High Expertise in Social Data · Most Advanced and Secure

MOLOG Tech

We are Modern Logistic Platform, Specialize in WMS, OMS and TMS.

Data Wow Co.,Ltd

We enable our clients to realize increased productivity by solving their most complex issues by Data

LINE Company Thailand

LINE, the world's hottest mobile messaging platform, offers free text and voice messaging + Call

LINE MAN Wongnai

Join our journey to becoming No.1 food platform in Thailand

อันนี้ไม่เคยทดลองด้วยตัวองเหม

PiKO Mon, 11/09/2009 - 10:12

อันนี้ไม่เคยทดลองด้วยตัวองเหมือนกันนะครับ
ข้าใจว่า มีการกำหนดมาตรฐานอาไว้ตามที่ข้าใจอย่างแรกคือต้องเขียนใน
แต่ด้วยความฉลาดของ Browser ที่ตีความหมายของ
< body > abc < /body > กับ < body > < /body >abc
ว่าพยายามจะแสดงคำว่า abc เหมือนกันเลยแสดง abc ออกมาให้

ยังไงซ่ะตามมาตรฐานดีที่สุดครับ

มันเป็นความพยายามของบราวเซอร์

lew Mon, 11/09/2009 - 10:12

มันเป็นความพยายามของบราวเซอร์สมัยใหม่ ที่จะซ่อมไฟล์ HTML ที่ไม่ตรงมาตรฐานให้สามารถแสดงผลได้ถูกต้องครับ

อย่างไรก็ดี การแสดงผลเช่นนี้อาจจะไม่ตรงกันในทุกบราวเซอร์ (หรืออาจจะบังเอิญตรงกัน) รวมถึงว่าในวันนี้มันใช้งานได้ อนาคตอาจจะใช้งานไม่ได้ด้วย

หลายๆ ครั้งไฟล์ html ไม่ได้ถูกอ่านในบราวเซอร์อย่างเดียว โดยเฉพาะซอฟต์แวร์ใหญ่ๆ ที่ต้องเขียนโปรแกรมมาอ่าน html เพื่อไปทดสอบ การเขียนไม่ตรงมาตรฐานจะสร้างความผิดพลาดได้โดยง่าย

อ๋อ ขอบคุณมากเลยค่ะ

namprik Mon, 11/09/2009 - 10:24

อ๋อ ขอบคุณมากเลยค่ะ

ความรู้ใหม่นะเนี่ย

-Rookies- Mon, 11/09/2009 - 10:36

ความรู้ใหม่นะเนี่ย ไม่เคยลองเขียนผิดๆ ดูซักที ขอบคุณครับ

เขียนให้ถูกหลัก ยังมีผลต่อ

crucifier Mon, 11/09/2009 - 11:04

เขียนให้ถูกหลัก ยังมีผลต่อ seo ด้วยนะครับ (สำคัญมากในปัจจุบัน) เพราะ search engine ไม่ได้ฉลาดเหมือน browser ที่เราใช้ๆ กัน

ว่าแต่บางกระทู้ก็ใช้ "ครับ" บางกระทู้ก็ใช้ "ค่ะ" แปลกจัง :)

พอดีว่าล็อกอินนี้ใช้กะเพื่อนอ

namprik Mon, 11/09/2009 - 11:08

พอดีว่าล็อกอินนี้ใช้กะเพื่อนอีกคนค่ะ

ไม่เกี่ยวกับคำถาม แต่ว่า ถ้าจ

platalay Mon, 11/09/2009 - 11:33

ไม่เกี่ยวกับคำถาม

แต่ว่า
ถ้าจะเอาไปสอนนักเรียน กรุณาเอา table ออก แล้วเอา div มาสอนแทนเถอะครับ
table เอาไว้ใช้กับข้อมูลประเภทตาราง อย่าเอามาจัดหน้า web เลย ถือเป็นการใช้งานผิดประเภท

เห็นด้วยอย่างแรงครับ

snappy Mon, 11/09/2009 - 20:34

เห็นด้วยอย่างแรงครับ

คือความจริงไม่ได้ตั้งใจจะจัดห

namprik Wed, 11/11/2009 - 21:44

คือความจริงไม่ได้ตั้งใจจะจัดหน้าน่ะค่ะ แค่ลองพิมพ์ดูว่ามันแสดงผลเหมือนกันมั้ย นึกอะไรไม่ออกเลยลองพิมพ์ใส่ตารางดูค่ะ แต่ก็ของคุณสำหรับคำแนะนำค่ะ

ลืม <title> รึเปล่าเอ่ย?

ezy Mon, 11/09/2009 - 18:22

ลืม <title> รึเปล่าเอ่ย?

แล้วถ้าไม่ใส่ได้มั้ย

namprik Wed, 11/11/2009 - 21:44

แล้วถ้าไม่ใส่ได้มั้ย ถ้าไม่ได้อยากให้ส่วนหัวโปรแกรมแสดงอะไร

ความเห็นส่วนตัว

aimakung Mon, 11/09/2009 - 23:06

ความเห็นส่วนตัว ผมว่าควรจะศึกษาทดลอง และดูแนวโน้มต่างๆ ไปด้วย
ถือว่าช่วยเด็กให้เริ่มต้นอย่างถูกต้องนะครับ

ดีกว่าสอนให้ทำได้ แล้วมีแต่เว็บกระพริบๆ ทรมานลูกตานะ (=__=" )

แนวโน้มประมาณไหนค่ะ

namprik Wed, 11/11/2009 - 21:45

แนวโน้มประมาณไหนค่ะ

HTML เป็นภาษาหนึ่ง

anu Thu, 11/12/2009 - 01:06

HTML เป็นภาษาหนึ่ง และก็ต้องมีองค์กรนึงที่ออกมาตรฐานหรือสเป็คของมันขึ้นมา องค์กรเข้าเขียนไว้ว่าอย่างนั้นครับ ลองดูลิงค์นี้ ส่วนถ้าเราไม่ทำตามแล้วทำไมมันยังใช้งานได้ก็อ่าน ค.ห.นี้

ตอบโต้งๆ เลยหนังสือบอกอย่างนั้น เพราะมันถูกสร้างมาโดยบอกให้เราทำอย่างนั้น
มีปัญหาไหม เคยเจอว่า browser บางตัว มันจะเรียก Javascript ไปในส่วนที่อยู่นอก < /body > ไม่ได้

เดี๋ยวนี้

loptar Fri, 11/13/2009 - 11:18

เดี๋ยวนี้ นิยมแยกส่วนออกจากกันครับ มี 3 ส่วน

1. html เป็น structure คือเขียนให้ถูกหลัก ใช้ tag ต่างๆอย่างมีความหมายตามที่มันออกแบบมาให้เป็น และมี document flow ตามลำดับที่ควร เช่น h1 สำคัญที่สุดใน document นั้น ก้ควรใช้แค่ครั้งเดียว ถัดมาก้ใช้ h2 h3 ลงมาเรื่อยๆ หรือเมนู มองว่ามันเป็นลิสท์ของลิ้งค์ ดังนั้นควรเขียนโดยใช้ li เป็นต้น

2. css เป็น presentation คือการตกแต่งประดับประดาทั้งหลาย รวมทั้ง lay-out และการออกแบบต่างๆ เช่นแปลงสภาพ li ตามข้อ 1 ให้ดูเป็นเมนูมากขึ้น

3. javascript เป็น behavior คือพฤติกรรมของเว็บเรา เช่นคลิกที่ตัวหนังสือแล้วกลายเป็นช่องสำหรับแก้ไขข้อความนั้นได้

พยายามอธิบายง่ายๆเป็นภาษาไทยได้ประมาณนี้ครับ รอผู้รู้ท่านอื่นๆมาช่วยเสริม :-)

ขอบคุณค่ะ

namprik Fri, 11/13/2009 - 20:35

ขอบคุณค่ะ

Apple

public://topics-images/apple_webp.png

SCB10X

public://topics-images/347823389_774095087711602_515970870797767330_n_webp.png

Windows 11

public://topics-images/hero-bloom-logo.jpg

Doom

public://topics-images/doom_logo.png

Huawei

public://topics-images/huawei_standard_logo.svg_.png

Threads

public://topics-images/threads-app-logo.svg_.png

Google Keep

public://topics-images/google_keep_2020_logo.svg_.png

Fortnite

public://topics-images/fortnitelogo.svg_.png

Instagram

public://topics-images/instagram_logo_2022.svg_.png

SCB

public://topics-images/9crhwyxv_400x400.jpg

Microsoft

public://topics-images/microsoft_logo.svg_.png

Basecamp

public://topics-images/bwpepdi0_400x400.jpg

Tinder

public://topics-images/hwizi8ny_400x400.jpg

FTC

public://topics-images/seal_of_the_united_states_federal_trade_commission.svg_.png

public://topics-images/pinterest.png

Palantir

public://topics-images/-nzsuc6w_400x400.png

Gemini

public://topics-images/google_gemini_logo.svg__0.png

AIS Business

public://topics-images/logo-business-2021-1.png

PostgreSQL

public://topics-images/images.png

JetBrains

public://topics-images/icx8y2ta_400x400.png

Krungthai

public://topics-images/aam1jxs6_400x400.jpg

Palworld

public://topics-images/mccyhcqf_400x400.jpg

Bill Gates

public://topics-images/bill_gates-september_2024.jpg

VMware

public://topics-images/1nj4i1gp_400x400.jpg

Take-Two Interactive

public://topics-images/0khle7nh_400x400.jpg

OpenAI

public://topics-images/ztsar0jw_400x400.jpg

Thailand

public://topics-images/flag_of_thailand.svg_.png

NVIDIA

public://topics-images/srvczsfq_400x400.jpg

ServiceNow

public://topics-images/ytnrfphe_400x400.png

PS5

public://topics-images/playstation_5_logo_and_wordmark.svg_.png

Klarna

public://topics-images/urcllpjp_400x400.png

Google Play

public://topics-images/play.png

Drupal

public://topics-images/drupal.png

Virtua Fighter

public://topics-images/virtua_figther_2024_logo.png

Paradox Interactive

public://topics-images/paradox_interactive_logo.svg_.png

Europa Universalis

public://topics-images/europa-icon.png

Nintendo Switch 2

public://topics-images/mainvisual.png