آموزش HTML قسمت چهارم

به نام او که هر چه علم است از اوست

با سلام به همه دوستان

امروز بحث عکس ها رو براتون توضیح میدم.عکس ها فقط یک تگ به صورت <img src="">  دارند که در  src مسیر عکستون به همراه فرمت عکستون رو می ذارید.مثلا:

<img src="">

حتما یادتون باشه که فرمت عکس هارو درست بذارید و گرنه مرورگر عکس رو نشون نمیده.حالا اگر مرورگر به این دلیل یا ابه خاطر پایین بودن سرعت یا به هر دلیل دیگه عکس رو نشون نداد باید از alt استفاده کرد.Alt متنی رو که داخلش داره اگه عکس به هر دلیلی نشون داره نشه متن رو نشون میده و کاربر می فهمه چه عکسی بوده در واقع یک جور کامنت برای عکس هست و موتور های جستجو چون نمی تونن بفهمن تو عکس چی هست این کامنت رو برای عکس می خونن و ایندکس می کنن.پس سعی کنید حتما برای همه عکس های مهم صفحه نه هر عکسی حتما از این دستور استفاده کنید که به شکل زیر هست :

<img src=""  alt="">

بعضی وقت ها شما می خواید بدون شلوغ شدن صفحتون یه سری توضیحات در مورد عکس به کاربر بدید مثلا وقتی موس رو برد روی عکس به صورت tooltip متنی بهش نمایش داده بشه واسه این کار از title استفاده می کنید که به صورت زیر هست :

<img src=""  alt=" " title="">

حالا بعضی وقت ها به خاطر طراحی صفحتون می خواید عکس بزرگتر یا کوچکتر نشون داده بشه. واسه اینکار کافیه طول و عرض دلخواهتون رو بنویسید.البته توجه کنید عکس رو طوری کوچیک یا بزرگ نکنید که کیفیتش بد شه. برای تغییر طول از width و برای تغییر عرض یا ارتفاع از height استفاده کنید. مثل زیر :

<img src=" "  alt="" title=" " width="px" height="px" >

چون عکس بر اساس پیکسل هست توی اندازه ها اول اندازه زو بذارید بعد هم px مثلا :100 px

نکته ای که مهم هست اینه که حواستون باشه به نسبت درستی اندازه ها رو تغییر بدید واسه این کار طول واقعی عکس رو تقسیم بر طول مورد نظرتون تقسیم کنید بعد عدد بدست اومده رو ضرب در ارتفاع کنید. به صورت فرمول زیر که خیلی تو ریاضیات خوندیم :

طول واقعی عکس / طول دلخواه = ارتفاع واقعی عکس /x

حالا از فرمول بالا x رو پیدا کنید

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

<a href=""> <img src=""  alt="" title="" width="px" height="px"> </a>

ادامه دارد...