خاصیت width – اسکریپت دات کام https://www.xn--mgbguh09aqiwi.com اسکریپت دات کام Tue, 19 Jul 2016 20:24:48 +0000 fa-IR hourly 1 https://wordpress.org/?v=5.6.14 آموزش و کاربرد تگ iframe ( ساده ولی کاربردی html – قسمت 19 ) https://www.xn--mgbguh09aqiwi.com/%d8%a2%d9%85%d9%88%d8%b2%d8%b4-%d9%88-%da%a9%d8%a7%d8%b1%d8%a8%d8%b1%d8%af-%d8%aa%da%af-iframe-%d8%b3%d8%a7%d8%af%d9%87-%d9%88%d9%84%db%8c-%da%a9%d8%a7%d8%b1%d8%a8%d8%b1%d8%af%db%8c-html.html https://www.xn--mgbguh09aqiwi.com/%d8%a2%d9%85%d9%88%d8%b2%d8%b4-%d9%88-%da%a9%d8%a7%d8%b1%d8%a8%d8%b1%d8%af-%d8%aa%da%af-iframe-%d8%b3%d8%a7%d8%af%d9%87-%d9%88%d9%84%db%8c-%da%a9%d8%a7%d8%b1%d8%a8%d8%b1%d8%af%db%8c-html.html#comments Sat, 04 Apr 2015 08:08:04 +0000 http://xn--mgbguh09aqiwi.com/?p=6016 در این ساعت از سایت اسکریپت دات کام با آموزش تگ iframe در خدمت شما عزیزان هستم .

تگ iframe برای افزودن یک وب سایت در وب سایت خودتان می باشد . یعنی شما میتوانید هر وب سایت یا و بلاگی که دوست دارید رو در سایت خود به نمایش بگذارید .

البته به دلیل اینکه سوء استفاده هایی که بعضا از این تگ توسط برخی افراد میشود , بسیاری از سایت های بزرگ دنیا از جمله گوگل , امکان این کار را از وبمستران گرفته است . ضمنا این کار بسیار هم سخت نیست و شما میتوانید با ورود به این مطلب , همین کار رو برای وب سایت خود انجام دهید.

کاربرد این تگ خیلی زیاد نیست , اما بعضی مواقع میتواند به درد بخور باشد . مثلا فرض کنید یک وب سایت آژانس هواپیمایی دارید و میخواهید آخرین پرواز های ورودی و خروجی فرودگاه امام را در آن به نمایش بگذارید . میتوانید با ورود به سایت فرودگاه امام , به قسمت مربوزه رفته و لینک صفحع را به تگ iframe داده و از آن استفاده نمایید .

آموزش زبان html - ساده و کاربردی

تگ iframe : این تگ به صورت Container و Block Level می باشد و همانطور که گفته شد میتواند یک سایت یا یک صفحه از یک سایت را در وب سایت شما بازخوانی کند .

خاصیت src : این خاصیت مهمترین خاصیت تگ iframe می باشد که مخخف کلمه source یا همان منبع می باشد . مقدار این خاصیت باید یک url یا حتا مثلا یک صفحه از وب سایت باشد .

خاصیت width : این خاصیت پهنای این تگ را مشخص میکند که میتوانید بر حسب پیکسل و یا درصد باشد .

خاصیت height : این خاصیت پهنای این تگ را مشخص میکند که میتوانید بر حسب پیکسل و یا درصد باشد .

به عنوان مثال :

<iframe src="http://test.com" width="300" height="300"></iframe>

<iframe src="pdf/resume.html" width="100%" height="500"></iframe>

توجه : این تگ شامل خاصیت های دیگری هم میباشد که تمامی آنها در html5 منسوخ شده است و جایگزین با css شده است که بعدا در سری آموزش های css به آنها میپردازیم .

پخش اختصاصی

آموزش : وحید مجیدی

]]> https://www.xn--mgbguh09aqiwi.com/%d8%a2%d9%85%d9%88%d8%b2%d8%b4-%d9%88-%da%a9%d8%a7%d8%b1%d8%a8%d8%b1%d8%af-%d8%aa%da%af-iframe-%d8%b3%d8%a7%d8%af%d9%87-%d9%88%d9%84%db%8c-%da%a9%d8%a7%d8%b1%d8%a8%d8%b1%d8%af%db%8c-html.html/feed 2 تگ img برای قرار دادن تصاویر در وب سایت ( ساده ولی کاربردی html – قسمت 17 ) https://www.xn--mgbguh09aqiwi.com/%d8%aa%da%af-img-%d8%a8%d8%b1%d8%a7%db%8c-%d9%82%d8%b1%d8%a7%d8%b1-%d8%af%d8%a7%d8%af%d9%86-%d8%aa%d8%b5%d8%a7%d9%88%db%8c%d8%b1-%d8%af%d8%b1-%d9%88%d8%a8-%d8%b3%d8%a7%db%8c%d8%aa.html https://www.xn--mgbguh09aqiwi.com/%d8%aa%da%af-img-%d8%a8%d8%b1%d8%a7%db%8c-%d9%82%d8%b1%d8%a7%d8%b1-%d8%af%d8%a7%d8%af%d9%86-%d8%aa%d8%b5%d8%a7%d9%88%db%8c%d8%b1-%d8%af%d8%b1-%d9%88%d8%a8-%d8%b3%d8%a7%db%8c%d8%aa.html#respond Sat, 21 Mar 2015 20:56:42 +0000 http://xn--mgbguh09aqiwi.com/?p=5765 خوب این هم از اولین پست در سال 1394 خورشیدی …

امید است با همراهی شما کاربران گرامی , در سال جدید شاهد پیشرفت دوچندان سایت اسکریپت دات کام باشیم و لحظات خوبی رو در کنار هم بگذرونیم .

این پست از سریال پست های ساده ولی کاربردی html می باشد که امروز با  تگ img که تگی فوق مهم در html هست در خدمت شما هستم .

این تگ برای نمایش یک تصویر در وب سایت می باشد . وقتی صحبت از تصویر میشه , همه ی ما پسوند های مختلفی به ذهنمون خطور میکنه ولی باید بدونیم که این تگ فقط قادر به نمایش 3 پسوند می باشد .

این پسوند ها شامل gif , png و jpg می باشد .

آموزش زبان html - ساده و کاربردی

 

 

تگ img : این تگ به صورت Empty و Inline Level می باشد و کار آن درج یک تصویر در صفحات وب سایت می باشد .

مهمترین خاصیت این تگ , خاصیت src میباشد . این خاصیت مشخص کننده آدرس فایل عکس می باشد .

همان طور که قبلا گفتم , فایل عکس حتما باید یکی از سه پسوند png , gif یا jpg باشد .

خاصیت alt : این خاصیت هم باید حتما در کنار خاصیت src باشد . مقدار این خاصیت باید توضیح مختصری از عکس مورد نظر شما باشد که این کار بسیار سئویی هم می باشد .

به عنوان مثال در کد زیر , بنده عکس خودم را در وب سایت گذاشته ام . پس میتونم مقدار alt رو وحید مجیدی بزارم . ( این مقدار با هر زبانی که باشد مشکلی ندارد اما طبیعتا برای ارتقا رتبه در موتور های جستجو , فارسی مینویسیم ) .

<img src="images/vms.jpg" alt="وحید مجیدی">

این تگ دارای دو خاصیت دیگر هم می باشد .

خاصیت width : به معنای مقدار پهنا یا همان طول عکس می باشد که برحسب پیکسل یا % میباشد . بهتر است از مقدار واقعی عکس بیشتر داده نشود .

خاصیت height : به معنای مقدار ارتفاع عکس می باشد که برحسب پیکسل یا % میباشد . بهتر است از مقدار واقعی عکس بیشتر داده نشود .

از لحاظ بهینه سازی در سرعت وب سایت , بهتر است حتما این دو خاصیت همراه تگ img آورده شود و مقدار آن همان اندازه واقعی عکس باشد .

توجه داشته باشید که با کم کردن مقدار پهنا یا ارتفاع عکس در این دو خاصیت , حجم عکس کم نمیشود و شما برای کم کردن حجم عکس باید از نرم افزار های کمکی گرافیکی از جمله فتوشاپ استفاده نمایید .

مزیت دیگر اینکه به عکس ها width و height میدهیم این است که با load نشدن عکس به هر دلیلی ( از جمله سرعت پایین اینترنت ) , نوشته ی درون alt , بر روی عکس ظاهر میشود که میتواند راهنمای خوبی برای کاربر باشد .

<img src="vms.jpg" alt="وحید مجیدی" width="300" height="400">

اگر بخواهیم برحسب پیکسل بنویسیم باید فقط عدد را جایگذاری کنیم و اگر بخواهیم بر حسب درصد باشد , باید علامت % را بعد از عدد قرار دهیم . ( ترجیحا بر حسب پیکسل باشد )

نکته : خاصیت هایی دیگری وجود دارد , ولی چون در html5 این خاصیت ها منسوخ شده است از گفتن آنها صرف نظر میکنم .

 آموزش : وحید مجیدی

پخش اختصاصی

]]> https://www.xn--mgbguh09aqiwi.com/%d8%aa%da%af-img-%d8%a8%d8%b1%d8%a7%db%8c-%d9%82%d8%b1%d8%a7%d8%b1-%d8%af%d8%a7%d8%af%d9%86-%d8%aa%d8%b5%d8%a7%d9%88%db%8c%d8%b1-%d8%af%d8%b1-%d9%88%d8%a8-%d8%b3%d8%a7%db%8c%d8%aa.html/feed 0 آموزش تگ متحرک ساز Marquee ( ساده ولی کاربردی html – قسمت 11 ) https://www.xn--mgbguh09aqiwi.com/%d8%a2%d9%85%d9%88%d8%b2%d8%b4-%d8%aa%da%af-%d9%85%d8%aa%d8%ad%d8%b1%da%a9-%d8%b3%d8%a7%d8%b2-marquee-%d8%b3%d8%a7%d8%af%d9%87-%d9%88%d9%84%db%8c-%da%a9%d8%a7%d8%b1%d8%a8%d8%b1%d8%af%db%8c-html.html https://www.xn--mgbguh09aqiwi.com/%d8%a2%d9%85%d9%88%d8%b2%d8%b4-%d8%aa%da%af-%d9%85%d8%aa%d8%ad%d8%b1%da%a9-%d8%b3%d8%a7%d8%b2-marquee-%d8%b3%d8%a7%d8%af%d9%87-%d9%88%d9%84%db%8c-%da%a9%d8%a7%d8%b1%d8%a8%d8%b1%d8%af%db%8c-html.html#comments Thu, 26 Feb 2015 23:03:01 +0000 http://xn--mgbguh09aqiwi.com/?p=5136 با سلام . این جلسه یازدهم از سری آموزش های ساده ولی کاربردی html می باشد که از سایت اسکریپت دات کام منتشر میشود .

در این قسمت تگی جالب و متحرک از html به نام marquee را معرفی میکنم . این تگ باعث میشود نوشته , عکس و هر چیزه دیگری را که دوست دارید در دو حالت افقی و عمودی در وب به حرکت در بیاورد .

این تگ به صورت Container و block Level می باشد .

آموزش زبان html - ساده و کاربردی

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

به طور مثال :

<marquee>
    <p>وحید مجیدی</p>
</marquee>

اما این تگ دارای اتربیوت هایی هم می باشد از جمله :

behavior : که دارای 3 مقدار می باشد ->

  • alternate = که باعث می شود حرکت به صورت رفت و برگشتی صورت پذیرد .
  • scroll = این مقدار باعث میشود که تگ مورد نظر از یک طرف وارد و از طرف دیگر خارج شود .
  • slide = که باعث میشود تگ مورد نظر از یک طرف وارد شود و به محض رسیدن به پایان راه متوقف و بایستد .

direction : که دارای 4 مقدار زیر می باشد ->

  • up = حرکت از پایین به سمت بالا
  • down = حرکت از بالا به سمت پایین
  • left = حرکت از راست به چپ
  • right = حرکت از چپ به راست

loop : که دارای 2 نوع مقدار می باشد ->

  • 1- = یعنی این کار بی نهایت بار انجام شود .
  • عددی از بین 1 تا بی نهایت به دلخواه شما = یعنی این کار به تعداد عددی که شما داده اید تکرار می شود .

scrollamount : این خاصیت فاصله بین هر فریم را مشخص میکند که عددی از 1 به بالا را میپذیرد . طبیعتا هر چه مقدار را بیشتر بدهیم , سرعت بالاتر میرود .

scrolldelay : این خاصیت میتواند در بین هر فریم که در بالا بیان شد , تاخیری بر حسب میلی ثانیه ایجاد کند . مثلا اگر 1000 را وارد نمایید , 1 ثانیه تاخیر می اندازد .

width : مقدار عرض را بر حسب px یا % مشخص میکند که در صورت قرار نگرفتن این خاصیت , عرض آن به مقدار پدر خود است .

height : مقدار ارتفاع را بر حسب px یا % مشخص میکند که در صورت قرار نگرفتن این خاصیت , ارتفاع آن به مقدار نوشته های داخل آن می باشد .

Bgcolor : رنگ پس زمینه را مشخص میکند ( این خاصیت در html5 منسوخ و به css انتقال پیدا کرده است )

hspace : میزان فاصله قسمت راست و چپ marquee نسبت به تگ های اطراف را بر حسب px یا % مشخص میکند.

vspace : میزان فاصله قسمت پایین و بالا marquee نسبت به تگ های اطراف را بر حسب px یا % مشخص میکند.

truespeed : معمولا مرورگرها مقادیر کمتر از 60 برای scrolldelay را در نظر نمیگیرند و اگر مقداری کمتر از 60 را وارد کنیم، مرورگر آن را 60 در نظر خواهد گرفت . ولی ما میتوانیم با به بکارگیری خاصیت truespeed که بدون مقدار ( None Value ) می باشد , مرورگرها را مجبور میکنیم تا همان عددی را که در صفت scrolldelay مشخص کرده ایم در حرکت تاثیر بدهد .

در پایان یک مثال کلی میزنیم :

<marquee direction="left" behavior="alternate" bgcolor="#eee" hspace="300" height="80" scrollamount="50" scrolldelay="1000" truespeed loop="-1">
    <h1>وحید مجیدی - اسکریپت دات کام</h1>
</marquee>

 دموی نمایش کد بالا

پخش اختصاصی

آموزش : وحید مجیدی

]]> https://www.xn--mgbguh09aqiwi.com/%d8%a2%d9%85%d9%88%d8%b2%d8%b4-%d8%aa%da%af-%d9%85%d8%aa%d8%ad%d8%b1%da%a9-%d8%b3%d8%a7%d8%b2-marquee-%d8%b3%d8%a7%d8%af%d9%87-%d9%88%d9%84%db%8c-%da%a9%d8%a7%d8%b1%d8%a8%d8%b1%d8%af%db%8c-html.html/feed 6