لینک ها در HTML
لینک ها در HTML
لینک ها تقریبا در تمام صفحات وب پیدا می شوند. لینک ها به کاربران اجازه می دهند تا از صفحه ای به صفحه دیگر کلیک کنند.
مثال - خودتان امتحان کنید
HTML links
نحوه ایجاد لینک ها در سند HTML
می توانید مثال های بیشتری را در پایین این صفحه ببیند.
Hyperlink (یا Link ها) در HTML
یک hyperlink یا link یک کلمه یا گروهی از کلمات یا عکس می باشد که شما می توانید با کلیک کردن روی آن به سند جدید یا بخشی از همان سند بروید.
هنگامی که شما موس را روی یک لینک در یک صفحه وب می برید، نشانگر به شکل یک دست کوچک در می آید.
لینک ها در HTML با تگ <a> مشخص می شوند.
تگ <a> به دو روش می تواند استفاده شود:
- برای ایجاد لینک به سندی دیگر، با استفاده از خصوصیت href
- برای ایجاد یک پیوند به دورن همان صفحه (bookmark)، با استفاده از خصوصیت name
نحوه نوشتن لینک در HTML:
خصوصیت href مقصد یک لینک را مشخص می کند.
مثال:
که به این صورت نمایش داده می شود: Visit beyamooz
با کلیک روی لینک بالا، کاربر به صفحه اصلی سایت beyamooz ارجاع داده می شود.
نکته: Link text الزاما یک متن نیست. می تواند یک عکس یا هر عنصر دیگر HTML باشد.
خصوصیت target
خصوصیت target مشخص می کند که صفحه لینک شده، چگونه باز شود.
مثال زیر، صفحه لینک شده را در یک پنجره جدید یا در یک تب جدید باز می کند:
مثال (لینک ها در HTML)
خصوصیت name یا (id)
با تنظیم یک نام منحصر به فرد برای یک عنصر با استفاده از خصوصیت name یا id، می توانید در CSS یا JavaScript به آن دسترسی داشته باشید.
البته از خصوصیت name یا id برای ایجاد یک bookmark یا پیوند به درون همان صفحه نیز می توان استفاده نمود.
نکته: استاندارد HTML5 خصوصیت id را بجای name برای تعیین اسم برای یک محل مشخص پیشنهاد می دهد. خصوصیت id برای HTML4 در تمام مرورگرهای امروزی نیز عمل می کند.
مثال: تنظیم خصوصیت Name برای تگ <a> در سند HTML:
ایجاد یک لینک به محل مشخصی درون صفحه جاری:
یا، ایجاد یک لینک به محل مشخصی در صفحه ای دیگر:
Visit the Useful Tips Section</a>
نکات اساسی و مفید
نکته: اگر می خواهید یک فولدر در یک سایت را آدرس دهی نمایید، همیشه یک slash به انتهای آن اضافه کنید. مانند زیر:
در غیر اینصورت، دو درخواست به سرور ارسال کرده اید، سرور ابتدا یک slash به انتهای آدرس اضافه می کند و سپس آدرس را بارگذاری می کند.
An image as a link
نحوه ایجاد یک عکس به عنوان یک لینک
Link to a location on the same page
نحوه ایجاد یک پیوند درون همان صفحه. (این روش برای سندهایی که فهرست بندی شده اند کاربرد زیادی دارد)
Break out of a frame
چگونه از یک فریم بیرون بیاییم. (اگر سایت شما در یک فریم محصور است)
Create a mailto link 1
چگونه با یک لینک، متنی را ایمیل کنیم. (تنها زمانی کار می کند که نرم افزار مدیریت ایمیل مثل outlook نصب شده باشد)
Create a mailto link 2
مثالی دیگر از ارسال متن توسط لینک
تگ های لینک در HTML:
| تگ | توضیح |
|---|---|
| <a> |
یک ancher را تعریف می کند. |
- نوشته شده توسط امیر پهلوان صادق
- بازدید: 77368
دیدگاه‌ها
سلام خسته نباشین
در ساید بار سمت چپ صفحه بالا که محل قرار گیری فهرست مطالب است، روی هر لینکی که کلیک میکنیم، قرمز رنگ می شه، از چه خاصیتی برای این کار استفاده نموده اید ؟؟
سلام و درود
برای قرمز شدن لینکی که روی آن کلیک شده است از PHP و CSS کمک گرفته ایم، در واقع زمانی که روی لینک کلیک می شود، کلاس active به تگ a که همان لینک ما است اضافه می شود:
a.active {
font-weight: bold;
color: red;
}
با عرض سلام و خسته نباشین ،ممنون از سایت خبتون
سوالم اینه که ایا اتربیوت media و اون مقادیری که داره آیا نیازی هست کامل یاد گرفته شه و کاربردی هست ؟ یا یاد گرفتن اون فایده ی چندانی نداره؟
سلام و درود
قانون media@ به شما اجازه می دهد تا styleهای مختلفی را برای رسانه های (مثل مونیتور یا کاغذ پرینت شده) متفاوت تعریف کنید. و لازم هست که کامل اون رو فرابگیرید.
سلام و عرض ادب
در حالی که در توضیج تگ های name و id در این صفحه عنوان کردید هر دو در css بگار رفته و در html5 به بعد بجای name از id استفاده می شود در واقع id را چایگزین name معرفی کردیندر پاسخ یکی از کابران فرمودید : نقل قول:
سلام و درود
در واقع عرض کرده ایم که "با استفاده از name یا id می توانیم در CSS یا JavaScript به عنصر دسترسی داشته باشیم." و این جمله شما کهدر مقاله بالا گفته شده:
نقل قول:
فرمودید "در html5 به بعد بجای name از id استفاده می شود" اشتباه است.
با تشکر از پاسخ شما
اما این موردی که فرمودین من اشنباه می کنم (اینکه در html5 از id بجای name استفاده می شود) از همین توضیح بالا استنباط می شود: نقل قول:
عالی بود.
ممنون بابت سایتتون
عالی
سلام وقت بخیر.سوالی داشتم که چه خصوصیتی در تگ a وجود داره که میتونه زیر خط لینکها رو برداره و با رفتن ماوس روی آن تغییر رنگ بده نوشته؟
سلام، لطفا آموزش زیر رو مطالعه فرمایید:
beyamooz.com/css/85-style/90-%D9%84%DB%8C%D9%86%DA%A9-%D9%87%D8%A7-%D8%AF%D8%B1-css
سلام وقت بخیر ممنون بابت سایت و آموزش هاتون.
بنده یه سوال کلی داشتم.
به طور کلی هر تگ چه خواصی رو می تونه بگیره؟
آیا لیستی از تمام خصوصیات موجود هست؟
سلام، توجه داشته باشید که هر تگی در HTML می تواند ویژگی های منحصر به خود را داشته باشید، بعنوان مثال ویژگی "target" در تگ a فقط مخصوص همان تگ است. اما یکسری ویژگی داریم که در تمام تگ ها قابل استفاده اند.
مانند:
1- ویژگی style
2- ویژگی id
3- ویژگی class
برای مشاهده لیست کامل ویژگی های عمومی به لینک زیر مراجعه فرمایید:
beyamooz.com/tags/1939-attributes-list
توجه داشته باشید که برای یادگیری ویژگی هایی که منحصر به هر تگ است، باید اطلاعات خود را در مورد تگ ها کامل نمایید.
آموزش لینک ها در HTML عالی بود.
سلام و مرسی از سایت خوبتو من دو تا سوال داشتم
1- در قسمت لینک به داخل صفحه جاری، وقتی فقط ویژگی name را در تگ a تنظیم می کنم، متنی که بین تگ a باز و بسته گذاشته ام بصورت لینک نمایش داده نمی شود ...!؟
2- چطور می تونم به با کلیک روی یک لینک به قسمتی دلخواه، داخل همان صفحه منتقل یا اسکرول شویم؟
سلام
1- در تگ a، تا زمانی که ویژگی href را تنظیم نکنید، بصورت لینک (زیر خط) نمایش داده نمی شود.
2- برای لینک به قسمتی دلخواه داخل صفحه جاری مراحل زیر باید طی شود:
مرحل 1: ابتدا قسمتی که قرار است به آن منتقل شویم را مشخص کنید و برای تگ مورد نظر ویژگی name را با یک مقدار دلخواه تنظیم کنید.
<h2><a name="C4">Chapter 4</a></h2>
مرحله 2: در ادامه باید در بالای صفحه یک تگ a تعریف کنید و ویژگی href آنرا بصورت زیر تنظیم کنید:
<a href="#C4">See also Chapter 4.</a>
مثال خودتان امتحان کنید بالا، در لینک زیر آمده است:
beyamooz.com/try_it_yourself/tryit.php?filename=tryhtml_link_locations
سلام خط زیر لینک ها را چطور حذف کنم؟
سلام، برای حذف خط زیر لینک ها، از ویژگی text-decoration بصورت زیر استفاده کنید:
style="text-decoration:none"
سلام وقت بخیر
من نکته زیر رو نمیفهمم یعنی چی؟ شما گفتین آدرس فولدر ولی چرا آدرس سایت گذاشتین؟
نکته: اگر می خواهید یک فولدر در یک سایت را آدرس دهی نمایید، همیشه یک slash به انتهای آن اضافه کنید. مانند زیر:http://www.beyamooz.com/html/
در غیر اینصورت، دو درخواست به سرور ارسال کرده اید، سرور ابتدا یک slash به انتهای آدرس اضافه می کند و سپس آدرس را بارگذاری می کند.
سلام، اگر در جمله بالا، به قسمت قرمز رنگ توجه کنید، متوجه خواهید شد...!
ببخشید می شه درمورد مثال "break out of a frame" بیشتر توضیح بدید در چه شرایطی هست؟؟
سلام
تصویر بفرمایید یک نفر کل سایت بیاموز را داخل یک iframe و در سایت خودش به نمایش بگذارد، بنحوی که iframe مذکور کل Page را بپوشاند، به این ترتیب کاربران سایت دوم متوجه نمی شوند که سایت بیاموز داخل یک iframe است و اگر لینک های سایت بیاموز معمولی باشند و خصوصیت target آنها با مقدار "top_" یا "parent_" تنظیم نشده باشد، مقصد لینک ها همچنان تحت همان iframe باز خواهند شد.
حالا راه حل خارج شدن از iframe مذکور و نمایش مقصد لینک ها تحت دامین beyamooz.com استفاده از خصوصیت target با مقدار "top_" یا "parent_" است.
parent: باعث میشه که لینک مرتبط در فریم والدش باز بشه. (زمانی که داخل صفحه‌ی وب فریم به کار رفته باشه، و داخل فریم لینکی با خاصیت parent وجود داشته باشد.)
top: باعث میشه که لینک مرتبط در بالاترین فریم یا در واقع همان کل بدنه پنجره‌ی مرتبط باز بشه.
سلام خسته نباشین
در مورد ویژگی name و id در تگ لینک بیشتر توضیح میدین ممنون
سلام
از هر دو ویژگی برای پیدا کردن یک عنصر خاص در صفحه استفاده می شود. بعنوان مثال تصور فرمایید که بخواهید پس زمینه یک عنصر خاص را تغییر دهید، خوب اولین کاری که باید انجام دهیم پیدا کردن عنصر مورد نظر است.
اما از id بیشتر در CSS و javaScript استفاده می شود، اما از name بیشتر برای پاس دادن محتوای فیلدها به سرور و پردازش آنها توسط PHP و یا ASP استفاده می شود.
اما در انتهای یک مثال واضح تر می زنم تا با کاربرد آنها بیشتر آشنا شوید. در جمع خانواده اگر کسی با شما کار داشته باشه، اسم کوچیک شما رو صدا می زنه و شما رو خطاب قرار می ده (id) اما در ثبت احوال برای پیدا کردن اطلاعات شما باید از کد ملی استفاده کنیم (name)
با سلام.
تشکر میکنم از شما برای اموزش عالی و کاملتون تو زمینه های مختلف...
یه مشکلی که هست نمیدونم ایا من جلو تر اموزشئ ندیدم ک اینو میگم یا هر چی دیگه قسمتی از اموزش ک نیاز به یه توضیح مختصری داره شما داخل تمرین ها قرار دادید ک خوب و اونطوری که باید متوجه شم نمیشم.مثل لینک بصورت ایمیل برای چند نفر که چرا از علامت سوال استفاده کردید cc چجوریاس و چنتا میتوان استفاده کرد......ایا این توضیحاتو در اموزش های اینده میدید یا نه....مرسی
سلام.ممنون
اگه چیزی رو متوجه نشدید اشکالی نداره و به جلو بروید بعدا کم کم خودتون متوجه خواهید شد. در صورتی هم که نکته ای براتون مبهم باقی موند توی نظرات اعلام کنید تا بهش پاسخ داده بشه.
سلام.
من بعد از گذراندن درس ifram اومدم این درس و خواستم خصوصیت target رو با هر چهار حالتش در موقعیت فریم توی یک فریم دیگر امتحان کنم. کد html امتحانی من هم این بود
<!DOCTYPE html>
<html>
<body>
<p>Locked in a frame? </p>
<a href="http://ww w.beyamooz.com/ " target="_parent ">Click here! </a>
<iframe src="http://www .eskandaritools .com/" width="350px" height="250px" gt<&/iframe>
</body>
</html>
در انتهای سایت ذکر شده نام پدید آورنده سایت به صورت لینک اومده. حالا اگه اشتباه نکرده باشم میشه گفت من یک فریم داخل فریم (خودتان بیازمایید) درست کردم. با راست کلیک روی لینک گفته شده و فعال کردن inspect و تغییر خصوصیت target به حالت parent من انتظار داشتم لینک سایت پدید آورنده در داخل فریم (خودتان بیازمایید ) باز بشه که نشد و تمام صفحه باز شد. مثل حالت top. نمیدونم خصوصیت parent رو بد متوجه شدم یا این فریم در فریمی که دارم امتحان میکنم درست نیست. لطفا راهنماییم کنید.
سپاس
با سلام. چند کامنت پایین‌تر توضیح دادم.
با سلام.
دوست عزیز همونطور که خودت هم می‌بینی، کد htmlت اینجا نیومده. زمانی که قصد داری کد html بذاری باید به جای > از علامت ;lt& و به جای < از علامت ;gt& استفاده کنی.
خط اصلی چیزی که نوشتم این بود.
iframe src="http://www .eskandaritools .com/" width="350px" height="250px" framborder="5"
در ضمن منظورتون از علامتهای جایگزین >, < رو متوجه نشدم. برای همین فقط خط مربوط به iframe رو بدون براکتها نوشتم تا شاید نشون داده بشه. یک دستور که یک فریم داخل فریم خودتان بیازمایید ایجاد میکنه و در صفحه اصلی سایت ، اون پایین لینک یک سایت دگه اومده که میخواستم به جای اینکه توی فریم درست شده توسط خودم ظاهر بشه ، در فریم (خودتان بیازمایید) ظاهر بشه.
دوست عزیز چند بار متن رو خوندم،ولی متوجه نشدم مفهوم سؤال رو.
ممنون از پاسخ سریعتون. نمیدونم چرا کدی که نوشته بودم اینجا نشون داده نشد.
در کل آیا امکانش هست با ذکر یک مثال عملی ، فرق parent رو با top و blank نشون بدین؟
دلیل اینکه نشون داده نشده به این خاطر هست که زمانی که شما مستقیما از علامت > و < استفاده کنید، این علامت‌ها رو به عنوان تگ در نظر میگیره و توسط کدهای داخل برنامه ignore میشه. اما اگه به جای علامتهای فوق ;lt& و ;gt& استفاده کنید به همین صورت ذخیره میشه و موقع نمایش این علامت‌ها تبدیل به علامتهای > و < میشه و این رو تداعی میکنه که انگار تگ html نوشته شده است.
این رو در نظر داشته باشید که اگه واقعا تگ html در مرورگر نوشته بشه، شما اون رو به صورت تفسیر شده می‌بینید. یعنی مرورگر اون رو تفسیر میکنه و نتیجه رو به شما نشون میده.
------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
اما در مورد سؤال دوم:
blank: باعث میشه که لینک مرتبط در تب یا پنجره‌ی جدید باز بشه.
self: باعث میشه که لینک مرتبط در همان تب یا پنجره باز بشه.
parent: باعث میشه که لینک مرتبط در فریم والدش باز بشه. (زمانی که داخل صفحه‌ی وب فریم به کار رفته باشه، و داخل فریم لینکی با خاصیت parent وجود داشته باشد.)
top: باعث میشه که لینک مرتبط در بالاترین فریم یا در واقع همان کل بدنه پنجره‌ی مرتبط باز بشه.
framename: باعث میشه که لینک مرتبط در فریمی با نام منطبق با framename باز بشه.
با سلام می خواستم بدونم چرا برای آدرس دادن به لینکها همش باید کل ادرسو از ابتدا تایپ کنم حتی چند بار به تمرینات و فایل های ادرس دهی نسبی نگاه کردم اما باز هم متوجه نمی شم ممنون می شم کمکم کنید در ضمن از آموزش عالیتون هم مچکرم
سلام، برای اطلاع دوستان یکبار دیگر انواع آدرس دهی را عرض می کنم:
برای مشخص کردن مقصد یک لینک در تگ a و یا مشخص کردن آدرس عکس در تگ img و ... به دو صورت می توان عمل کرد:
1- آدرس دهی مطلق:
در این نوع آدرس دهی باید آدرس کامل را ذکر کرد، مثلا اگر تصویر در یک پوشه بنام images و در هاست beyamooz.com قرار دارد باید بصورت زیر عمل کنیم:<img src="http://www .beyamooz.com/i mages/test.jpg" />
عیبی که این روش دارد این است که اگر هاست مان تغییر کرد باید تمام آدرس دهی ها را تغییر دهیم. اما توجه داشته باشید، زمانی که مقصد لینک و یا تصویرمان در یک هاست دیگری غیر از beyamooz.com قرار دارد، ما مجبور هستیم که از آدرس دهی مطلق استفاده کنیم.
2- آدرس دهی نسبی:
در آدرس دهی نسبی همان طور که از اسم اش پیداست نسبت به مکان فعلی که در آن قرار داریم آدرس دهی انجام می شود...! بعنوان مثال اگر به آدرس بالای مرورگرتان نگاه کنید، خواهید دید که در ما در حال حاضر در آدرس http://beyamooz.com/html/137-basic قرار داریم بنابراین اگر فولدری در root اصلی هاست با نام images قرار داشته باشد و تصویری با نام test.jpg درون آن باشد برای مشخص کردن آدرس تصویر به یکی از دو روش زیر عمل خواهم کرد:<img src="/images/te st.jpg" />
علامت اسلش در ابتدای آدرس دهی باعث می شود تا به Root اصلی هاست یعنی beyamooz.com منتقل شویم.<img src="/../../imag es/test.jpg" />
در آدرس دهی نسبی بالا، علامت دو نقطه (..) باعث می شود تا بک فولدر به عقب برگردیم.
پس جواب سوال شما دوست عزیز به این صورت می شه که، اولا اگر در مثال های بالا از آدرس دهی مطلق استفاده کرده ایم به این خاطر این موضوع است که درک آدرس دهی مطلق راحتر است و جنبه آموزش دارد و دوما اگر مثال ها را به کامپیوتر شخصی تان انتقال داده اید و در حال خروجی گرفتن از آن هستید، شما باید از آدرس دهی مطلق استفاده کنید و این موضوع به خاطر این است که میخواهید فایلی خارج از کامپیوتر شخصی تان را آدرس دهی کنید.
سلام.
با تشکر از سایت فوق العاده زیبا و موثر شما.
یک سوال:(خواهش میکنم پاسخ دهید برای من خیلی مهم است)
آقای مدیر سایت شما سایت خود را با چه سیستمی پیاده کرده اید؟
بازهم خواهش میکنم پاسخ بدید
با تشکر فراوان از مدیریت سایت
سلام، سایت بیاموز بوسیله سیستم مدیریت محتوای جوملا پیاده سازی شده است.
اگر علاقمند به یادگیری جوملا هستید پیشنهاد می کنم از فیلم آموزش جوملا که توسط خود بنده آموزش داده شده است دیدن فرمایید:
beyamooz.com/product/amoozesh-joomla/%D9%81%DB%8C%D9%84%D9%85-%D8%A2%D9%85%D9%88%D8%B2%D8%B4-%D8%AC%D9%88%D9%85%D9%84%D8%A7-3
آموزش لینک ها در HTML عالی بود.
با سلام خسته نباشید میشه فرق html4 وhtml5 رو بگید ممنون
سلام، لطفا سوالاتتون مربوط به مطلب باشه ....!
HTML5 یک نسخه به روز شده از HTML4 هست یعنی در HTML5 عناصر و ویژگی های جدیدی وجود دارد که کار پیاده سازی سایت ها را بسیار ساده تر کرده است. بعنوان مثال برای پخش صدا و ویدئو در HTML4 عنصری وجود ندارد اما در HTML5 عناصر audio و video برای پخش صدا و ویدئو اضافه شده است.
سلام خسته نباشین
لطفا در مورد ایجاد یک لینک به محل مشخصی در صفحه ای دیگر یک مثال بزارین
ممنون میشم با تشکر از آموزش های خوبتون
سلام
انجام این کار بسیار ساده است.
1- برای عنصری که در صفحه مقصد می خواهید منتقل شوید، یک id دلخواه مثلا test تنظیم نمایید.<h1 id="test" />
2- حالا کافی است در انتهای لینک از علامت # بعلاوه id تنظیم شده در مرحله قبل استفاده کنید.
به این ترتیب زمانی که روی لینک کلیک می شود، بلافاصه به صفحه مقصد منتقل شده و بصورت اتوماتیک صفحه اسکرول می خورد و روی عنصر با id یا شناسه test قرار می گیرد.
<a href="/beyamooz. com/amozesh.php #test" />
با سلام ممنون از سایت خوب و مفیدتون
با سلام
لطفا راجع به ارسال متن توسط لینک توزیح بیشتری بدید.
سلام خسته نباشید
خصوصیات #tips به چه کار می اید؟
در صحفه خودتان امتحان کنید امتحان کردم ولی تغییر خاصی اعمال نشد لطفا یکمی توضیحات بدید .
تشکروسپاس
با سلام خدمت شما دوست عزیز و گرامی
واژه tips در این جا فقط در حد یک id هستش و در یک جا از آموزش در لینک قرار گرفته است اگر شما مباحث مربوط به سی اس اس را خوانده باشید وقتی یک المان یا عنصری را دارای شناسه خاص میکنید بعد در جایی میخواهید آن را صدا بزنید و از آن عنصر استفاده کنید باید نام آن عنصر را به همراه یک علامت # در ابندا بیاورید
مثلا شما یه عنصر با یه ای دی خاص تعریف می کنید و حالا مثلا میاید پایین صفحه یه لینک قرار میدید و میگید اگه رو لینک کلیک شد برو به اون عنصر با ای دی خاصی که در بالا تعریف کردم و قبلش برای دسترسی به اون عنصر باید علامت # قرار بدید و هر وقت رو لینک کلیک کنید دقیق میره همونجایی از صفحه که عنصری با شناسه ای که شما تعریف کردید ایجاد شده
مشکلی داشتید بپرسید
من و همکارانم در خدمتتون هستیم
برای این که بهتر جواب سوالات خودتون رو بگیرید در انجمن بیاموز مراجعه کنید من و همکاران در اونجا هستیم
http://beyamooz.com/forum/
تشکر
سلام خسته نباشید روز بخیر.
من مثال اولی که مربوط میشه نحوه ایجاد یک عکس به عنوان یک لینک را در ویرایشگر خودم که نوت پد هستش کپی کردم و وقتی با IE یا کروم یا موزیلا بازش می کنم عکس یا همون شکلک را نشون نمیده و به جاش یه کادر که توش علامت ضربدر هستش نشون میده این اشکال از چی میتونه باشه؟؟؟؟؟
مطلب بعدی که ممنون میشم راهنمایی کنید اینه که این دستورات لینک کردن و اینا یه کم داره منا گیج میکنه چون تا بخوام همش را یاد بگیرم روز بعد یادم رفته مدام هم دارم تمرین می کنم ولی بازم یادم میره به نظر شما چه کار کنم تو ذهنم بمونه؟؟؟
با سلام.
علامت ضربدر داخل عکس نشان دهنده ی این است که آدرس یا مسیر عکس اشتباه هست و به این دلیل عکس نمیتونه لود بشه. باید آدرس رو چک کنید. (برای اینکار حتی میتونید آدرس عکس رو به تنهایی در یک تب جداگانه باز کنید. اگر عکس نمایش داده بشه، آدرس درست هست و اگر نه که آدرس عکس، غلط هست.)
در مورد دستورات لینک کردن و یادگیری هم میشه گفت که ممارست و تمرین همیشه جواب داده. شما ابتدا مطلب رو خوب یاد بگیرید، بعد از اون با تمرین کردن، اون مطلب تا حدود زیادی ملکه ذهن شما خواهد شد.
انجام پروژه های کوچک مطالب رو در ذهن شما تثبیت میکنه.
با سلام و خسته نباشی
واقعا سایت پرباری دارید مرسی
سلام. دو تا سوال داشتم.
۱- برای آدرس دهی حتما باید http:// رو هم وارد کنیم؟ چون بدون اون خطا میده!
۲- توی تگ لینک خصوصیت target چه مقدار های دیگه ای میتونه داشته باشه؟
ممنون!
با سلام
1- آدرسی که در جلوی پارامتر href قرار می گیرد باید آدرسکامل صفحه مورد نظر باشد به همراه http.
2- خصوصیت target نحوه باز شدن و نمايش پنجره صفحه مقصد را تعيين می کند که دارای حالت های زير است :
- blank_ : نمایش محتوای لینک در پنجره جدید.
- parent_ : نمایش محتوای لینک در پنجره والد (معمولا در حالتی استفاده می شود که لینک از یک frame فراخوانی شود).
- self_ : نمایش محتوای لینک در پنجره فعلی (حالت پیش فرض).
- top_ : نمایش محتوای لینک در بالاترین سطح (معمولا در حالتی استفاده می شود که چند frame در صفحه وجود داشته باشد و بخواهیم محتوای لینک خارج از فریم ها و در بالاترین سطح نمایش داده شود).
سلامو خسته نباشید
1)در مورد targetمن دقت کردمparent,topع ین همن وblank ,framename هم دقیقا عین همن پس چرا تکراری داریم؟وچرا تو قست خودتان امتحان کنید قبلش underlineمیزاره من بدون underlineنوشتم نه خطا داد و نه مشکلی پیش اومد
2)یعنی چی سایت ما در فریم محصوره؟اگر میشه سایتی مثال بزنین
سلام
برای تکمیل صحبت خانم مهندس دوستی، به دو صورت می توانیم ویژگی href را در تگ a آدرس دهی کنیم:
1- مطلق: در این روش، آدرس بصورت کامل ذکر می شود.
مثال: <a href="http://ww w.beyamooz.com/ php/myfile.php" > file </a>
توجه داشته باشید که در آدرس دهی مطلق حتما باید نوع پروتکل صفحات ذکر شود یعنی برای صفحات وب معمولی باید http و برای صفحات وب امنیتی https در آدرس گفته شود.
2- نسبی: در این روش آدرس را بصورت کامل ذکر نمی کنیم، در واقع، قسمت دامین یعنی http://www.beyamooz.com ذکر نمی شود. تصور نمایید که در فولدر manage هستیم و می خواهیم در فایل index.html از یک لینک استفاده کنیم. این لینک به فایلی در روت اصلی پروژه لینک است. بنابراین خواهیم داشت: <a href="/../user. html" > file </a> شاید بپرسید چرا به این صورت عمل می کنیم، و چرا آدرس کامل را ذکر نمی کنیم ...!؟ جواب اینکه اگر زمانی تصمیم بگیرید که پروژه تان را روی یک دامین دیگر قرار دهید و یا بخواهید پروژه را به یک مشتری دیگر بفروشید، آن موقع به مشکل برخواهید خورد و باید تمام آدرس دهی ها را با دامین جدید عوض کنید، در صورتی که در آدرس دهی نسبی، هیچ کار خاصی نیاز نیست که انجام دهید.
حالا برگردیم به سوال شما ...!
شما ابتدا باید با عنصر ifram خوب آشنا بشید بنابراین به مطلب زیر مراجعه کنید و بعد از اینکه کامل با این عنصر آشنا شدید، ادامه جواب بنده را مطالعه فرمایید:
beyamooz.com/html/137-basic/347-%D9%86%D9%85%D8%A7%DB%8C%D8%B4-%DB%8C%DA%A9-%D8%B5%D9%81%D8%AD%D9%87-%D9%88%D8%A8-%D8%AF%D8%B1%D9%88%D9%86-%D8%B5%D9%81%D8%AD%D9%87-%D9%88%D8%A8-%D8%AF%DB%8C%DA%AF%D8%B1-%D8%AF%D8%B1-html
خواهشاً مثال خودتان امتحان کنید زیر را باز کنید:
www.beyamooz.com/try_it_yourself/tryit.php?filename=tryhtml_frame_getfree
همان طور که در این مثال مشاهده می کنید، لینک مورد نظر ما در یک iframe محصور است، زمانی که روی لینک "Click here" کلیک می شود، بدلیل اینکه از خصوصیت target با مقدار "top_" استفاده شده است، مقصد لینک، در یک صفحه ی کاملاً مجزا باز می شود. در صورتی که اگر ویژگی target تنظیم نشده بود و یا با مقدار "self_" تنظیم شده بود، مقصد لینک در همان iframe باز می شد.
حالا با تفاوت "top_" و "self_" برای ویژگی target آشنا شدید. اما می مونه تفاوت "top_" و "parent_" ...!
تصور فرمایید، صفحه ای که داخل یک iframe باز کرده ایم، خودش نیز شامل یک iframe است یعنی iframe های تودرتو داریم. در اینجا اگر لینکی داشته باشیم و بخواهیم که در صورت کلیک شدن روی آن مقصدش کاملاً در یک صفحه جدید باز شود باید از "top_" استفاده کنیم و اگر بخواهیم مقصد لینک در فریم پدر باز شود، باید از مقدار "parent_" استفاده شود.
با سلام
ببخشید اگه میشه در مورد nameوidبیشتر توضیح بدین.
چه موقع استفاده میشه؟
تفاوت هاشون چیه ؟البته توضیح داده بودین ولی من متوجه نشدم اگه میشه بیشتر توضیح بدین واگه زحمتی نیست یه مثال هم بزنین.
با سلام
name زمانی ارسال می شود که بخواهید اطلاعات یک فرم را ارسال کنید. به عنوان مثال ممکن است شما در فرم خود چندین دکمه رادیویی داشته باشین که هر کدام دارای id متفاوت اما همه آنها دارای یک name هستند و زمانی که شما یکی از دکمه های رادیویی را انتخاب می کنید id آن است که مشخص میکند کدام دکمه را انتخاب کرده اید.
خسته نباشید
هر کدوم از اجزای این بخش دقیقا چیکار می کنن؟
Subject=Hello%20again؟
ممنون.
در یک url ، اگر بخواهیم پارامترهایی را به فایل php مورد نظر ارسال کنیم از یک علامت ؟ استفاده می کنیم و بعد از آن پارامتر مورد نظرمون رو ارسال می کنیم(در اینجا پارامتر ما Subject=Hello againاست).
عبارت 20% هم مشخص کننده ی فاصله های بین کلمات است در url.
سلام و خسته نباشید
برای لینک دادن از طریق تصویر برای مثال این قسمت src="/smiley.gif " از کجا آورده میشه . بعد alt="HTML tutorial" به چه معناییه؟
و همینطوره کار border="0" چیست؟
سلام
به کد زیر توجه کنید:
<a href="http://www.beyamooz.com">
<img border="0" src="/smiley.gif " alt="HTML tutorial" width="32" height="32" />
</a>
شما باید آدرس تصویر خودتون رو داخل خصوصیت src قرار دهید. همچنین توضیحی در مورد عکس خود رو باید در داخل خصوصیت alt قرار بدید و برای مشخص کردن اندازه ی کادر دور تصویر میتونید از خصوصیت border استفاده کنید.
ممنون. آدرس عکس رو از کجا میاد. برای مثال باید از یه سایت دیگه عکس رو آپلود کرد و آدرسشو اینجا قرار داد؟
بله همین طور هست.
سلام.من اول htmlرو با سایتهw3shoolشرو ع کردم الان اتفاقی به این سایت برخورد کردم الان یه سوالی دارم.همون w3schoolادامه بدم یا سایت شما بهتره؟ایا سایته شما مطلب اضافه یا کم داره نسبت به w3school?
با سلام
مطالب سایت ترجمه شده مطالب سایت w3shool است. تلاش تیم بیاموز در جهت پوشش کامل مطالب سایت w3shool و در صورت امکان ارائه نکاتی بیشتر است.
سلام روزتون بخیر باشه
منم یه مشکل مثل این خانم دارم یه سایت با div طراحی کردم و با استفاده از ifram سایت مورد نظرمو وسط سایت اصلی باز می کنم اما می خوام بدونم بدون ifram با استفاده از خود div میتونم این کار رو انجام بدم در ضمن کد بالا رو تو جاوا زدم هیچ اتفاقی نیفتاد
ممنون از سایت فوق العاده عالیتون
سلام، پیشنهاد می کنم کمتر از عنصر ifram استفاده کنید، این موضوع بخاطر این است که بیشتر موتورهای جستجو مثل گوگل، محتوای داخل ifram را ایندکس نمی کنند...!
با استفاده از div، هرگز نمی توانید یک صفحه را داخل صفحه ای دیگر، باز کنید، اما اگر با دستور include در PHP آشنا باشید، براحتی می توانید این کار را با استفاده از آن انجام دهید.
برای کسب اطلاعات بیشتر در مورد دستور include به لینک زیر مراجعه فرمایید:
beyamooz.com/php/81-advance/81-%D8%AF%D8%B1%D8%AC-%DA%A9%D8%B1%D8%AF%D9%86-%DB%8C%DA%A9-%D9%81%D8%A7%DB%8C%D9%84-php-%D8%AF%D8%B1-%DB%8C%DA%A9-%D9%81%D8%A7%DB%8C%D9%84-php-%D8%AF%DB%8C%DA%AF%D8%B1
سلام خسته نباشید عالی بود
من علاقه زیادی به برنامه نویسی داشتم ولی هیچ ذهنیتی نسبت بهش نداشتم و به عبارتی صفر صفر بودم اما از وقتی با سایت شما آشنا شدم در عرض سه چار روز زمین تا آسمون تغییر کردم فعلا نصف دوره مقدماتیو مطالعه کردم ایشالا اینو تموم کنم می رم دوره پیشرفتتونم می خونم فقط سوالی که داشتم اینه که آیا با اتمام دوره ی مقدماتی و پیشرفته من می تونم خودم یک سایت رو برنامه نویسی کنم؟ و لطفا اگه کتاب یا سایت دیگه ای هست که نیازه کناره این مطالب مطالعه کنم بهم پیشنهاد بدینش متشکر واقعا خسته نباشید
سلام، بهتون تبریک می گم، اولین چیزی که باید در وجود هر هنرجو باشه، علاقه است و این در وجود شما هست. بعد از مطالعه ی HTML باید به سراغ CSS برید و سپس PHP یا ASP.Net ...
اگر آموزش های این سایت را به صورت کامل و دقیق مطالعه فرمایید و مثال ها را بصورت کامل انجام بدهید، مطمئناً در انتها به یک طراح خوب تبدیل خواهید شد.
واقعا من موندم ، چرا هیچ کدوم از ادمین ها یک بار هم کار با JSP Servlet رو پیشنهاد نمیدن ... من تقریبا خیلی خوب این روش طراحی سمت سرور رو بلدم ولی متاسفانه یک شرکت بزرگ هم نیست که مایل به اجرای پروژه ها با این روش باشه ...همه جای دنیا کار با جی اس پی پیشنهاد میشه ولی اینجا انگارنه انگار .....
بایت سایت خوبتون تبریک میگم ...واقعا خیلی خوبه
با سلام و تشکر از سایت بسیار بسیار خوبتون.
یه سوالی داشتم شما فرمودین target="_top لینک را در صفحه ای مجزا باز میکند در صورتی که در همان صفحه باز میکند. حتی تو آدرسی که برای مثال در جواب سارای عزیز هم دادین رفتم، باز هم در همان صفحه باز میکرد.
آیا من اشتباه متوجه منظورتون شدم؟
سلام، ممنون ...
همان طور که قبلاً در مورد مقدار top_ توضیح داده شد، زمانی ویژگی target را با مقدار top_ تنظیم می کنیم که لینک مورد نظرمان داخل iframe باشد، در غیر اینصورت top_ تأثیری نخواهد داشت و مقصد لینک در همان صفحه جاری باز خواهد شد.
بنابراین زمانی از مقدار top_ استفاده کنید که لینک تان داخل iframe باشد و بخواهید مقصد لینک در iframe باز نشود و در واقع در یک صفحه جدید باز شود.
سلام
یه سوال دارم، در کد زیر:<a name="tips">Useful Tips Section</a&g t;منظور از tipe چیه؟<a href="#tips">Visit the Useful Tips Section</a>
تو اینجا الان سیستم از کجا میفهمه محل مورد نظرمونم که بهش لینک دادیم کجاست؟
سلام
با استفاده از ویژگی name و مقدار آن یعنی tips که یک نام دلخواه است می توان به عناصر داخل صفحه دسترسی داشت و به اصطلاح آنها را پیدا کرد ...!
پس حالا هر زمان که نیاز باشد می توانیم به عنصر a با عنوان "Useful Tips Section" دسترسی داشته باشیم.
اما در تگ a دومی، ویژگی href را با tips# تنظیم کرده ایم، با این کار زمانی که روی آن کلیک می شود، صفحه اسکرول کرده و به تگ a اول منتقل می شود.
توجه: بجای تگ a اول، می توانیم از هر تگ دیگری استفاده کنیم. بعنوان مثال ممکن است بخواهید برای عناوین متن که h1 هستند یک فهرست در ابتدا داشته باشید. مانند مطالب زیر:
www.beyamooz.com/photoshop/329-selections/2408
با سلام و خسته نباشید به شما دوست عزیز......
راستش من برای پروژه دانشگاهم باید یک سایت با کد html طراحی کنم.هر سایتی رو دیدم هیچ کدومش به خوبی سایت شما نبود و بیشتر ایده های سایتم رو از سایت شما گرفتم.
حالا میخوام در طراحی سایتم بهم کمک کنید...و الان به یه مشکلی برخوردم که کدش یادم رفته.سرچ کردم اما پیدا نکردم..
سوالم اینه که میخوام یه لینکی در صفحه بزارم که در وسط همون صفحه باز بشه و وقتی رویش کلیک میکنیم یه صفحه ی دیگه باز نشه و تو خود همون صفحه باز بشه...امیدوارم منظورم رو فهمیده باشی...
لطفا راهنماییم کنیم.
راستی وقتش رو دارید که در ساختن سایتم کمکم کنید؟؟؟؟؟
سلام
برای باز شدن مقصد لینک در یک پنچره جدید به صورت زیر عمل نمایید:<a href="#" onclick="window.open('http://www.beyamooz.com/',
null,
'height=300 ,
width=550,
top=100,
left=250,
resizable=1,
channelmode= 0 ,
directories=0 ,
fullscreen=0 ,
location=0 ,
menubar=0,
scrollbars=1 ,
status=1,
titlebar=0,
toolbar=0'
);">Beyamooz</a>
برای تکمیل پروژتون اگر کمکی از دستمون بربیاد در خدمتتون هستیم.
سلام من منظورتون رو نفهمیدم یه بار دیگه راهنمایی کنید
مثلا اگه رو اموزش اچ تی ام ال کلیک کنیم وسط صفحه باز بشه
سلام
یکبار دیگر به قسمتی که در کد بالا با رنگ قرمز متمایز شده است توجه فرمایید، در واقع این کد یکی از دستورات JavaScript است که باعث باز شدن یک صفحه جدید می شود. دستور window.open چندین پارامتر دارد که با علامت , از هم جدا شده اند. در زیر به تعدادی از این پارامترها اشاره شده است:
پارامتر 1: آدرس صفحه ی مورد نظر شما
پارامتر 2: نام پنجره
پارامتر 3: ارتفاع پنجره
پارامتر 4: عرض پنجره
پارامتر 5: فاصله پنجره از بالای مونیتور
پارامتر 6: فاصله پنجره از سمت چپ مونیتور
...
در ضمن توجه داشته باشید که دستور window.open به ازای رویداد onclick رخ می دهد، یعنی زمانی که روی لینک کلیک شود.
یک خسته نباشید واقعی خدمت مدیران
1- آیا name با id یکی هست وهیچ تفاوتی ندارند
2- آیا می توان بجای name از id استفاده کرد چگونه
تشکر
1- با استفاده از id می توان در JavaScript و CSS و jQuery به عنصر دسترسی پیدا کرد ولی name برای دسترسی به عنصر سمت سرور (PHP یا ASP.Net) استفاده می شود. (معمولاً مقادیر تنظیم شده برای این دو ویژگی یکسان است)
2- خیر
با سلام
من قسمت چگونه از یک فریم بیرون بیاییم. (اگر سایت شما در یک فریم محصور است)
رو نفهمیدم؟ میشه بیشتر توضیح بدید
و سوال دیگر اینکه با اون لینک که تو صفحه ساختیم، متن تو اون صفحه به طور خودکار ایمیل میشه؟درسته؟
و مثال اخر کاربردش چیه؟
اگر زحمتی نیست پاسخ بدید باتشکر
سلام،
سوال 1: همان طور که گفته شد با تگ iframe می توانید یک سایت یا یک page دیگر را در سایت خودتون باز کنید.
حالا اگر در صفحه ای که داخل فریم قرار گرفته، لینکی وجود داشته باشد و کاربر روی آن کلیک کند، چند حالت پیش روی شماست:
1- "target="_top: در این حالت مقصد لینک در یک صفحه ی مجزا باز می شود.
2- "target="_paren t: مانند بالا...
3- ویژگی target تنظیم نشود: در این حالت مقصد لینک مذکور، در همان فریم باز خواهد شد.
سوال 2: بله
سوال 3: در دو مثال آخر مطلب بالا، قصد داشته ایم نشان دهیم که با استفاده از تگ a نیز می توان به ازای کلیک روی آن یک ایمیل را ارسال نمود، که البته زیاد کاربردی نیست ...!
خیلی ممنون
واقعا متشکرم
با سلام و خسته نباشید فراوان خدمت مدیر عزیز
میخواستم ببینم این تکه کد زیر معنیش چیه و واسه چی استفاده میشه
"alt="HTML tutorial
در مثال "نحوه ایجاد یک عکس به عنوان یک لینک"
سلام، ممنون ...
با استفاده از ویژگی alt می توان زمانی که در لود عکس مشکلی پیش آمد، یک متن جایگزین را نمایش داد.
alt مخفف alternate بمعنی جایگزین است.
سلام ،مرسی از کارخوبتون دارم بصورت جدی آموزش ها رو دنبال می کنم
سلام
اول اینکه خسته نباشید،سایت خوبی دارین
اما سوالم،منظورتون از فریم و اینکه سایت تو یک فریم محصور باشه چیه؟
سلام، ممنون ...
همان طور که می دونید با تگ iframe می تونید یک سایت یا یک page دیگر را در سایت خودتون باز کنید، البته تحت دامین شما ...!
همین الان که در خدمت شماییم، شاید بیش از 10 سایت مختلف، بیاموز رو با تگ iframe در سایت خودشون باز می کنند و البته با نام دامین خودشون ...!
حالا شما بگید، این همه لینک داریم تو این سایت، یعنی هر صفحه ای رو که باز می کنید، بیش از 50 لینک مختلف رو مشاهده می کنید، حالا اگر بیاموز با iframe محصور شده باشد، و کاربرای سایت x روی لینک ها کلیک کنند، آیا درسته که، صفحه ی مورد نظر باز در همان سایت x باز بشه ...!؟
برای برون رفت از این مشکل، کافیه که برای تمام لینک هاتون خصوصیت target را با مقدار "top_" تنظیم نمایید.
سلام
در مورد اینکه گفتید برای تمام لینک هاتون خصوصیت target را با مقدار "top_" تنظیم نمایید بیشتر راهنمایی کنید؟دقیقا چه اتفاقی میفته؟خب من امتحان کردم مثلا ادرس سایت بیاموز رو به عنوان لینک گذاشتم تو سایت خودم وقتی روش کلیک میکنم باز تو همون صفحه خودم باز میشه تمام لینکهای بیاموز هم تو صفحه خودم باز میشه
سلام
بله حق با شماست، زمانی که لینک مورد نظرمان در iframe نباشد، و مقدار "top_" برای ویژگی target آن تنظیم شود، تأثیری نخواهد داشت و در واقع مقصد لینک مورد نظر در همان صفحه جاری باز می شود.
اما مقدار "top_" زمانی کاربرد پیدا می کند که روی لینکی تنظیم شود که داخل یک iframe محصور شده باشد. در این صورت مقصد لینک، بجای اینکه در iframe باز شود در یک صفحه جدید باز خواهد شد:
مثال زیر به درستی استفاده از مقدار "top_" را نشان می دهد، لطفاً مقدار آنرا تغییر داده و نتیجه را مشاهده نمایید:
www.beyamooz.com/try_it_yourself/tryit.php?filename=tryhtml_frame_getfree
سلام فقط می خواستم از شما تشکر ویژه کنم بابت زحماتتون وسایت فوق العاده تون
سلام واقعا سایت خوبیه
انشاالله که بتونم تا اخرش بخونم
سلام مرسی از اموزش خوبتون
من وقتی کد لینک عکس رو تعریف میکنم عکس مورد نظرمو تو صفحه وبم نمیاره فقط یه مربع کوچیک به عنوان لینک نشون میده و روش که کلیک میکنم این صفحه باز میشه This webpage is not found
لطفا خیلی زود راهنمایی کنید ممنون ن ن
سلام، این طور که من متوجه شدم، شما از یک عکس داخل عنصر a استفاده کرده اید، که البته بدلیل درست آدرسی دهی نکردن خصوصیت src در عنصر img، عکس مورد نظرتون در مرورگر، نشان داده نمی شود ...!
البته در ادامه با توجه به خطای "This webpage is not found" بنظر می رسد، که خصوصیت href را نیز برای تگ a درست تنظیم نکرده اید.
لطفاً با دقت بیشتری موارد بالا را اصلاح کنید و نتیجه را اعلام نمایید.
سلام منم دارم میخونم خیلی برام جالبه.....
الان ساعت یه ربع به دو نیمه شبه ...
والا خسته شدم بقیه اش باشه برا یه وقت دیگه اما خیلی برام جذابه ...
ان شاالله تا آخر ادامه بدم..
ممنونم از همه شما.
من همچنان دارم میخونم ^_^
مرسی
چه جوری کد ها و تگ هایی را که در notepadنوشته ایم در صفحاتی اینترنتی که از قبل به ما دادی جایگزاری کنیم؟
با سلام
اگه منظورتان این است که چطور این سند را به عنوان یک صفحه اینترنتی ذخیره کنید که هنگام ذخیره باید آن را با پسوند .htm یا .html ذخیره کنید.
در صورتی که می خواهید این کد ها را به سند قبل اضافه کنید باید فایل قبلی را با کلیک راست روی آن و open with و انتخاب ندپد باز کرده کدهای قبلی قابل مشاهده هستند کد های فعلی را کپی و در جای دلخواه پیست کنید.