IE এ কেবল স্টাইল প্রয়োগ করুন

Question

আমার সিএসএসের ব্লকটি এখানে:

.actual-form table {
  padding: 5px 0 15px 15px;
  margin: 0 0 30px 0;
  display: block;
  width: 100%;
  background: #f9f9f9;
  border-top: 1px solid #d0d0d0;
  border-bottom: 1px solid #d0d0d0;
}

আমি কেবল IE 7, 8 এবং 9 "দেখতে" চাই width: 100%

এটি সম্পাদন করার সহজ উপায় কী?

Comments

আপনি কেন এটি করার চেষ্টা করছেন? আইই এর কোন সংস্করণ (গুলি) আপনি লক্ষ্য করছেন? আইই 10 সম্পর্কে কী? (সাধারণ শর্তাধীন প্রতিক্রিয়া সমর্থন করে না)

— ত্রিশডট

আমি IE 7, 8, এবং 9 টার্গেট করার চেষ্টা করছি

— ফাস্টট্র্যাক

কি কারণ আপনি IE9 লক্ষ্য আছে কিন্তু পারে না IE10? আমি জানতে চাই ...

— ত্রিশটি

width: autoফায়ারফক্স বা ক্রোমের মতো অন্যান্য ব্রাউজারগুলিতে ব্লক উপাদানগুলির জন্য IE ব্যাখ্যা করে না । ক্রোম / ফায়ারফক্সে width:autoকোনও ব্লক উপাদানটির প্রস্থের ধারকটির পূর্ণ প্রস্থ প্রসারিত হবে। আইআই এটি করে না এবং প্রয়োজনwidth: 100%

— ফাস্টট্র্যাক

কেউ কি এই চেষ্টা করেছে? ফিলিপিনিউমার.নেট

— 2014/

Answer 1

আপডেট 2017

পরিবেশের উপর নির্ভর করে, শর্তসাপেক্ষ মন্তব্যগুলি আনুষ্ঠানিকভাবে আই 10 10-এ অবচিত ও সরানো হয়েছে।

---

মূল

সবচেয়ে সহজ উপায় সম্ভবত আপনার এইচটিএমএলে কোনও ইন্টারনেট এক্সপ্লোরার শর্তাধীন মন্তব্য ব্যবহার করা :

<!--[if IE]>
<style>
    .actual-form table {
         width: 100%;
    }
</style>
<![endif]-->

প্রচুর হ্যাক রয়েছে (যেমন আন্ডারস্কোর হ্যাক ) আপনি এটি ব্যবহার করতে পারেন যা আপনাকে আপনার স্টাইলশীটের মধ্যে কেবলমাত্র আইই টার্গেট করতে দেয় তবে আপনি যদি সমস্ত প্ল্যাটফর্মে আইই এর সমস্ত সংস্করণ লক্ষ্য করতে চান তবে এটি খুব অগোছালো হয়ে যায়।

Comments

আমার সিএসএস ফাইলে সেই শর্তযুক্ত মন্তব্যটি ব্যবহার করার কোনও উপায় আছে কি? আমি যদি আমার এইচটিএমএলটিকে সহায়তা করতে পারি তবে এলোমেলো এড়াতে চেয়েছিলাম।

— ফাস্টট্র্যাক

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

— জেমস আলার্ডাইস

জেমস: আমি এটি করার কথা ভাবছিলাম, তবে তখন প্রতিবারই যখন আমি কিছু পরিবর্তন করতে চাই তখন দুটি পৃথক স্টাইলশিট আপডেট করার বিরোধিতা করতে হবে, তাই না?

— ফাস্টট্র্যাক

@ ফাস্টট্র্যাক - না, আপনার আইই স্টাইলশীটে কেবলমাত্র আইই সম্পর্কিত নির্দিষ্ট স্টাইল থাকবে। এটি আপনার প্রধান স্টাইলশিটের পরে অন্তর্ভুক্ত করুন যাতে আপনার প্রয়োজনীয় প্রধান স্টাইলশীটে সেট করা শৈলীগুলি ওভাররাইড করতে পারেন। সুতরাং আপনি যদি কেবলমাত্র আইই-তে নির্দিষ্ট কিছু পরিবর্তন করতে চান তবে আপনাকে এটি আপডেট করতে হবে।

— জেমস আলার্ডাইস

@ ফাস্ট ট্র্যাক - হ্যাঁ যখন একাধিক স্টাইলশিটে কোনও কিছু নির্দিষ্ট করা থাকে, তবে পরে অন্তর্ভুক্ত থাকাটি অগ্রাধিকার নেয়।

— জেমস আলার্ডাইস

Answer 2

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
   #myElement {
        /* Enter your style code */
   }
}

ব্যাখ্যা: এটি একটি মাইক্রোসফ্ট-নির্দিষ্ট মিডিয়া ক্যোয়ারী। মাইক্রোসফ্ট আইই-তে নির্দিষ্ট -ms-উচ্চ-বিপরীতে সম্পত্তি ব্যবহার করে, এটি কেবলমাত্র ইন্টারনেট এক্সপ্লোরার 10 বা ততোধিক ক্ষেত্রে পার্স করা হবে। আমি মিডিয়া ক্যোয়ারীর বৈধ মান উভয়ই ব্যবহার করেছি, সুতরাং এটি কেবল আইই দ্বারা বিশ্লেষণ করা হবে, ব্যবহারকারীর উচ্চ বৈপরীত্য সক্ষম হয়েছে কি না।

Comments

কেবল এটি নতুন ইন্টারনেট-এক্সপ্লোরার (প্রান্ত) এ কাজ করে না, এটি এমএস-ছাড়াও যুক্ত করা দরকার

— সাদ আহমেদ

লক্ষ্যমাত্রার প্রান্তের জন্য এখানে দেখুন: স্ট্যাকওভারফ্লো.com

— ফিলিস সুদারল্যান্ড

@ সাদআহমেদ: আসলেই কি সমস্যা? এজ একটি যুক্তিসঙ্গতভাবে ভাল আচরণ করা ব্রাউজার, যাইহোক আই এর চেয়ে অনেক ভাল, অনেকগুলি আইই হ্যাক সম্ভবত প্রয়োজনীয় হবে না (বা বিচক্ষণ)?

— মাইকেল শেপার

ভাল যে আমার বোকা IE সমস্যা সমাধান। ঠিক করার জন্য ধন্যবাদ!

— জেসেটার

@ মিশেলশেপার এই মন্তব্যটি প্রথম মন্তব্যে পোস্ট করা এখনও নতুন প্রান্তে প্রযোজ্য (আজকের 17 টি)। সাদের ছোট্ট ফিক্স আমাকে এই তর্কটি সরাতে সহায়তা করেছে।

— সাইমনর্যাবিট

Answer 3

আইআই শর্তসাপেক্ষ মন্তব্য ছাড়াও, আইই 6 কে আই 10 কে কীভাবে টার্গেট করা যায় সে সম্পর্কে এটি একটি আপডেট তালিকা ।

IE এর বাইরে নির্দিষ্ট সিএসএস এবং জেএস হ্যাকগুলি দেখুন ।

/***** Attribute Hacks ******/

/* IE6 */
#once { _color: blue }

/* IE6, IE7 */
#doce { *color: blue; /* or #color: blue */ }

/* Everything but IE6 */
#diecisiete { color/**/: blue }

/* IE6, IE7, IE8, but also IE9 in some cases :( */
#diecinueve { color: blue\9; }

/* IE7, IE8 */
#veinte { color/*\**/: blue\9; }

/* IE6, IE7 -- acts as an !important */
#veintesiete { color: blue !ie; } /* string after ! can be anything */

/* IE8, IE9 */
#anotherone  {color: blue\0/;} /* must go at the END of all rules */

/* IE9, IE10, IE11 */
@media screen and (min-width:0\0) {
    #veintidos { color: red}
}


/***** Selector Hacks ******/

/* IE6 and below */
* html #uno  { color: red }

/* IE7 */
*:first-child+html #dos { color: red }

/* IE8 (Everything but IE 6,7) */
html>/**/body #cuatro { color: red }

/* Everything but IE6-8 */
:root *> #quince { color: red  }

/* IE7 */
*+html #dieciocho {  color: red }

/* IE 10+ */
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
   #veintiun { color: red; }
}

Comments

আমি চেষ্টা করেছি \9এবং ক্লাস সিলেক্টারের \0/জন্য রয়েছি display, তবে দু'টিই আইই 10-তেও প্রযোজ্য। কেবলমাত্র আইই 9 এর জন্য [এবং নীচে বা না] আবেদন করার কোনও উপায় আছে কি?

— টম ব্রিটো

আপনি চেষ্টা করতে পারেন: \0/IE9তবে এটি পরীক্ষা করেননি। অন্যথায় আমি আই ৯৯-কে টার্গেট করার অন্য কোনও উপায় জানি না যদি আপনি শর্তাধীন ধারাগুলি ব্যবহার না করেন:<!--[if IE 9]><link rel="stylesheet" type="text/css" href="ie9-specific.css" /><![endif]-->

— ওরিওল

@media screen and (min-width:0\0) {হ্যাক পাশাপাশি IE11 দ্বারা বিশ্লেষণ হতে মনে হয় - দয়া করে দুবার-যাচাই করুন এবং আপনার মন্তব্য আপডেট - তাই এটা না 9 ও 10 শুধুমাত্র আছে।

— রল্ফ

আমি @ মিডিয়ার স্ক্রিন এবং (-এমএস-হাই-কনট্রাস্ট: অ্যাক্টিভ) ব্যবহার করেছি, (-ms-হাই-কনট্রাস্ট: কিছুই নয়)}} এটি দুর্দান্ত কাজ করেছে।

— হার্সিমার

Answer 4

আইই এর জন্য বেশ কয়েকটি হ্যাক উপলব্ধ

স্টাইলশিট সহ শর্তসাপেক্ষ মন্তব্য ব্যবহার করা

<!--[if IE]>
<link rel="stylesheet" type="text/css" href="only-ie.css" />
<![endif]-->

মাথা বিভাগের CSS সহ শর্তসাপেক্ষ মন্তব্য ব্যবহার করা

<!--[if IE]>
<style type="text/css">
    /************ css for all IE browsers ****************/
</style>
<![endif]-->

এইচটিএমএল উপাদানগুলির সাথে শর্তযুক্ত মন্তব্য ব্যবহার করা

<!--[if IE]> <div class="ie-only"> /*content*/ </div> <![endif]-->

মিডিয়া ক্যোয়ারী ব্যবহার করা হচ্ছে

 IE10+
 @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
 selector { property:value; }
 }

 IE6,7,9,10
 @media screen and (min-width: 640px), screen\9 {
 selector { property:value; }
 }

 IE6,7
 @media screen\9 {
  selector { property:value; }
 }

 IE8
 @media \0screen {
  selector { property:value; }
 }

 IE6,7,8
 @media \0screen\,screen\9 {
  selector { property:value; }
 }

 IE9,10
 @media screen and (min-width:0\0){
  selector { property:value; }
 }

Comments

নোট করুন যে সর্বশেষ তালিকাভুক্ত ( min-width:0\0) তালিকাভুক্ত হয়েছে

— IE11

Answer 5

পাশাপাশি শর্তসাপেক্ষ মন্তব্য সিএসএস ব্রাউজার নির্বাচনকারী http://rafael.adm.br/css_browser_selector/ ব্যবহার করতে পারে কারণ এটি আপনাকে নির্দিষ্ট ব্রাউজারগুলিকে টার্গেট করতে দেয়। তারপরে আপনি নিজের সিএসএস হিসাবে সেট করতে পারেন

.ie .actual-form table {
    width: 100%
    }

এটি আপনাকে শর্তাধীন মন্তব্যের প্রয়োজন ছাড়াই আপনার প্রধান স্টাইলশীটের মধ্যে নির্দিষ্ট ব্রাউজারগুলিকে টার্গেট করার অনুমতি দেবে।

Comments

আইই 9

— ফাস্টট্র্যাক

আমি দেখতে পাচ্ছি না কেন, আপনার সিএসএসে .ie9। প্রকৃত-ফর্ম টেবিল {প্রস্থ: 100% try চেষ্টা করুন। আশা করি এটি আপনার পক্ষে কাজ করে।

— সম্মুখভাগজজগুই

.ie9এটি 2010 এর পর থেকে আপডেট করা হয়নি বলে কাজ করে না

— হান্না

এটি অবশ্যই সবচেয়ে মার্জিত পদ্ধতির। পৃষ্ঠাটি রেন্ডার করার সময় ব্যক্তিগতভাবে আমি ব্রাউজার সিএসএস সিলেক্টর সার্ভার সাইড যুক্ত করতে পছন্দ করি।

— opsb

আপনি যদি এজেন্ট স্ট্রিং ব্যবহার করেন এবং গতিশীলভাবে দেহে নির্বাচক শ্রেণি যুক্ত করেন তবে এটি কাজ করে।

— পিকাপিকা

Answer 6

আমি মনে করি সেরা অনুশীলনের জন্য আপনার <head>ট্যাগের ভিতরে আইআই শর্তযুক্ত বিবৃতি লিখতে হবে যা ভিতরে আপনার বিশেষ অর্থাৎ স্টাইল শীটের সাথে একটি লিঙ্ক রয়েছে। এই হতে হয়েছে আপনার কাস্টম CSS লিংক পর তাই এটি আধুনিক অগ্রাহ্য, আমি একটা ছোট সাইট আছে তাই আমি সব পৃষ্ঠার জন্য একই অর্থাত CSS ব্যবহার করুন।

<link rel="stylesheet" type="text/css" href="index.css" />
<!--[if IE]>
    <link rel="stylesheet" type="text/css" href="all-ie-only.css" />
<![endif]-->

আমার মতামত হিসাবে এটি জেমসের জবাব থেকে পৃথক (ব্যক্তিগত মতামত কারণ আমি একটি ডিজাইনার দলের সাথে কাজ করি এবং আমি চাই না যে তারা আমার এইচটিএমএল ফাইলগুলিকে স্পর্শ করবে এবং সেখানে কিছু জগাখিচুড়ি করবে) আপনার এইচটিএমএল ফাইলটিতে স্টাইলগুলি কখনই অন্তর্ভুক্ত করা উচিত নয়।

Answer 7

আইআই & এবং the এর পটভূমিটি লুকানোর চেষ্টা করার সময় এটি আমার জন্য বেশ দেরি করে তবে এটি আমার জন্য পুরোপুরি কাজ করেছিল

.myclass{ 
    background-image: url("images/myimg.png");
    background-position: right top;
    background-repeat: no-repeat;
    background-size: 22px auto;
    padding-left: 48px;
    height: 42px;
    _background-image: none;
    *background-image: none;
}

আমি এই হ্যাকটি পেয়েছি: http://briancray.com/posts/target-ie6-and-ie7-with-only-1-extra-character-in-your-css/

#myelement
{
    color: #999; /* shows in all browsers */
    *color: #999; /* notice the * before the property - shows in IE7 and below */
    _color: #999; /* notice the _ before the property - shows in IE6 and below */
}

Answer 8

স্বাগতম ব্রাউজার - সনাক্তকরণ - একটি দুর্দান্ত কাজ।

<script>
    var BrowserDetect;
    BrowserDetect = {...};//  get BrowserDetect Object from the link referenced in this answer
    BrowserDetect.init();
    // On page load, detect browser (with jQuery or vanilla)
    if (BrowserDetect.browser === 'Explorer') {
      // Add 'ie' class on every element on the page.
      $('*').addClass('ie');
    }
</script>

<!-- ENSURE IE STYLES ARE AVAILABLE -->
<style>
    div.ie {
       // do something special for div on IE browser.
    }
    h1.ie {
     // do something special for h1 on IE browser.
    }
</style>

Object BrowserDetect এছাড়াও উপলব্ধ versionপ্রাক্তন জন্য - তাই আমরা নির্দিষ্ট শ্রেণীর যোগ করতে পারেন তথ্য। $('*').addClass('ie9');যদি (BrowserDetect.version == 9)।

শুভকামনা ....

Answer 9

এটি সত্যিই আইই সংস্করণগুলির উপর নির্ভর করে ... আমি এই দুর্দান্ত উত্সটি পেয়েছি যা আই 6-10 থেকে আপ টু ডেট রয়েছে :

ইন্টারনেট এক্সপ্লোরার 6 এর জন্য সিএসএস হ্যাক

একে স্টার এইচটিএমএল হ্যাক বলা হয় এবং এটি নীচে দেখায়:

• এইচটিএমএল। রঙ {রঙ: # F00; hack এই হ্যাক সম্পূর্ণরূপে বৈধ সিএসএস ব্যবহার করে।

ইন্টারনেট এক্সপ্লোরার 7 এর জন্য সিএসএস হ্যাক

একে স্টার প্লাস হ্যাক বলা হয়।

*: প্রথম-শিশু + এইচটিএমএল। রঙ {রঙ: # F00;} বা একটি সংক্ষিপ্ত সংস্করণ:

* + এইচটিএমএল। রঙ {রঙ: # F00; star তারকা এইচটিএমএল হ্যাকের মতো এটিও বৈধ CSS ব্যবহার করে।

ইন্টারনেট এক্সপ্লোরার 8 এর জন্য সিএসএস হ্যাক

@ মিডিয়া \ 0 স্ক্রিন {। রঙ {রঙ: # F00;}} এই হ্যাকগুলি বৈধ CSS ব্যবহার করে না।

ইন্টারনেট এক্সপ্লোরার 9 এর জন্য সিএসএস হ্যাক

: মূল। রঙ {রঙ: # F00 \ 9; ha এই হ্যাকগুলি বৈধ CSS ব্যবহার করে না।

যোগ করা 2013.02.04: দুর্ভাগ্যবশত আই 10 এই হ্যাকটি বোঝে।

ইন্টারনেট এক্সপ্লোরার 10 এর জন্য সিএসএস হ্যাক

@ মিডিয়া স্ক্রিন এবং (-ms-হাই-কনট্রাস্ট: সক্রিয়), (-ms-হাই-কনট্রাস্ট: কিছুই নয়) c রঙ {রঙ: # F00;} ha এই হ্যাকগুলি বৈধ CSS ব্যবহার করে না।

Comments

শেষটি আইই 11

— সিবিআর

Answer 10

/ * ইন্টারনেট এক্সপ্লোরার 9+ (এক-লাইনার) * /

_::selection, .selector { property:value\0; }

কেবলমাত্র এই সমাধানটি আমার পক্ষে পুরোপুরি কার্যকর।

Comments

আমি জানি এটি একটি নেক্রোকমেন্ট, তবে এটি দুর্দান্ত স্লিট দেখাচ্ছে। তবে কিছুটা আরকেন / বাইজেন্টাইন দেখায় এটি ঠিক কী করছে তা আমি নিশ্চিত নই। এই বিবৃতিটির শব্দার্থক শব্দটি কেউ জানেন? (_ _ এবং শেষের দিকে like 0 এর মতো?)

— অ্যাডাম আর টার্নার

এছাড়াও Chrome এর নিয়মটি প্রয়োগ করে: /

— ত্রিনকোট

Answer 11

<!--[if !IE]><body<![endif]-->
<!--[if IE]><body class="ie"> <![endif]-->

body.ie .actual-form table {
    width: 100%
}

Answer 12

আই 9 + এর জন্য

@media screen and (min-width:0\0) and (min-resolution: +72dpi) {
   // IE9+ CSS
   .selector{
      color: red;
   }
}

IE এজ 12+

@supports (-ms-ime-align: auto) {
  .selector {
    color: red;
  }
}

এটি এজ এবং সমস্ত আইইগুলিতে কাজ করে

:-ms-lang(x), .selector { color: red; }