آموزش نوشتن متن روی عکس توسط زبان html Archives - نگار نوین https://negarnovin.com/tag/آموزش-نوشتن-متن-روی-عکس-توسط-زبان-html/ ارائه دهنده سرورهای مجازی و اختصاصی Wed, 06 Jul 2016 14:48:21 +0000 fa-IR hourly 1 https://negarnovin.com/wp-content/uploads/2023/09/cropped-cropped-logo-32x32.png آموزش نوشتن متن روی عکس توسط زبان html Archives - نگار نوین https://negarnovin.com/tag/آموزش-نوشتن-متن-روی-عکس-توسط-زبان-html/ 32 32 آموزش نوشتن متن روی عکس توسط زبان html https://negarnovin.com/%d8%a2%d9%85%d9%88%d8%b2%d8%b4-%d9%86%d9%88%d8%b4%d8%aa%d9%86-%d9%85%d8%aa%d9%86-%d8%b9%da%a9%d8%b3-%d8%b2%d8%a8%d8%a7%d9%86-html/ https://negarnovin.com/%d8%a2%d9%85%d9%88%d8%b2%d8%b4-%d9%86%d9%88%d8%b4%d8%aa%d9%86-%d9%85%d8%aa%d9%86-%d8%b9%da%a9%d8%b3-%d8%b2%d8%a8%d8%a7%d9%86-html/#comments Wed, 06 Jul 2016 14:48:21 +0000 http://negarnovin.com/?p=2774 چگونه روی عکس متن بنویسیم ؟ پیشگفتار : با سلام و عرض ادب ؛ امروز مطلبی جالب و مفید را به شما عزیزان در طراحی سایت آموزش خواهیم داد که میتواند به شما در طراحی سایت کمک زیادی بکند، در این آموزش قصد داریم نوشتن یک متن روی تصویر را توسط زبان html به شما […]

The post آموزش نوشتن متن روی عکس توسط زبان html appeared first on نگار نوین.

]]> آموزش نوشتن متن روی عکس توسط زبان html

چگونه روی عکس متن بنویسیم ؟

پیشگفتار : با سلام و عرض ادب ؛ امروز مطلبی جالب و مفید را به شما عزیزان در طراحی سایت آموزش خواهیم داد که میتواند به شما در طراحی سایت کمک زیادی بکند، در این آموزش قصد داریم نوشتن یک متن روی تصویر را توسط زبان html به شما دوستداران وب یاد دهیم.همچنان نوشتن متن روی تصویر میتوانید مزایا زیادی برای شما در طراحی سایت داشته باشد که از جمله طراحی یک تصویر ثابت و استفاده آن در تمام مکان های مختلف وب سایت خود و تنها با اضافه کردن چند خط کد نویسی اچ تی ام ال میتوانید از طراحی تعداد زیادی تصویر برای وب سایت خود صرفه جویی کنید . ( با ما همراه باشید )

آموزش نوشتن متن روی عکس توسط زبان html

هدف ما از این آموزش نوشتن متن روی عکس توسط زبان html میباشد که در طراحی سایت بهینه کاربرد زیادی دارد، همواره بدون اتلاف وقت و مقدمه سراغ کد نویسی و اصل مطلب میرویم ! از طریق کد زیر شما به راحتی میتوانید یک عکس را در سند html فراخوانی کنید و بر روی تصویر فراخوانی شده متن دلخواه و مورد نیاز خود را با فونت، سایز و مشخصات بسیاری اضافه کنید :<!DOCTYPE html> <html> <head> <style type=”text/css”> .onvan{ text-align:center; line-height: 13; color:#FFFFFF; background-image:url(‘image.jpg’); width:212px; height:200px; } </style> </head> <body> <div class=”onvan”> متن شما </div> </body> </html>

کد HTML:

<!DOCTYPE html>
<html><head><style type="text/css"> .onvan{ text-align:center;line-height: 13;color:#FFFFFF; background-image:url('image.jpg');  width:212px;height:200px;}</style></head><body><div class="onvan"> متن شما </div></body></html>

راهنمای استفاده از کد فوق در کد نویسی های طراحی سایت :
  • – از مقدار text-align برای تعیین موقعیت متن در تصویر استفاده میکنیم ، مقادیر قابل استفاده :
Center = موقعیت وسط عکس , Right = موقعیت سمت راست عکس , Left = موقعیت سمت چپ عکس , Top = موقعیت بالا عکس
  • – از مقدار color برای تغییر رنگ متن خود استفاده کنید و مقادیر قابل استفاده :
رنگ مشکی = ۲c3e50 # , رنگ سفید = ecf0f1 # , رنگ آبی = ۱۷۸۴d9 # , رنگ قرمز = ff5959 # , رنگ زرد = f1c40f #
  • – از مقدار background-image برای فراخوانی تصویر در طراحی سایت استفاده میکنیم، مقادیر قابل استفاده :
در کد بالا به جای نام image.jpg میتوانید هر آدرس تصویر دیگری را قرار دهید .
  • – از مقدار width برای تغییر سایز عرض استفاده میشود ، مقادیر مورد استفاده :
مقادیر مورد استفاده از ۱px تا بینهایت میتواند باشد که بر حسب پیکسل محاسبه میشود و نسبت به نیاز خود میتوانید سایز را تنظیم کنید!
  • – از مقدار height برای تغییر سایز ارتفاع استفاده میشود ، مقادیر مورد استفاده :
مقادیر مورد استفاده از ۱px تا بینهایت میتواند باشد که بر حسب پیکسل محاسبه میشود و نسبت به نیاز خود میتوانید سایز را تنظیم کنید!
  • – از قسمت “متن شما” میتوانید نام یا متن دلخواه خود را بنویسید.
امیدوارم از آموزش نوشتن متن روی عکس توسط زبان html ما راضی بوده باشید .
شاد و پیروز باشید

The post آموزش نوشتن متن روی عکس توسط زبان html appeared first on نگار نوین.

]]> https://negarnovin.com/%d8%a2%d9%85%d9%88%d8%b2%d8%b4-%d9%86%d9%88%d8%b4%d8%aa%d9%86-%d9%85%d8%aa%d9%86-%d8%b9%da%a9%d8%b3-%d8%b2%d8%a8%d8%a7%d9%86-html/feed/ 4