බ්‍රවුසරයේ f12 භාවිතයෙන් රූපයක් සුරකින ආකාරය. අපි වෙබ් පිටුවට පින්තූර මෙන්ම වීඩියෝ සහ ශ්‍රව්‍ය එකතු කරන්නෙමු! පිටුව පිටපත් කිරීමෙන් ආරක්ෂා කරන අතරතුර ඡායාරූප සුරැකීම

Office 365 Outlook සඳහා Office 365 Outlook සඳහා Office 365 PowerPoint සඳහා 365 Word for Office 365 සඳහා Mac Word සඳහා Office 365 සඳහා Mac Word 2019 Outlook 2019 PowerPoint 2019 PowerPoint 2019 PowerPoint 2019 සඳහා Mac Word 2019 සඳහා Mac Word2019 සඳහා Word2019 013 Outlook 2013 PowerPoint 2013 Word 2010 Outlook 2010 PowerPoint 2010 Word 2007 Outlook 2007 PowerPoint 2007 PowerPoint 2016 Mac Word 2016 සඳහා Mac අඩු සඳහා

ඔෆිස් ගොනුවක තැන්පත් කර ඇති පින්තූර සහ ග්‍රැෆික්ස් ගොනුවේ සුරකිනු ලැබේ. නමුත් ඔබට එය වෙනත් තැනක භාවිතා කළ හැකි වන පරිදි වෙනම ගොනුවක් ලෙස ඇඳීම සුරැකිය හැක.

පින්තූරයක් වෙනම ගොනුවක් ලෙස සුරැකීම

ඔබේ පරිගණකයේ PowerPoint හි, ඡායාරූප, හැඩතල, ප්‍රස්ථාර, SmartArt චිත්‍රක, ඩිජිටල් තීන්ත සහ පෙළ පෙට්ටි සඳහා පහත ක්‍රියා පටිපාටිය භාවිතා කරන්න.

Word සහ Outlook හි, පහත පියවර අදාළ වන්නේ ඡායාරූප සඳහා පමණි.

මෙම විශේෂාංගය Excel හි නොමැත.

ඔබට වෙනම රූප ගොනුවක් ලෙස සුරැකීමට අවශ්‍ය පින්තූරය දකුණු-ක්ලික් කර පින්තූරයක් ලෙස සුරකින්න තෝරන්න.

ලැයිස්තුගත වර්ගය

ගොනු නාම ක්ෂේත්‍රය තුළ, ඇඳීම සඳහා නව නමක් ඇතුළත් කරන්න හෝ යෝජිත ගොනු නාමය සරලව තහවුරු කරන්න.

රූප ගොනු ආකෘති

ගොනු ආකෘතිය

විස්තර

ආකෘතිය JPEG (ගොනු හුවමාරු ආකෘතිය)
ආකෘතිය PNG (අතේ ගෙන යා හැකි ජාල PNG රූප ආකෘතිය)
	ඔබ ගොනුව සංස්කරණය කර සුරකින සෑම අවස්ථාවකම ගුණාත්මකභාවය නැති නොවී ආකෘතිකරණය කරන්න.
උපාංග ස්වාධීන බිට්මැප්
වින්ඩෝස් මෙටාෆයිල්	බිටු 16ක් සහිත ග්‍රැෆික් ආකෘතිය "දෛශිකය"
වින්ඩෝස් වැඩිදියුණු කළ මෙටාෆයිල්	ග්‍රැෆික් ආකෘතිය "දෛශිකය" 32-bit
ආකෘතිය SVG (පරිමාණය කළ හැකි දෛශික ග්‍රැෆික්) (Office Insiders පමණි, අනුවාදය 1908 හෝ ඊට පසු)	රූපයේ ගුණාත්මකභාවය නැති නොවී පින්තූර වෙනස් කළ හැකිය. ගොනු පාඩු රහිත දත්ත සම්පීඩනය සඳහා සහය දක්වයි.

මෙම විශේෂාංගය Word, PowerPoint සහ Excel හි ඇත. එය ඡායාරූප, හැඩතල, රූප සටහන්, SmartArt ග්‍රැෆික්ස්, ඩිජිටල් තීන්ත සහ පෙළ පෙට්ටි සඳහා සුදුසු වේ.

චිත්රයක් හෝ වෙනත් රූපයක් වෙනම ගොනුවක් ලෙස සුරකින්න

ගොනු වර්ග ලැයිස්තුවේ, අවශ්ය ආකෘතිය තෝරන්න.

කොහෙද කොටුවේ, ඔබට රූපය සුරැකීමට අවශ්‍ය ෆෝල්ඩරය වෙත යන්න.

රූප ගොනු ආකෘති

ගොනු ආකෘතිය

විස්තර

ආකෘතිය PNG (අතේ ගෙන යා හැකි ජාල ග්‍රැෆික් ආකෘතිය	රූපයේ කොටස් පාරදෘශ්‍ය කිරීමට සහ දීප්තිය සකස් කිරීමට ඇති හැකියාවට ස්තූතිවන්ත වන පරිදි වෙබ් අඩවි වල ග්‍රැෆික් රූපවල ගුණාත්මකභාවය වැඩි දියුණු කිරීමට ඔබට ඉඩ සලසයි.
ආකෘතිය JPEG (ඒකාබද්ධ ග්‍රැෆික් විශේෂඥ කණ්ඩායම)	ස්කෑන් කරන ලද ඡායාරූප වැනි පොහොසත් වර්ණ සහිත මෝස්තර සඳහා වඩාත් සුදුසුය.
PDF ගොනුව (අතේ ගෙන යා හැකි ලේඛන ආකෘතිය)	පෙළ සහ රූප ඇතුළත් කළ හැකි අතේ ගෙන යා හැකි ආකෘතියක්.
GIF ගොනුව (GIF ග්‍රැෆික් ආකෘතිය)	ගොනුව සම්පීඩනය කිරීමේදී වර්ණ 256 ක් සහ රූප දත්ත සංරක්ෂණය කිරීම සඳහා සහාය සපයයි.
BMP (උපාංග ස්වාධීන බිට්මැප්)	ඕනෑම වැඩසටහනක නිර්මාණය කරන ලද ඇඳීම් මුල් වැඩසටහනේ තිබූ ආකාරයටම අනෙක් වැඩසටහනේ ප්‍රදර්ශනය කෙරේ.

සටහන: මෙම පිටුව ස්වයංක්‍රීයව පරිවර්තනය කර ඇති අතර වැරදි සහ ව්‍යාකරණ දෝෂ අඩංගු විය හැක. මෙම ලිපිය ඔබට ප්‍රයෝජනවත් වීම අපට වැදගත් වේ. තොරතුරු ප්රයෝජනවත් වූවාද? පහසුව සඳහා (ඉංග්රීසියෙන්).

ආයුබෝවන් හිතවත් බ්ලොග් පාඨකයින්! මෙම ලිපියෙන් ඔබ html පිටුවකට පින්තූරයක් ඇතුළු කරන්නේ කෙසේද යන්න පිළිබඳ සියල්ල ඉගෙන ගනු ඇත. ඔබට ඔබේ පිටුවේ තැබීමට අවශ්‍ය පින්තූර කිහිපයක් තිබේද නැතහොත් ඔබේ වෙබ් අඩවියේ ලාංඡනයක් තැබීමට ඔබට අවශ්‍යද? මේ සියල්ල පහසුයි. මෙම ලිපිය කියවීමෙන් පසු, ඔබට කිසිදු අපහසුවකින් තොරව ඔබගේ html පිටුවට පින්තූර ඇතුල් කිරීමට හැකි වනු ඇත. මෙය සිදු කිරීම සඳහා, අපි img ටැගය සහ එහි ගුණාංග ගැන විස්තරාත්මකව කතා කරමු, කෙටියෙන් gif, jpeg සහ png වැනි ග්‍රැෆික් ගොනු ආකෘති දෙස බලමු, සහ වීඩියෝ සහ ශ්‍රව්‍ය ඇතුළු කිරීම පහසු කරන HTML5 හි නව විශේෂාංග ද බලමු. අඩවියට.

ග්රැෆික් දත්ත සහ html පෙළ එක් ගොනුවක් තුළ ඒකාබද්ධ කළ නොහැකි නිසා, ඒවා html පිටු වල අනෙකුත් අංග සමඟ වඩා වෙනස් ලෙස වෙබ් අඩවියක දර්ශනය වේ. පළමුවෙන්ම, ග්රැෆික් රූප සහ අනෙකුත් බහුමාධ්ය දත්ත වෙනම ගොනු වල ගබඩා කර ඇත. තවද ඒවා වෙබ් පිටුවකට කාවැද්දීමට, මෙම තනි ගොනු වෙත සබැඳි අඩංගු විශේෂ ටැග් භාවිතා කරනු ලැබේ. විශේෂයෙන්ම, එවැනි ටැග් යනු img ටැගයයි. ලිපිනයක් සමඟ එවැනි ටැගයක් හමු වූ පසු, බ්‍රවුසරය පළමුව වෙබ් සේවාදායකයෙන් රූපයක්, ශ්‍රව්‍ය හෝ වීඩියෝ සහිත අනුරූප ගොනුව ඉල්ලා සිටින අතර පසුව එය වෙබ් පිටුවේ පෙන්වයි.

සියලුම ග්‍රැෆික් රූප සහ, සාමාන්‍යයෙන්, වෙබ් පිටුවෙන් වෙන්ව ගොනු වල ගබඩා කර ඇති ඕනෑම දත්තයක් කාවැද්දූ පිටු මූලද්‍රව්‍ය ලෙස හැඳින්වේ.

පින්තූර ඇතුළත් කිරීමට සහ "img" ටැගය විස්තරාත්මකව බැලීමට පෙර, එය ග්රැෆික් ආකෘති ගැන ටිකක් ඉගෙන ගැනීම වටී.

ග්‍රැෆික් රූප ආකෘති.

විවිධ ග්‍රැෆික් ආකෘති ඇත, නමුත් බ්‍රවුසර කිහිපයක් පමණක් සහාය දක්වයි. අපි ඒවායින් තුනක් බලමු.

1. JPEG ආකෘතිය ( ඒකාබද්ධ ඡායාරූප විශේෂඥ කණ්ඩායම) පින්තූර ගබඩා කිරීම සඳහා භාවිතා කරන තරමක් ජනප්රිය ආකෘතියකි. 24-බිට් වර්ණයට සහය වන අතර ඡායාරූපවල ඇති සියලුම හැල්ෆ්ටෝන නොවෙනස්ව තබයි. නමුත් jpeg විනිවිදභාවයට සහය නොදක්වන අතර පින්තූරවල කුඩා විස්තර සහ පෙළ විකෘති කරයි. JPEG මූලික වශයෙන් ඡායාරූප ගබඩා කිරීම සඳහා භාවිතා කරයි. මෙම ආකෘතියේ ගොනු වල jpg, jpe, jpeg යන දිගු ඇත.

2. GIF ආකෘතිය ( ග්‍රැෆික් අන්තර් හුවමාරු ආකෘතිය) මෙම ආකෘතියේ ප්රධාන වාසිය වන්නේ එක් ගොනුවක් තුළ එකවර පින්තූර කිහිපයක් ගබඩා කිරීමේ හැකියාවයි. සම්පූර්ණ සජීවිකරණ වීඩියෝ නිර්මාණය කිරීමට මෙය ඔබට ඉඩ සලසයි. දෙවනුව, එය විනිවිදභාවයට සහාය වේ. ප්රධාන පසුබෑම වන්නේ එය ඡායාරූප ගබඩා කිරීම සඳහා සුදුසු නොවන වර්ණ 256 කට පමණක් සහය දක්වයි. GIF ප්‍රධාන වශයෙන් ලාංඡන, බැනර්, විනිවිද පෙනෙන ප්‍රදේශ සහිත සහ පෙළ අඩංගු පින්තූර ගබඩා කිරීමට භාවිතා කරයි. මෙම ආකෘතියේ ගොනු වල දිගු gif ඇත.

3. PNG ආකෘතිය ( අතේ ගෙන යා හැකි ජාල ග්‍රැෆික්ස්) මෙම ආකෘතිය පැරණි GIF සහ යම් දුරකට JPEG සඳහා ආදේශකයක් ලෙස සංවර්ධනය කරන ලදී. විනිවිදභාවයට සහය දක්වයි, නමුත් සජීවිකරණයට ඉඩ නොදේ. මෙම ආකෘතියට png දිගුව ඇත.

වෙබ් අඩවි නිර්මාණය කිරීමේදී, ඔවුන් සාමාන්යයෙන් JPEG හෝ GIF ආකෘතියෙන් පින්තූර භාවිතා කරයි, නමුත් සමහර විට ඔවුන් PNG භාවිතා කරයි. ප්රධාන දෙය නම් කුමන ආකෘතිය භාවිතා කිරීමට වඩා හොඳ දැයි තේරුම් ගැනීමයි. කෙටියෙන්:

පෙළ අඩංගු නොවන ඡායාරූප හෝ අළු පරිමාණ රූප ගබඩා කිරීම සඳහා JPEG වඩාත් හොඳින් භාවිතා වේ;

• GIF මූලික වශයෙන් සජීවිකරණය සඳහා භාවිතා වේ;
• PNG යනු අනෙක් සියල්ල සඳහා වන ආකෘතියයි (අයිකන, බොත්තම්, ආදිය).

html පිටු වලට පින්තූර ඇතුල් කිරීම

ඉතින්, ඔබ වෙබ් පිටුවකට පින්තූරයක් ඇතුල් කරන්නේ කෙසේද? තනි img ටැග් එකක් ඔබට රූපයක් ඇතුළු කිරීමට ඉඩ සලසයි. බ්‍රවුසරය රූපය වෙබ් පිටුවේ img ටැගය හමුවන ස්ථානයේ තබයි.

html පිටුවකට පින්තූරයක් ඇතුළත් කිරීමේ කේතය මේ වගේ ය:

මෙම html කේතය වෙබ් පිටුවේ එම ෆෝල්ඩරයේම පිහිටා ඇති image.jpg ගොනුවේ ගබඩා කර ඇති රූපයක් වෙබ් පිටුවේ තබනු ඇත. ඔබ දැක ඇති පරිදි, රූපයේ ලිපිනය src ගුණාංගයේ දක්වා ඇත. එය කුමක්දැයි මම දැනටමත් ඔබට පවසා ඇත. එබැවින්, src ගුණාංගය යනු රූපය සමඟ ගොනුවේ ලිපිනය දැක්වීමට අවශ්‍ය ගුණාංගයකි. src ගුණාංගය නොමැතිව, img ටැගයට තේරුමක් නැත.

රූපයක් සහිත ගොනුවක ලිපිනය සඳහන් කිරීම සඳහා තවත් උදාහරණ කිහිපයක් මෙන්න:

මෙම html කේතය වෙබ් අඩවියේ මූලයේ පිහිටා ඇති පින්තූර ෆෝල්ඩරයේ ගබඩා කර ඇති image.jpg නම් පිටුවට රූපයක් ඇතුළු කරනු ඇත.

src උපලක්ෂණයේ රූප වලට සාපේක්ෂ සබැඳි පමණක් අඩංගු විය හැක. පින්තූර html පිටු සමඟ සබැඳිව ගබඩා කර ඇති බැවින්, සෑම රූප ගොනුවකටම තමන්ගේම url ඇත. එමනිසා, ඔබට රූප url එක src ගුණාංගයට ඇතුළු කළ හැකිය. උදාහරණ වශයෙන්:

මෙම කේතය mysite.ru වෙබ් අඩවියෙන් පින්තූරයක් පිටුවට ඇතුල් කරනු ඇත. ඔබ වෙනත් අඩවියක රූපයක් වෙත යොමු කරන විට URL එකක් සාමාන්‍යයෙන් භාවිතා වේ. ඔබේ වෙබ් අඩවියේ ගබඩා කර ඇති පින්තූර සඳහා, සාපේක්ෂ සබැඳි භාවිතා කිරීම වඩා හොඳය.

img ටැගය පේළිගත මූලද්‍රව්‍යයකි, එබැවින් එය බ්ලොක් මූලද්‍රව්‍යයක් තුළ තැබීම වඩා හොඳය, උදාහරණයක් ලෙස “P” ටැගය තුළ - ඡේදය:

අපි පුරුදු වෙලා html ගැන කලින් ලිපිවල පින්තූරයක් අපේ පිටුවට ඇතුල් කරමු. මම මගේ පිටුවේ html ගොනුව අසල “පින්තූර” ෆෝල්ඩරයක් සාදා එහි “bmw.jpg” රූප ගොනුවක් තබමි, එය මේ ආකාරයෙන් පෙනේ:

එවිට ඇතුල් කළ රූපය සහිත පිටුවේ html කේතය මේ වගේ වනු ඇත:

බ්‍රවුසරයේ දර්ශණ ප්‍රතිඵලය බලන්න:

අපි දකින පරිදි, වෙබ් පිටු මත පින්තූර තැබීමේ කිසිවක් සංකීර්ණ නොවේ. මීළඟට අපි බලමු "img" ටැගයේ තවත් වැදගත් ගුණාංග කිහිපයක්.

alt attribute යනු Fallback විකල්පයකි

පින්තූර ගොනු වෙබ් පිටු වලින් වෙන වෙනම ගබඩා කර ඇති නිසා, බ්‍රවුසරයට ඒවා ලබා ගැනීමට වෙනම ඉල්ලීම් කිරීමට සිදුවේ. නමුත් පිටුවේ පින්තූර ගොඩක් තිබේ නම් සහ ජාල සම්බන්ධතා වේගය අඩු නම්, අතිරේක ගොනු බාගත කිරීමට සැලකිය යුතු කාලයක් ගතවනු ඇත. ඔබගේ අනුදැනුමකින් තොරව පින්තූරය සේවාදායකයෙන් මකා දැමුවහොත් එය වඩාත් නරක ය.

මෙම අවස්ථා වලදී, වෙබ් පිටුවම සාර්ථකව පූරණය වනු ඇත, පින්තූර වෙනුවට සුදු සෘජුකෝණාස්රා පමණක් පෙන්වනු ඇත. එබැවින්, රූපය කුමක්දැයි පරිශීලකයාට පැවසීමට, . මෙම ගුණාංගය භාවිතා කරමින්, ඔබ ඊනියා ප්‍රතිස්ථාපන පෙළ සඳහන් කරයි, එය රූපය පූරණය වන තෙක් හිස් සෘජුකෝණාස්‍රයක පෙන්වනු ඇත:

තවද මෙය දළ වශයෙන් පෙනෙන්නේ කෙසේද:

රූපයේ මානයන් සකසන්න

ඔබ දැනගත යුතු img ටැග් උපලක්ෂණ කිහිපයක් තවමත් තිබේ. මෙය පළල සහ උස ගුණාංග යුගලයකි. රූපයේ මානයන් නියම කිරීමට ඔබට මේවා භාවිතා කළ හැකිය:

ගුණාංග දෙකම පික්සල වලින් ප්‍රමාණය නියම කරයි. පළල ගුණාංගය බ්‍රවුසරයට රූපය කෙතරම් පළල විය යුතුද, උස ගුණාංගය එය කෙතරම් උස විය යුතුද යන්න කියයි. මෙම ගුණාංග දෙක එකට හෝ වෙන වෙනම භාවිතා කළ හැකිය. උදාහරණයක් ලෙස, ඔබ පළල ගුණාංගය පමණක් සඳහන් කරන්නේ නම්, බ්‍රවුසරය ස්වයංක්‍රීයව නිශ්චිත පළලට සමානුපාතිකව උස තෝරා ගනු ඇත, එසේම උස ගුණාංගය පමණක් භාවිතා කරන විට. ඔබ මෙම ගුණාංග කිසිසේත් සඳහන් නොකරන්නේ නම්, බ්‍රව්සරය තිරය මත ප්‍රදර්ශනය කිරීමට පෙර රූපයේ ප්‍රමාණය ස්වයංක්‍රීයව තීරණය කරයි. පිටුව ප්‍රදර්ශනය කිරීමේදී පින්තූර ප්‍රමාණයන් සඳහන් කිරීම බ්‍රවුසරය තරමක් වේගවත් කරන බව සඳහන් කිරීම වටී.

දැනට පිටු වලට පින්තූර ඇතුළු කිරීම ගැන එපමණයි, පසුව අපි වෙබ් අඩවියකට ශ්‍රව්‍ය හෝ වීඩියෝ ඇතුළු කරන්නේ කෙසේදැයි බලමු...

HTML 5 භාවිතයෙන් වීඩියෝ සහ ශ්‍රව්‍ය ඇතුළත් කිරීම

නව html5 පිරිවිතර මඟින් මාධ්‍ය ගොනු කාවැද්දීම ඉතා පහසු කරවන නව ටැග් කිහිපයක් හඳුන්වා දෙයි. මෙය මූලික වශයෙන් වීඩියෝ සහ ශ්‍රව්‍ය සඳහා අදාළ වේ.

ශ්‍රව්‍ය ඇතුළු කිරීම සඳහා, HTML5 යුගල කළ AUDIO ටැගයක් සපයයි. ශ්‍රව්‍ය පටය ගබඩා කර ඇති ගොනුවේ ලිපිනය දැනටමත් අපට හුරුපුරුදු src උපලක්ෂණය භාවිතයෙන් දක්වා ඇත:

"ශ්‍රව්‍ය" ටැගය පිටුවේ වාරණ අංගයක් නිර්මාණය කරයි. පෙරනිමියෙන්, බ්‍රව්සරය ශ්‍රව්‍ය පටය වාදනය නොකරයි. මෙය සිදු කිරීම සඳහා, ඔබ ශ්‍රව්‍ය ටැගය තුළ විශේෂ ස්වයංක්‍රීය ධාවන ගුණාංගයක් සඳහන් කළ යුතුය. කමක් නැති නිසා විශේෂයි. ටැගය තුළ මෙම ගුණාංගය තිබීම පමණක් එය ක්‍රියාත්මක වීමට ප්‍රමාණවත් වේ.

පෙරනිමියෙන්, ශ්‍රව්‍ය පටය වෙබ් පිටුවේ දර්ශනය නොවේ. නමුත් ඔබ පාලන අගය නොමැතිව “ශ්‍රව්‍ය” ටැගය තුළ ගුණාංගයක් තැබුවහොත්, බ්‍රව්සරය ශ්‍රව්‍ය ටැගය තබා ඇති වෙබ් පිටුවේ ශ්‍රව්‍ය ධාවන පාලන පාලනය පෙන්වයි. මේවාට වාදනය/විරාම බොත්තමක්, පසුධාවන තීරුවක් සහ ශබ්ද පාලනයක් ඇතුළත් වේ:

වෙබ් පිටුවකට වීඩියෝවක් ඇතුළු කිරීමට, යුගල කළ වීඩියෝ ටැගය භාවිතා කරන්න. මෙම ටැගය සමඟ, සෑම දෙයක්ම ශ්‍රව්‍ය ටැගයට සමාන වේ - වීඩියෝ ගොනු ලිපිනය src ගුණාංගය භාවිතයෙන් නියම කර ඇති අතර, ස්වයංක්‍රීය වාදනය සහ පාලන ගුණාංග භාවිතා කරමින්, ඔබට වීඩියෝව ස්වයංක්‍රීයව ධාවනය කිරීම ආරම්භ කර වීඩියෝ නැවත ධාවනය පාලනය කළ හැකිය.

html පිටුවලට පින්තූර සහ බහුමාධ්‍ය ඇතුළු කිරීම ගැන වැඩි යමක් කීමට නැත. මම ප්රශ්නය බලාපොරොත්තු වෙනවා "html පිටුවකට පින්තූරයක් ඇතුල් කරන්නේ කෙසේද?"මම ඔබට පිළිතුරු දුන්නා. එබැවින් මම සාරාංශ කරමි:

html පිටුවකට පින්තූර ඇතුළු කිරීමට, තනි img ටැගයක් භාවිතා කර ගොනුවේ ලිපිනය src ගුණාංගයේ රූපය සමඟ සඳහන් කරන්න;

• img ටැගයේ alt ගුණාංගය භාවිතා කරමින්, රූපය පූරණය නොවන්නේ නම්, ඔබට ප්‍රතිස්ථාපන පෙළ නියම කළ හැක;
• පළල සහ උස ගුණාංග භාවිතා කරමින්, ඔබට වෙබ් පිටුවේ රූපයේ මානයන් සැකසිය හැකිය;
• html5 හි ශ්‍රව්‍ය සහ දෘශ්‍ය ඇතුළු කිරීමට පිළිවෙලින් යුගල කළ ශ්‍රව්‍ය සහ දෘශ්‍ය ටැග් ඇත.

කිසිවක් පැහැදිලි නැතිනම්, අදහස් දැක්වීමේදී අසන්න, මගේ බ්ලොග් යාවත්කාලීන කිරීම් සඳහා දායක වීමට අමතක නොකරන්න. මීළඟ ලිපි වලින් හමුවෙමු!

පෙළ සමඟ වැඩ කිරීම සඳහා කාර්යාල වැඩසටහන් භාවිතා කරන සෑම පරිශීලකයෙකුටම, එක් ආකාරයකින් හෝ වෙනත් ආකාරයකින්, ලේඛනයකින් රූපයක් උකහා ගැනීමේ ගැටලුවකට මුහුණ දී තිබේ. බොහෝ විට මෙය ගැටළුවක් නොවීය, නමුත් පින්තූරය උකහා ගැනීමට නොහැකි වීම සිදුවිය හැකිය. එය මත දකුණු-ක්ලික් කිරීමෙන් එය පින්තූරයක් ලෙස සුරැකීමට අපව පෙලඹවූයේ නැත.

වාසනාවකට මෙන්, ඔබ Microsoft Office හෝ Google Docs භාවිතා කළත්, ඕනෑම ලේඛනයක ඕනෑම රූපයක් සුරැකීමට ඔබට භාවිතා කළ හැකි විශිෂ්ට එක්-නැවතුම් විසඳුමක් තිබේ.

Google Docs වෙතින් පින්තූර සුරකින ආකාරය

Google Docs හි, ලේඛනයකින් රූපයක් සුරැකීමේදී, ඔබ සරලම විකල්පය උත්සාහ කළේ නම්: එය මත ක්ලික් කර "රූපය ලෙස සුරකින්න" විකල්පය සොයාගත නොහැකි නම්, ඔබ පහත සඳහන් දෑ කළ යුතුය:

• File > Download As > Web Page (HTML) වෙත යන්න
• ඔබේ පරිගණකයේ සුරකින ලද ZIP ගොනුව විවෘත කරන්න.
• මෙම ZIP ගොනුව තුළ ඔබට "පින්තූර" නමින් ෆෝල්ඩරයක් හමුවනු ඇත. ඔබේ ලේඛනයේ තිබූ සියලුම පින්තූර එහි අඩංගු වේ.

මයික්‍රොසොෆ්ට් වර්ඩ් ලේඛනයකින් පින්තූර සුරකින ආකාරය

මයික්‍රොසොෆ්ට් වර්ඩ් හි සමහර අනුවාද වල, ඔබට රූපයක් දකුණු-ක්ලික් කර එය ඔබේ පරිගණකයට සුරැකීමට නොහැකි වනු ඇත. ඔබ පෙළ සංස්කාරකයේ මෙම අනුවාදය පමණක් භාවිතා කරන්නේ නම්, Word ලේඛනයකින් පින්තූරයක් උපුටා ගැනීමට ඔබ මෙම පියවර අනුගමනය කළ යුතුය:

මෙම සරල පියවරයන් කාර්යාලීය යෙදුම් භාවිතා කිරීමේ ඔබේ කුසලතා වැඩි දියුණු කිරීමට, ඔබේ ඵලදායිතාව වැඩි කිරීමට සහ බොහෝ කාර්යයන් පහසු කිරීමට උපකාරී වේ.

වීඩියෝ: වචන ලේඛනයකින් පින්තූරයක් සුරකින ආකාරය

පහත රූපය ඔබේ වෙබ් අඩවියට ඇතුළු කිරීමට ඔබ තීරණය කළා යැයි සිතමු:

මුලින්ම ඔබ මෙම පින්තූරය ඔබේ පරිගණකයේ සුරැකිය යුතුයි. මෙය සිදු කිරීම සඳහා, පින්තූරය මත මූසික කර්සරය ගෙන ගොස් දකුණු මූසික බොත්තම ක්ලික් කරන්න. "පින්තූරය මෙසේ සුරකින්න..." තෝරන්න පින්තූරය සුරැකීමට ස්ථානයක් සඳහන් කරන්න (මා කලින් නිර්දේශ කළ පරිදි - C ධාවකයේ වෙනම අඩවි ෆෝල්ඩරයක් සාදන්න, උදාහරණයක් ලෙස, සහ එහි සියලුම පාඩම් ගොනු සුරකින්න.)
අපි හදන පිටුව තිබෙන ස්ථානයේම පින්තූරය සුරකින්න - page.html පින්තූර ගොනුවේ නමම මුදල්-master.jpg තබන්න.
නැවතත්, ප්රවේශම් වන්න! ගොනුවේ නම money-master.i pg නොවේ, money-master.jpq නොවේ, නමුත් money-master.jpg වේ.

පිටුවකට පින්තූරයක් ඇතුළු කිරීමට, ටැගය භාවිතා කරන්න . img යනු im ag e...image, picture යන ඉංග්‍රීසි වචනයයි.මෙම ටැගය සඳහා පරාමිතියක් ලෙස පින්තූරයේ නම භාවිතා වේ.අප ඇතුළු කිරීමට අවශ්‍ය පින්තූරය කුමක්දැයි පරිගණකය දැන සිටිය යුතුය.

අපගේ නඩුවේදී, මුදල්-master.jpg රූපය ඇතුළු කිරීමට, අපි රූපය ඇතුළු කිරීමට අවශ්‍ය ස්ථානයේ පිටු කේතයට පහත කේතය ඇතුළත් කරමු:

නැත්නම් මෙහෙම ලිව්වොත් වඩාත් නිවැරදියි , ඉහත කේතය ද ක්‍රියා කරයි.

Src පරාමිතිය රූප ගොනුවේ නම සඳහන් කරයි.
src ඉංග්‍රීසි වචනයෙන් s ourc e - resource, source

Img src= රූප මූලාශ්‍රයක්/ගොනු නාමයක් ලෙස පුළුල් කළ හැක =

මේ අනුව, අපගේ පිටුව සඳහා කේතය මේ ආකාරයෙන් පෙනෙනු ඇත

අද හරි අපූරු දවසක්.

ටැග්
පින්තූරය පෙළට පහළින් පේළි කිහිපයක් ස්ථානගත කිරීම සඳහා ඇතුළත් කර ඇත.

දැන් අපේ page එක මේ වගේ වෙයි.

රූප පරාමිතීන් තුළ එහි මානයන් දැක්වීම යෝග්ය වේ. මෙය සිදු කිරීම සඳහා, පළල (රූපයේ පළල) සහ උස (රූප උස) පරාමිතීන් භාවිතා කරන්න.

(ලිඛිතව ද ප්‍රවේශම් වන්න. සමඟ නොවේ, witdh නොවේ, heihgt නොවේ)

එම. උදාහරණයක් ලෙස මේ වගේ:

පින්තූරයේ මානයන් පික්සල වලින් දක්වා ඇත.

ඔබ රූපය මත මූසිකය ගෙන යන විට යම් පෙළක් පෙන්වීමට ඔබට අවශ්‍ය නම්, මෙය alt පරාමිතිය භාවිතයෙන් කළ හැක.

උදාහරණයක් ලෙස මේ වගේ:

alt="අන්තර්ජාලයෙන් මුදල් ඉපයීම පිළිබඳ අඩවිය" > !}

ඔබගේ බ්‍රවුසරයේ ග්‍රැෆික්ස් අක්‍රිය කර ඇත්නම් (උදාහරණයක් ලෙස ගමනාගමනය සුරැකීමට) මෙම පාඨය ද දෘශ්‍යමාන වේ. නමුත් මෙම විකල්පය සියලුම බ්‍රව්සර් වල ක්‍රියා නොකරයි. එය Internet Explorer හි ක්‍රියා කරයි.

මෙම විධානයේ ප්‍රතිසමයක් වන්නේ title= පරාමිතියයි

කේතයේ වෙනස්කම් සිදු කර සිදුවන්නේ කුමක්දැයි බලන්න.

එබැවින් අපගේ පිටු කේතය මේ වගේ වනු ඇත:

මිනිත්තු 5 කින් මගේ පළමු අන්තර්ජාල පිටුව

අද හරි අපූරු දවසක්.
මම මගේ පළමු අන්තර්ජාල පිටුව හැදුවා.

මම ධනවත් හා නිදහස් මිනිසෙකු වනු ඇත!

ඔබේ පෙළෙහි අනුරූප රූප භාවිතා කිරීමෙන් ඔබ සපයන තොරතුරු පාඨකයන්ට දැනෙන ආකාරය බෙහෙවින් වැඩි දියුණු කරයි. HTML හි, පිටුවකට පින්තූර ඇතුළු කිරීම සඳහා අනුරූප ටැගයක් ඇත. . අද අපි මෙම ටැගය භාවිතා කරන්නේ කෙසේද, එය සහාය දක්වන ගුණාංග මොනවාද සහ නවක වෙබ්මාස්ටර්වරුන් අසන පොදු ප්‍රශ්න කිහිපයකට පිළිතුරු සපයන්නෙමු.

HTML හි පිටුවකට පින්තූරයක් (පින්තූරයක්) ඇතුල් කිරීම

කලින් සඳහන් කළ පරිදි, ටැගය පිටුවට පින්තූර ඇතුළු කිරීමට භාවිතා කරයි . එහි කෙටි ආකෘතිය පහත පරිදි වේ:

HTML හි, සහ මේ වගේ:

XHTML හි. උදාහරණයෙන් ඔබට පෙනෙන්නේ අවසාන කොටස සඳහා slash (slash) එකක් අවසානයේ එකතු වන බවයි.

මේ සියල්ල, එසේ කතා කිරීමට, ගොනුවට සබැඳියක් හැර, කිසිදු ගුණාංගයක් අඩංගු නොවන රූපයක් ඉක්මනින් ඇතුල් කිරීමකි.

මෙම ටැගය ( ), උදාහරණයක් ලෙස, සබැඳියක් මෙන් නොව, වසා නොමැති අතර මා ඉහත ලබා දුන් පෝරමයේ ලියා ඇත. නිර්දේශිත ගුණාංගය "alt" වේ:

රූපය සම්පූර්ණයෙන්ම පූරණය නොවන තෙක් හෝ කැඩුණු (නොපවතින) සබැඳියක් ඇති තෙක් පෙන්වනු ලැබේ.

දැන් ටැගය සහාය දක්වන සියලුම ගුණාංග ගැන කතා කිරීම අර්ථවත් කරයි .

පවතින ටැග් ගුණාංග ලැයිස්තුව HTML හි

පින්තූරවල සියලුම ගුණාංග අවකාශයකින් වෙන් කරනු ලැබේ. ඒවගේම මෙන්න ඒවායේ නියම ලැයිස්තුව.

src - රූපයට සබැඳියක් අඩංගු වේ, නිරපේක්ෂ (වෙනත් වෙබ් අඩවියක ඇති ගොනුවකට සබැඳිය) හෝ සාපේක්ෂ (ඔබේ වෙබ් අඩවියේ ඇති ගොනුවකට සබැඳිය) විය හැකිය. පිළිගත් ආකෘති: JPEG (JPG), PNG, GIF, BMP, ICO, APNG, එස්.වී.ජීසහ . නිරපේක්ෂ රූප ලිපිනය සමඟ උදාහරණ භාවිතය:

සාපේක්ෂ රූප ලිපිනය සමඟ උදාහරණ භාවිතය:

alt - පෙළ අඩංගු වේ - නොපෙනෙන/නොපැමිණෙන රූපයක් සඳහා ඉඟියක්. භාවිත උදාහරණය:

align - යාබද පෙළට සාපේක්ෂව රූපයේ පෙළගැස්ම සකසයි (රූපය වටා එතීම පෙළ නිර්මාණය කිරීම). වලංගු අගයන්: ඉහල, පතුලේ, මැද, අත්හැරියාසහ හරි. භාවිත උදාහරණය:

මායිම - රූපය වටා ඇති මායිමේ (රාමු) පළල සකසයි. වලංගු අගයන්: px, %

HTML5 හි උපලක්ෂණයට සහය නොදක්වයි.

උස - රූපයේ උස සකසයි. වලංගු අගයන්: px, % සහ අනෙකුත් ප්රමාණ. භාවිත උදාහරණය:

පළල - රූපයේ පළල සකසයි. වලංගු අගයන්: px, % සහ අනෙකුත් ප්රමාණ. භාවිත උදාහරණය:

hspace - රූපයේ තිරස් (වම් සහ දකුණ) ඉන්ඩෙන්ටේෂන් සකසයි. වලංගු අගයන්: px, % සහ අනෙකුත් ප්රමාණ. භාවිත උදාහරණය:

HTML5 හි උපලක්ෂණයට සහය නොදක්වයි.

vspace - රූපයේ සිරස් (ඉහළ සහ පහළ) අවකාශය සකසයි. වලංගු අගයන්: px, % සහ අනෙකුත් ප්රමාණ. භාවිත උදාහරණය:

HTML5 හි උපලක්ෂණයට සහය නොදක්වයි.

longdesc - දිගු කළ රූප විස්තරයේ ලිපිනය අඩංගු වේ. වලංගු අගයන්: TXT ගොනුව. ලිපිනය, src ගුණාංගය වැනි, නිරපේක්ෂ හෝ සාපේක්ෂ විය හැක. භාවිත උදාහරණය:

crossorigin - හරස් වසම් ඉල්ලීමක් (CORS) හරහා වෙනත් අඩවියකින් රූපයක් ඇතුළු කිරීමට ඔබට ඉඩ සලසන ගුණාංගයකි. වලංගු අගයන්: නිර්නාමික(අත්පත්‍ර සම්මත නොකර නිර්නාමික ඉල්ලීම) සහ භාවිත අක්තපත්‍ර(ඇත්තපත්‍ර මාරු කිරීම සමඟ ඉල්ලීම). භාවිත උදාහරණය:

උපලක්ෂණයට සහය දක්වන්නේ HTML5 හි පමණි.

srcset - තිරයේ පළල හෝ ඝනත්වය අනුව දර්ශනය වන ගොනු ලැයිස්තුවක් නියම කරයි. වලංගු අගයන්: Nw(N යනු කිසියම් ධන නිඛිලයක්) සහ Kx(K යනු ධන දශම අංකයකි). භාවිත උදාහරණය:

ඇන්ඩ්‍රොයිඩ් සහ ඉන්ටර්නෙට් එක්ස්ප්ලෝරර් බ්‍රව්සර්වල උපලක්ෂණයට සහය නොදක්වයි.

ප්‍රමාණයන් - srcset ගුණාංගයේ දක්වා ඇති පින්තූර සඳහා ප්‍රමාණය සකසයි. වලංගු අගයන්: Nex, Nrem, නෙම්, Nvmin, Nch, Nvh, Nvw, Nvmax, නින්, Nq, Nmm, Npc, Ncm, Nptසහ Npx, N යනු ධන අංකයකි. භාවිත උදාහරණය:

උදාහරණයේ මෙහෙයුම් මූලධර්මය පහත පරිදි වේ: තිර විභේදනය 600 px ට වඩා අඩු නම්, රූපයේ පළල 300 px ලෙස සකසන්න, සහ අනෙක් අතට, එය 600 px ට වඩා වැඩි නම්, රූපයේ පළල 600 px ලෙස සකසන්න.

ඇන්ඩ්‍රොයිඩ් සහ ඉන්ටර්නෙට් එක්ස්ප්ලෝරර් බ්‍රවුසරවල srcset වැනි උපලක්ෂණ සහාය නොදක්වයි.

usemap - ටැගය භාවිතයෙන් නිශ්චිතව දක්වා ඇති සිතියමක් සමඟ පින්තූරයක් සම්බන්ධ කරයි. වලංගු අගයන්: #නම(මෙහිදී නම යනු කාඩ්පතේ නම ගුණාංගයේ අගයයි) සහ #id(මෙහිදී id යනු කාඩ්පත් id ගුණාංගයේ අගයයි). භාවිත උදාහරණය:

සිතියම() සබැඳියක ඔතා තිබේ නම් සබැඳියක් සෑදිය නොහැක ) හෝ බොත්තම ().

ismap - සේවාදායක සිතියමේ යම් ප්‍රදේශයක් සමඟ රූපයක් සම්බන්ධ කරයි. ඔබ එවැනි පින්තූරයක් මත ක්ලික් කළ විට, ක්ලික් කිරීමේ ඛණ්ඩාංක ඉහළ වම් කෙළවරේ සිට කියවා සබැඳියේ සඳහන් ලිපිනයට ඉල්ලීමක් යවනු ලැබේ. ගුණාංගය ක්‍රියා කිරීමට නම්, රූපය සබැඳියක ඔතා තිබිය යුතුය ( ) භාවිත උදාහරණය:

HTML හි, සහ මේ වගේ:

ඊට අමතරව, එය ගෝලීය ගුණාංග සඳහා සහය දක්වයි පන්තියසහ id, මෙන්ම සෘජුව කාවැද්දීමේ මෝස්තර:

අවශ්ය නම්, පුද්ගලික ගුණාංග බොහොමයක් අනුරූප විලාසයන් සමඟ ප්රතිස්ථාපනය කළ හැකිය.

පින්තූරයක් (පින්තූරයක්) වගුවකට ඇතුල් කරන්නේ කෙසේද?

ඔබට වෙබ් අඩවියේ රූපයක් ඇතුළු කිරීමට අවශ්‍ය හරියටම කොතැනද යන්න ගැටළුවක් නොවේ, එය මේසයක් හෝ, උදාහරණයක් ලෙස, div block එකක් වේවා, සෑම අවස්ථාවකදීම ඇතුළත් කිරීම එකම මූලධර්මය අනුව සිදු කෙරේ:

අපගේ ලාංඡනය:

ඒක සරලයි.

HTML හි පින්තූරයක් (පින්තූරයක්) සබැඳියක් බවට පත් කරන්නේ කෙසේද?

ඔබගේ (සහ පමණක් නොව) අඩවියේ වෙනත් පිටුවකට යාමේ කාර්යය එකතු කිරීමෙන් ඔබගේ පින්තූරය ක්ලික් කළ හැකි බවට පත් කිරීම සඳහා, එය ටැගයක ඔතා :

තවමත් ප්‍රශ්න තිබේද? මෙම ලිපියට පහළින් අදහස් දැක්වීමේදී ඔවුන්ගෙන් විමසීමට නිදහස් වන්න.