سفارش تبلیغ
صبا ویژن

سربرگ HTML

سربرگ HTML

سربرگ HTML‏‏

یاد گرفتیم که یک نمونه داکیومنت HTML دارای ساختار زیر می باشد.

Document declaration tag
< html>
< head>
    Document header related tags
< head>
< body>
    Document body related tags
< body>
< html>

این فصل جزئیات بیشتری در مورد بخش سربرگ در HTML ارائه می دهد که به وسیله ی برچسب< head>نمایش داده می شود. برچسب< head>حاوی برچسب های مهمی می باشد که عبارتند از:< title>, < meta>, < link>, < base>,< style>, < script >, و < noscript > tags.


برچسب < title> در HTML

این برچسب برای تعیین تیتر داکیومنت HTML استفاده می شود. در زیر مثالی می بینید از ارائه ی تیتر به داکیومنت HTML.


نمونه یک

 

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

    <title>HTML Title Tag Example</title>

</head>

<body>

    <p>Hello, World!<p>

</body>

</html>


برچسب < meta> در HTML

 

این برچسب برای ارائه ی متادیتا در مورد داکیومنت HTML استفاده می شود که اطلاعاتی از قبیل انقضا صفحه، گردآورنده ی صفحه، لیست کلمات کلیدی، توصیف صفحه و غیره ارائه می دهد.
در ادامه استفاده های مهم برچسب < meta> در داکیومنت HTML ارائه شده اند

 

 

نمونه دو

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>HTML Title Tag Example</title>
    <!-- Provide list of keywords -->
    <meta name="keywords" content="C, C++, Java, PHP, Perl, Python">

    <!-- Provide description of the page -->
    <meta name="description" content="Simply Easy Learning by Tutorials Point">

    <!-- Author information -->
    <meta name="author" content="Tutorials Point">

    <!-- Page content type -->
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">

    <!-- Page refreshing delay -->
    <meta http-equiv="refresh" content="30">

    <!-- Page expiry -->
    <meta http-equiv="expires" content="Wed, 21 June 2006 14:25:27 GMT">

    <!-- Tag to tell robots not to index the content of a page -->
    <meta name="robots" content="noindex, nofollow">
</head>
<body>
    <p>Hello, World!<p>
</body>
</html>

برچسب < base> در HTML

این برچسب برای تعیین URL پایه برای همه ی URL های وابسته در صفحه استفاده می شود، که به این معناست که همه ی URL های دیگر هنگامی که برای آیتم ارائه شده قرار می گیرند، دیگر URL ها به URL پایه زنجیر خواهند شد.
به عنوان مثال تمام صفحات و تصاویر ارائه شده، پس از پیشوند دار کردن URL های ارائه شده با URL پایه مسیر prefixing جستجو خواهند شد


نمونه سه

 

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

    <title>HTML Title Tag Example</title>

    <base href="http://www.tahlildadeh.com/" />

</head>

<body>

    <img src="/banner/02.jpg" alt="Logo Images" />

    <a href="/ArticleDetails/HTML Marquees" title="HTML Tutorial">HTML Tutorial</a>

</body>

</html>


برچسب < link> در HTML

این برچسب ارتباط بین داکیومنت جاری و منبع خارجی را تعیین می کند. در ادامه مثالی را می بینید از لینک یک فایل style sheet خارجی موجود در مسیر css با یک web root.

 

نمونه چهار

 

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

    <title>HTML Title Tag Example</title>

    <base href="http://www.tahlildadeh.com/" />

    <link rel="stylesheet" type="text/css" href="/css/style.css">

</head>

<body>

    <p>Hello, World!<p>

</body>

</html>

برچسب< style>در HTML

این برچسب برای تعیین style sheet برای داکیومنت جاری HTML استفاده می شود. در ادامه مثالی را می بینید از تعریف برخی قوانین style sheet در داخل برچسب< style>.


نمونه پنج

 

 

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

    <title>HTML style Tag Example</title>

    <base href="http://www.tahlildadeh.com/" />

    <style>

        .myclass {

            background-color: #aaa;

            padding: 10px;

        }

    </style>

</head>

<body>

    <p class="myclass">Hello, World!<p>

</body>

</html>

 توجه:

برای فراگیری چگونگی کار Cascading Style Sheet یک آموزش مجزای موجود در اینجا را کلیک کنید.

برچسب< script>در HTML

این برچسب برای وارد کردن فایل اسکریپت خارجی و یا تعریف فایل اسکریپت داخلی برای داکیومنت HTML استفاده می شود. در زیر مثالی را می بینید که در آن از جاوا اسکریپت برای تعریف عملکرد ساده ی جاوااسکریپت استفاده می کنیم.


نمونه شش

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

    <title>HTML Title Tag Example</title>

    <base href="http://www.tahlildadeh.com/" />

    <script>

        function Hello() {

            alert("Hello, World");

        }

    </script>

</head>

<body>

    <input type="button" onclick="Hello();" name="ok" value="OK" />

</body>

</html>