HTML 5 ምስል የሚለምደዉ ስክሪን img ተመጣጣኝ የመለኪያ ኮድ ለድረ-ገጽ HTML XNUMX

እየጨመረ ባለው የሞባይል ኢንተርኔት ምክንያትWeChat ግብይትየሞባይል ስልኮች ታዋቂነት ሆኗልሕይወት።መሆን ያለበት መሳሪያ.

ድር ጣቢያ መገንባትአብነት, ለመጠቀም ይመከራልየዎርድፕረስየሚለምደዉ ጭብጥ ለ፡

የሲኤስኤስ ምስል አስማሚ ማለት ምን ማለት ነው?

የሲኤስኤስ ምስል አስማሚ ማለት በኤችቲኤምኤል ድረ-ገጽ ላይ ያሉትን ምስሎች በCSS ኮድ መስራት ማለት ነው።

ቀጣይ ፣Chen Weiliangየሲኤስኤስ img ተመጣጣኝ ማዛመጃ ኮድ ^_^ ላካፍላችሁ

የሲኤስኤስ ምስል ቁመት እና ስፋት አስማሚ ኮድ

ምስል በኤችቲኤምኤል አስገባ፡

ምስሉ በስፋት እና በከፍታ ላይ ተስተካክሎ ከመቆየት ይልቅ ከማያ ገጹ ትንሽ መጠን ጋር እንዲስማማ ከፈለጉ.

የሚከተለውን ኮድ ወደ የዎርድፕረስ ጭብጥ ▼ style.css ፋይል ማከል ይችላሉ።

/*图片自适应宽度和高度*/ 
img { max-width: 100%; height: auto; width: auto\9; width: auto; }

መግለጫ እዚህmax-widthከፍተኛው ስፋት ደንብ

• ሁሉም ምስሎች ቢበዛ 100% እንዲታዩ (ማለትም እንደ ራሳቸው ምስሎች ብቻ ሊታዩ ይችላሉ)።
• በዚህ ጊዜ ምስሉን የያዘው አካል (ለምሳሌ ምስሉን የያዘው አካል ወይም ዳይቭ) ከምስሉ ውስጣዊ ስፋት ያነሰ ከሆነ ምስሉ ከፍተኛውን ቦታ ለመሙላት ሚዛን ይደረጋል።

width:auto;አውቶማቲክ ስፋት ማለት ነው።

\9 ሀክ css የመጻፍ መንገድ ነው።

• በዚህ መንገድ "\9" ወደ የተለመደው የሲኤስኤስ ኮድ ተጨምሯል, IE አሳሽ ብቻ ነው ሊያውቀው የሚችለው, ሌሎች አሳሾች ይህንን መግለጫ ችላ ይላሉ.
• ይህ የአሳሽ ልዩነትን ያመጣል, ተኳሃኝ የሆኑ አሳሾችን አላማ ያስችለዋል.

ለምን ስፋት አትጠቀምም: 100%?

የምስሎችን አውቶማቲክ ልኬት ለማግኘት፣ በብዛት ጥቅም ላይ የዋሉትን የወርድ ንብረቶችን መጠቀምም ይችላሉ፣ ለምሳሌ።width：100％.

ሆኖም, ይህ ህግ እዚህ አይተገበርም.

• ምክንያቱም ይህ ደንብ እንደ መያዣው ሰፊ ሆኖ እንዲታይ ያደርገዋል.
• መያዣው ከምስሉ በጣም ሰፊ በሆነበት ሁኔታ ምስሉ ሳያስፈልግ ይለጠጣል.

ጥንቃቄዎች

የሲኤስኤስ መምረጫዎች ምንድን ናቸው? ክፍል እና መታወቂያ መካከል ያለው ልዩነት ምንድን ነው?የሚከተሉት ትምህርቶች ስለ ▼ ይናገራሉ

በሲኤስኤስ መራጭ ክፍል እና መታወቂያ መካከል ያለው ልዩነት ምንድን ነው? መታወቂያ እና የክፍል አጠቃቀም በኤችቲኤምኤል

በሲኤስኤስ መራጭ ክፍል እና መታወቂያ መካከል ያለው ልዩነት ምንድን ነው? በኤችቲኤምኤል ውስጥ የመታወቂያ እና የክፍል አጠቃቀም በአሁኑ ጊዜ SEOን በመሥራት እና የድረ-ገጹን የዎርድፕረስ ገጽታ እያሳደገ ነው።ምንም እንኳን ከዚህ በፊት አንዳንድ መሰረታዊ የኤችቲኤምኤል እና የሲኤስኤስ ዕውቀት የተማርኩ ቢሆንም፣ ግን ለተወሰነ ጊዜ አልሰራሁትም ፣በተለይ የ CSS ክፍል...

የሞባይል ድረ-ገጽ እንዴት ለገጹ ተስማሚ የሆነ MP4 ቪዲዮን ያጫውታል?እባክዎ ከታች ያለውን ሊንክ ይጫኑ ▼

H5 ድረ-ገጽ MP4 ከገጹ ጋር እንዴት ይጣጣማል?የሞባይል ድረ-ገጽ የቪዲዮ html ኮድ ይጫወታል

የቪዲዮ ማሻሻጥ የኦንላይን ግብይት ዋና አካል ነው፡ ብዙ የኦንላይን ፕሮሞሽን ባለሙያዎች ትራፊክን ለመንዳት ብዙ ጊዜ ቪዲዮን ከ"ቫይራል ማርኬቲንግ" ጋር በማጣመር ይጠቀማሉ።WeChat ማሻሻጥ ከቪዲዮ ግብይት ጋር ከተጣመረ፣የአዲስ ሚዲያ እና የማህበራዊ ኢ-ኮሜርስን የቅጂ ጽሑፍ ልወጣ መጠን የበለጠ ሊያሻሽል ይችላል።ብዙ ጓደኞች አሉኝ...