استفاده از id برای دادن نام اختصاصی به هر تگ div ، در HTML

همانطور که در مبحث قبلی گفتم ، نوشتن مشخصه style درون تگ div انتخاب مناسبی نیست و ما به جای آن روش بهتری را پیشنهاد می کنیم . در این روش برای هر تگ div یک نام اختصاصی ( یک id ) در نظر می گیریم و سپس ویژگی هایی را که می خواهیم به آن تگ div نسبت دهیم را در قسمت head از فایل html قرار می دهیم . همان مثال مبحث قبل را این بار با این روش می نویسیم :

مثال

نتیجه :

مشاهده می کنید که نتیجه دقیقا همان نتیجه مثال مبحث قبلی است . این روش بسیار کارآمد است که باعث می شود با گذشت زمان که صفحه شما شلوغ تر می شود ، گیج نشوید و راحت تر بتوانید مشخصه های هر تگ را تغییر دهید .

در کدنویسی بالا ، ابتدا برای تگ div اول یک id با نام column1 و برای تگ div دوم یک id با نام column2 مشخص کرده ایم . حال باید کدهای CSS را بنویسیم . محل کدهای CSS باید بین تگ های <head> و <head/> باشد . شروع کدهای CSS را با تگ شروع <style type="text/css"> اعلام می کنیم و پایان کدهای CSS را نیز با تگ پایانی <style/> اعلام می کنیم ، سپس بین این دو تگ ، کدهای CSS را می نویسیم . برای تگ های div ، نام هایی اختصاصی ( id ) ساختیم تا بتوانیم در این محل به آنها ویژگی هایی را اختصاص دهیم . برای اینکه هر تگ div را مشخص کنیم ابتدا علامت # را نوشته و سپس نام id مربوط به آن را می نویسیم . سپس بین دو علامت { و } تمامی مشخصه هایی را که می خواهیم برای آن تگ div می نویسیم .