জেড-ইনডেক্সের সর্বনিম্ন এবং সর্বাধিক মান?


517

আমার এইচটিএমএল পৃষ্ঠায় আমার একটি ডিভ আছে। আমি এই শর্তটি কিছু শর্তের ভিত্তিতে দেখছি, তবে ডিভটি এইচটিএমএল উপাদানটির পিছনে প্রদর্শিত হচ্ছে যেখানে আমি মাউস কার্সারটিকে নির্দেশ করেছি pointed

আমি 0 - 999999 থেকে জেড-ইনডেক্সের জন্য সমস্ত মান চেষ্টা করেছি anyone কেউ কি আমাকে বলতে পারে কেন এটি হচ্ছে?

সিএসএসের জেড-আইএনডিএক্স সম্পত্তির কোনও ন্যূনতম বা সর্বোচ্চ মূল্য আছে কি?

.divClass {
     position: absolute; 
     left: 25px; 
     top: 25px; 
     width: 320px;
     height: 300px; 
     z-index: 1000; 
}
<table cellspacing="0" cellpadding="0" width="100%">
  <tr>
    <td>
      <asp:HyperLink ID="lnkProgram" runat="server"></asp:HyperLink>
    </td>
  </tr>
  <tr>
     <td>
         <div class="divClass">
           Some Data
         </div>
     </td>
  </tr> 
</table>

আমি jQuery ব্যবহার করে .divClassঅনক্লিকের সাথে ডিভিটি দেখিয়ে এবং আড়াল করছি <asp:hyperlink>


সমস্যাটি সম্ভবত জেড-ইনডেক্সের সাথে বিশেষভাবে করা উচিত নয়। আপনি কি এইচটিএমএল এবং সিএসএসের কিছু উদাহরণ দিতে পারেন যা আচরণটির চিত্রিত করে? আপনি কোন ব্রাউজারে এটি অনুভব করছেন?
roryf

মাত্র আগ্রহের বাইরে আপনি টেবিলটি ব্যবহার না করে একই জিনিসটি চেষ্টা করতে পারেন, কিছু লিখিত সামগ্রী, লিঙ্ক এবং ডিভ। আপনার বিকাশকালে নির্দিষ্ট হওয়ার জন্য ডিভের উপর একটি ব্যাকগ্রাউন্ড রঙ রাখুন।
রোবরউরকে

60
"0 - 999999 থেকে জেড-আইএনডেক্স সম্পত্তিটির জন্য সমস্ত মান চেষ্টা করে"। আমি দেখলাম এটাতে বিশ্বাস করা কঠিন.
সাম্পাথিস্রিস

4
@ ক্রুমিয়া আমি না, তিনি জেএস-এর সাথে ০-৯৯৯৯৯৯ এর মধ্যে সমস্ত জেড-ইনডেক্স মানগুলি চেষ্টা করে দেখতে পারেন ... কেবল একটি বিকল্প ...
ফুলি হিউম্যানপ্রগ্রাম

4
আসলে কেউ display: noneতার সিএসএসে উল্লেখ করেনি ?
মার্ক বাইজেন্স

উত্তর:


386
┌──────────────────────┬───────────────────┬──────────────────────────────────┐
│ Browser              │ Max z─index value │ When exceeded, value changes to: │
╞══════════════════════╪═══════════════════╪══════════════════════════════════╡
│ Firefox 0 - 2        │ 2147483647        │ element disappears               │
├──────────────────────┼───────────────────┼──────────────────────────────────┤
│ Firefox 3            │ 2147483647        │ 0                                │
├──────────────────────┼───────────────────┼──────────────────────────────────┤
│ Firefox 4+           │ 2147483647        │ 2147483647                       │
├──────────────────────┼───────────────────┼──────────────────────────────────┤
│ Safari 0 - 3         │ 16777271          │ 16777271                         │
├──────────────────────┼───────────────────┼──────────────────────────────────┤
│ Safari 4+            │ 2147483647        │ 2147483647                       │
├──────────────────────┼───────────────────┼──────────────────────────────────┤
│ Internet Explorer 6+ │ 2147483647        │ 2147483647                       │
├──────────────────────┼───────────────────┼──────────────────────────────────┤
│ Chrome 29+           │ 2147483647        │ 2147483647                       │
├──────────────────────┼───────────────────┼──────────────────────────────────┤
│ Opera 9+             │ 2147483647        │ 2147483647                       │
└──────────────────────┴───────────────────┴──────────────────────────────────┘

4
আমি বিশ্বাস করি তার অর্থ নেতিবাচক।
গ্যাভিন

41
আপনি কিভাবে এই উপর এসেছেন?
2540625

মোবাইল সাফারি / ক্রোম / ফায়ারফক্সের জন্য কোনও নম্বর?
2540625

30
আগ্রহীদের জন্য 2,147,483,647 = 2^31 - 1,। এটি মার্সেন প্রাইম।
রেজি পিঙ্কহাম

2
@ বেহ্নমমোহমদি, যদিও মানসম্পন্ন আচরণ হওয়া উচিত?
পেসিয়ার

305

http://www.w3.org/TR/CSS21/visuren.html#z-index

'Z-সূচক'

মান : অটো | <ইনটেগার> | উত্তরাধিকারী

http://www.w3.org/TR/CSS21/syndata.html#numbers

কিছু মান ধরণের পূর্ণসংখ্যার মান (<অন্তর্গত> দ্বারা চিহ্নিত) বা আসল সংখ্যার মান (<সংখ্যা> দ্বারা চিহ্নিত) থাকতে পারে। বাস্তব সংখ্যা এবং পূর্ণসংখ্যা কেবল দশমিক স্বীকৃতিতে নির্দিষ্ট করা হয়। একটি <integer> "0" থেকে "9" এক বা একাধিক অঙ্ক নিয়ে গঠিত। একটি <সংখ্যা> হয় একটি <integer> হতে পারে, বা এটি একটি বা একাধিক সংখ্যার পরে বিন্দু (।) এর পরে শূন্য বা আরও বেশি সংখ্যা হতে পারে। চিহ্নটি ইঙ্গিত করার জন্য "-" বা "+" দ্বারা পূর্ণসংখ্যার এবং আসল সংখ্যা দুটি হতে পারে। -0 0 এর সমান এবং এটি নেতিবাচক সংখ্যা নয়।

মনে রাখবেন যে অনেকগুলি বৈশিষ্ট্য যা মান হিসাবে একটি পূর্ণসংখ্যা বা আসল সংখ্যাকে মঞ্জুরি দেয় আসলে মানটি কিছু পরিসরে সীমাবদ্ধ করে, প্রায়শই একটি অ-নেতিবাচক মানকে।

সুতরাং মূলত সিএসএস স্ট্যান্ডার্ডে জেড-ইনডেক্স মানের কোনও সীমাবদ্ধতা নেই, তবে আমার ধারণা অনুমান করা হয় যে বেশিরভাগ ব্রাউজারগুলি অনুশীলনে 32-বিট মান (−2147483648 থেকে +2147483647) এ সীমাবদ্ধ করে (64 শীর্ষে থেকে কিছুটা দূরে থাকবে, এবং এটি) আজকাল 32 বিটের চেয়ে কম কিছু ব্যবহার করার অর্থ নেই)


17
এটি লক্ষ্য করা গুরুত্বপূর্ণ যে সাফারি 3-তে সর্বাধিক জেড-সূচক মান 16777271 ছিল This এটি সাফারি 4-তে 32-বিট স্ট্যান্ডার্ডে উত্থাপিত হয়েছিল তাই আপনি যদি পুরানো ব্রাউজারগুলি লক্ষ্য করে থাকেন তবে এটি কেবল উদ্বেগজনক। এছাড়াও, সাফারি 3-তে 16777271 এর উপরে যে কোনও কিছু এতে ক্যাপসড হয়ে যায়, তাই আপনি যদি একাধিক উপাদানকে অর্ডার করার জন্য অযৌক্তিকভাবে বড় জেড-ইনডেক্স মানগুলি ব্যবহার না করেন তবে আপনার কোনও সমস্যা হওয়া উচিত নয় (অর্থাত্ 2147483647 এর জেড-সূচক মানের জন্য একটি উপাদান সেট করা) unless এটি নিশ্চিত করবে যে উপাদানটি যে কোনও ব্রাউজারে একেবারে শীর্ষে থাকবে, যদি না এটি অন্য উপাদানটির সাথে প্রতিযোগিতা করে তবে এর একটি z-index> 16777271) রয়েছে।
ডক্টর জে

6
@ ডক্টরজে কেউ কি জানেন কেন এটি 16777271? এটি উদ্ভট বলে মনে হয় যে এটি 24-বিট স্বাক্ষরযুক্ত পূর্ণসংখ্যার সীমা থেকে 56 টি বেশি।
Jools

2
ওয়েবকিত দেব এরিক সিডেলের মতে @ জুলস , এটি ছিল একটি 24-বিট বিটফিল্ড ব্যবহারের ফলাফল -log base 2 (lg) = lg(16777271)
জানোশ

2
@ জানোশ দুঃখিত, আমি বুঝতে পারি না। lg (16777271) 24 এর চেয়ে বড় I আমি ভাবতাম যে 24-বিট বিটফিল্ড যথেষ্ট বড় নয়।
জোলস

@ জানোশ, 2 ^ 24 = 1677721616777271এইভাবে 25 বিট প্রয়োজন হবে।
পেসারিয়ার

157

আমার পরীক্ষার দেখায় যে z-index: 2147483647সর্বোচ্চ মান, জন্য OS X এর আমি মুক্তিযোদ্ধা 3.0.1 উপর পরীক্ষা একটি পূর্ণসংখ্যা ওভারফ্লো বাগ আবিষ্কৃত: যদি আপনি টাইপ z-index: 2147483648(যা 2147483647 + 1 টি করে) উপাদান শুধু অন্যান্য সব উপাদান পিছনে চলে যায়। অন্তত ব্রাউজারটি ক্রাশ হয় না।

এবং শিখার পাঠটি হ'ল z-indexসম্পত্তির জন্য খুব বড় মূল্যবোধ প্রবেশ করা সম্পর্কে আপনার সচেতন হওয়া উচিত কারণ তারা চারপাশে মোড়ানো।


57
কারণ এটি (2147483647) 32 বিট অপারেটিং সিস্টেমে স্বাক্ষরিত পূর্ণসংখ্যার বৃহত্তম ধনাত্মক মান ...
বদর হরি

4
আমি মনে করি না যে এই সংখ্যাটি 2147483647 এর বেশি হলে এই সংখ্যাটি প্রায় মোড়া হবে ... আমার মনে হয় যে ব্রাউজারগুলি এই মানটির উপরে যে কোনও সংখ্যাকে একটি ধ্রুবক মান হিসাবে বিবেচনা করবে, সম্ভবত 0।
অলিভার-ক্লারে

3
হতে পারে আপনার মানটি কেবল নেতিবাচক হয়ে উঠবে ... উদাহরণস্বরূপ -2147483647
ওয়াহু ফাহমি

3
আধুনিক ব্রাউজারগুলিতে 2147483648 পেরিয়ে যাওয়া উপাদানগুলিকে অন্যান্য উপাদানগুলির পিছনে সরিয়ে দেয় না
জ্যাচ সসিয়ের

25

এর সর্বনিম্ন মান জেড-সূচক হয় 0 ; সর্বাধিক মান ব্রাউজারের ধরণের উপর নির্ভর করে।

এখানে চিত্র বর্ণনা লিখুন


4
আসলে, জেড-সূচক একটি নেতিবাচক সংখ্যা হতে পারে। নেতিবাচক জেড-ইনডেক্সযুক্ত অবস্থানযুক্ত উপাদানগুলি প্রথমে স্ট্যাকিং প্রসঙ্গে অর্ডার করা হয়, সুতরাং তারা অন্যান্য সমস্ত উপাদানের পিছনে উপস্থিত হবে। ডক্সগুলিও দেখুন: w3.org/TR/CSS22/visuren.html#z-index
MagikMaker

17
অনুলিপি করা এবং আটকানো সহজ:
2147483647

জেড-ইনডেক্স একটি নেতিবাচক সংখ্যা হতে পারে, তবে আইওএস 11.0.2 এর জন্য সাফারি উদাহরণ হিসাবে এই সম্পত্তিটিতে সমস্যা আছে।
kris_IV

সন্তোষ, এই নম্বরগুলি আপনি কোথায় পেলেন? আপনি কি বেহনামের উত্তর থেকে অনুলিপি করেছেন এবং আই 7 এবং আই 8 যুক্ত করেছেন?
সিপিএইচপিথন

21

এটি ব্রাউজারের উপর নির্ভর করে (যদিও সমস্ত ব্রাউজারের সর্বশেষতম সংস্করণটি 2147483638 এ সর্বাধিক হওয়া উচিত) যেমন সর্বাধিক ছাড়িয়ে গেলে ব্রাউজারের প্রতিক্রিয়াও ঘটে।

http://www.puidokas.com/max-z-index/



21

অভিজ্ঞতার বাইরে, আমি মনে করি সঠিক সর্বোচ্চ z-index2147483638 63


7
দেখে মনে হচ্ছে আপনার ভুল হয়েছে। (ওভারফ্লো উপর ড্রপ উপাদান ঝুঁকি ছাড়াই) এরিক Poidokas, সর্বোচ্চ Z-সূচক মান 2009 সালে প্রণীত পরীক্ষার মতে 2147483647. হয়
মার্টিন

14

জেড-ইনডেক্স কেবলমাত্র সেই উপাদানগুলির জন্য কাজ করে যা তাদের প্রয়োগ করেছে position: relative;বা position: absolute;প্রয়োগ করেছে। যদি সমস্যা না হয় তবে আরও সহায়ক হওয়ার জন্য আমাদের একটি উদাহরণ পৃষ্ঠা দেখতে হবে।

সম্পাদনা: ভাল ডাক্তার ইতিমধ্যে পুরো ব্যাখ্যা রেখেছেন তবে দ্রুততম সংস্করণটি হ'ল ন্যূনতম 0 কারণ এটি কোনও নেতিবাচক সংখ্যা এবং সর্বাধিক হতে পারে না - ভাল, বেশিরভাগ ডিজাইনের জন্য আপনার কখনই 10 এর উপরে যেতে হবে না।


5
আমি "জেড-ইনডেক্স: -1" ব্যবহার করেছি কোনও উপাদান "ডুবে" যাওয়ার আগে যাতে এটি ক্লিক করা যায় না। এটি সম্ভবত একটি জনপ্রিয় সমাধান নয়, তবে এটি কাজ করে। : পি
টাই

17
আমি জানি এটি কিছুটা দেরিতে হয়েছে তবে এটি অবস্থানের সাথে কাজ করে: ঠিক আছে fixed
টিসিসিভি

7
আফাইক, জেড-ইনডেক্স মানের জন্য আপনার নেতিবাচক পূর্ণসংখ্যার থাকতে পারে।
d -_- খ

আমি অবাক হয়েছি কেন আমি জেড-ইনডেক্স নির্দিষ্ট করে: 1000, তবে ব্রাউজার আমাকে জানায় যে আসল জেড-ইনডেক্সটি স্বয়ংক্রিয়। অবস্থানটি কৌশলটি করে।
উইল উ

6

আমি দেখতে পেয়েছি যে প্রায়শই যদি জেড-ইনডেক্স এটি কাজ না করে কারণ এর পিতামাতা / ভাইবোনদের একটি নির্দিষ্ট জেড-সূচক না থাকে।

সুতরাং আপনার যদি:

<div id="1">
    <a id="2" style="z-index:2"></a>
    <div id="3" style="z-index:1"></div>
    <button id="4"></button>
</div>

আইটেম # 3, এমনকি # 4, ক্লিক / হোভার স্পেসের জন্য # 2 প্রতিদ্বন্দ্বিতা করতে পারে, যদিও আপনি # 1 কে জেড-ইনডেক্স 0-এ সেট করেন, তবে জেড-ইনডেক্সযুক্ত ভাই-বোনরা এখন একই স্ট্যাকের মধ্যে রয়েছে এবং সঠিকভাবে z- সূচক হবে।

এটিতে একটি সহায়ক এবং মোটামুটিভাবে মানবিক বর্ণনা রয়েছে: http://foohack.com/2007/10/top-5-css-mistakes/  


4
আমরা যখন বিষয়টিতে রয়েছি, অন্য একটি সাধারণ সমস্যা হচ্ছে না position: relative;বা এর মতো কিছু রয়েছে।
রায়ান টেইলর

1
আসলে, কেবল আসল পোস্টটি পুনরায় পড়ুন। আপনি ঠিক বলেছেন, সম্ভবত এটিই তাঁর সমস্যা।
রায়ান টেইলর

5

উপরের কোনও ব্যবহারকারী বলেছেন "ভাল, বেশিরভাগ ডিজাইনের জন্য আপনার কখনই 10 এর উপরে যেতে হবে না।"

আপনার প্রকল্পের উপর নির্ভর করে আপনার কেবল জেড-ইনডেক্স 0-1, বা জেড-ইনডেক্স 0-10000 প্রয়োজন হতে পারে। আপনার প্রায়শই উচ্চতর অঙ্কগুলিতে খেলতে হবে ... বিশেষত আপনি যদি লাইটবক্স দর্শকদের সাথে কাজ করছেন (9999 মান হিসাবে মনে হচ্ছে এবং আপনি যদি তাদের জেড-সূচক শীর্ষে রাখতে চান তবে আপনাকে এটি ছাড়িয়ে যেতে হবে!)


0

INT_MAXসম্ভবত সবচেয়ে নিরাপদ বাজি থাকাকালীন , ওয়েবকিট দৃশ্যত অভ্যন্তরীণভাবে দ্বিগুণ ব্যবহার করে এবং তাই খুব বড় সংখ্যক (একটি নির্দিষ্ট নির্ভুলতায়) অনুমতি দেয়। LLONG_MAXউদাহরণস্বরূপ সূক্ষ্মভাবে কাজ করে (কমপক্ষে 64৪-বিট ক্রোমিয়াম এবং ওয়েবকিটজিটিকে) তবে 9223372036854776000 এ গোল হবে।

(যদিও আপনাকে সত্যই সত্য কিনা তা সতর্কতার সাথে বিবেচনা করা উচিত, সত্যিকার অর্থে এই অনেক জেড সূচকগুলির প্রয়োজন ...)।

আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.