ইন্টারনেট এক্সপ্লোরার 9 এ গ্রেডিয়েন্টস

Question

আইই 9 এর মধ্যে গ্রেডিয়েন্টগুলির জন্য কেউ বিক্রেতা উপসর্গটি জানেন কি আমরা এখনও তাদের মালিকানা ফিল্টারগুলি ব্যবহার করব বলে মনে করা হচ্ছে?

অন্যান্য ব্রাউজারগুলির জন্য আমি যা পেয়েছি তা হ'ল:

background-image: -moz-linear-gradient(top, #444444, #999999); /* FF3.6 */
background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0, #444444),color-stop(1, #999999)); /* Saf4+, Chrome */
filter:  progid:DXImageTransform.Microsoft.gradient(startColorStr='#444444', EndColorStr='#999999'); /* IE6,IE7 */
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorStr='#444444', EndColorStr='#999999')"; /* IE8 */

বোনাস হিসাবে কেউ কি অপেরার বিক্রেতা উপসর্গটিও জানেন?

Comments

যদিও আমি একটি উত্তর নির্বাচন করেছি - এটি কেবলমাত্র এই সময়ে প্রাসঙ্গিক। যদি এটি পরিবর্তন হয় তবে কেউ কি থ্রেড আপডেট করতে পারবেন? অনেক প্রশংসিত.

— স্নিফার

পুরোটাই। আমার সন্দেহ হয় আইই 9 এখন গ্রেডিয়েন্টগুলি কার্যকর করবে যদিও এটি বিটাতে রয়েছে।

— পল ডি ওয়েট

আইই 9 গ্রেডিয়েন্টগুলি সমর্থন করে না তবে আইই 10 করবে।

— ক্যাচ 22

আইই হ'ল একসাথে এক ভয়ঙ্কর ব্রাউজার, ইনলাইন ব্লকগুলি সমর্থন করে না, অবস্থানের মানগুলি অকারণে বিরতি দেয় না, গ্রেডিয়েন্ট সমর্থন করে না, সমস্ত নরকের মতো ধীরে ধীরে ... আসুন আমরা সকলেই সতর্ক করতে শুরু করি যে তারা আমাদের অপচয় করার পরিবর্তে আইই ব্যবহার করা বন্ধ করতে হবে একটি সাব স্ট্যান্ডার্ড ব্রাউজার সমর্থন সময়। ব্যক্তিগতভাবে আমি বহু বছর ধরে আইই ব্যবহারকারীদের আমার কোনও পৃষ্ঠা দেখার থেকে নিখুঁতভাবে থামিয়ে আসছি (তাদের সত্যিকারের ব্রাউজারটি পেতে নির্দেশ দিন) এবং আমি কখনও বিক্রয় হারাতে পারি নি। কিছু গবেষণা করুন এবং আপনি সমস্ত ইন্টারনেট ট্রাফিকের <5% এবং বিক্রয় <1% এর জন্য IE অ্যাকাউন্টগুলি দেখতে পাবেন। আমরা কেন এটি সমর্থন করছি?

ড্যান, আমি আপনার নম্বরগুলি কোথা থেকে আসছে সে সম্পর্কে আগ্রহী হব, আমি একক উত্স খুঁজে পাচ্ছি না যে জানিয়েছে যে আইই ট্র্যাফিকের 5%।

— জেমি টেলর

Answer 1

আপনার এখনও আই 9 9 বিটা 1 হিসাবে তাদের মালিকানা ফিল্টার ব্যবহার করতে হবে।

Comments

সিএসএসপ্লেজ২৪.কমের তথ্য অনুসারে, আই এস 10 সিএসএস গ্রেডিয়েন্টকে সমর্থন করার কারণে দেখায়, যা ভাল খবর ...

— স্নিফার

css3please.com আমার একটি সমাধান খুঁজতে আমাকে সহায়তা করেছিল। ধন্যবাদ

— রিডোল্যান্ট

Answer 2

দেখে মনে হচ্ছে পার্টিতে আমি কিছুটা দেরি করেছি, তবে শীর্ষ ব্রাউজারগুলির কয়েকটি উদাহরণ এখানে:

/* IE10 */ 
background-image: -ms-linear-gradient(top, #444444 0%, #999999 100%);

/* Mozilla Firefox */ 
background-image: -moz-linear-gradient(top, #444444 0%, #999999 100%);

/* Opera */ 
background-image: -o-linear-gradient(top, #444444 0%, #999999 100%);

/* Webkit (Safari/Chrome 10) */ 
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #444444), color-stop(1, #999999));

/* Webkit (Chrome 11+) */ 
background-image: -webkit-linear-gradient(top, #444444 0%, #999999 100%);

/* Proposed W3C Markup */ 
background-image: linear-gradient(top, #444444 0%, #999999 100%);

সূত্র: http://ie.microsoft.com/testdrive/Graphics/CSS গ্রেডিয়েন্টব্যাকগ্রাউন্ডমেকার / ডেফল্ট এইচটিএমএল

দ্রষ্টব্য: এই সমস্ত ব্রাউজারগুলি হেক্সাডেসিমাল নোটেশনের পরিবর্তে rgb / rgba সমর্থন করে।

Comments

আমি এখনও IE10 কে একটি প্রধান ব্রাউজার হিসাবে বিবেচনা করব না।

— ডেভিড মুরডোক

@ ডেভিড মুরডোক যে প্রযুক্তিগতভাবে সত্য, তবে এটি আপনার সিএসএসের মালিকানা বর্ধনকে যুক্ত না করার কোনও অর্থ হয় না, কারণ এটি কী হবে তা আমরা জানি। সর্বোপরি, IE10 একটি প্রধান ব্রাউজারে পরিণত হবে।

— thepeer

@ রোবটসুশি যদিও এটি আই 9 এর প্রশ্নের উত্তর দেয় না (নির্বাচিত উত্তর দেয় যা সম্ভবত এটি বেছে নেওয়া হয়েছিল), এই প্রশ্নটি "ইন্টারনেট এক্সপ্লোরার সিএসএস গ্রেডিয়েন্টস" এর জন্য গুগলের ফলাফলের প্রথম পৃষ্ঠায়, সুতরাং সেখানে নেই আইই ১০ এখন উইন্ডোজ for এর জন্য প্রায় প্রস্তুত বলে এখানে দরকারী কিছু হওয়ায় যে কোনও ক্ষয়ক্ষতি নেই

— কেভিন আর্থার

ফায়ারফক্স এবং অপেরা এর সর্বশেষতম সংস্করণগুলি ডাব্লু 3 সি স্ট্যান্ডার্ডকে সমর্থন করে। (আমি উইন্ডোজ 7 তে ফায়ারফক্স 19 এবং অপেরা 12.14 এ পরীক্ষা করেছি)

— জয়ভি

যেহেতু এটি আই -9-কে সম্বোধন করে এমন প্রশ্নের শীর্ষ ভোটের উত্তর, এটি ফিল্টার যুক্ত করতে হবে: শেষ পর্যন্ত যাতে এতে আই 9 সমর্থন অন্তর্ভুক্ত থাকে।

— জোয়েল কোহোর্ন

Answer 3

সেরা ক্রস ব্রাউজার সমাধান হয়

background: #fff;
background: -moz-linear-gradient(#fff, #000);
background: -webkit-linear-gradient(#fff, #000);
background: -o-linear-gradient(#fff, #000);
background: -ms-linear-gradient(#fff, #000);/*For IE10*/
background: linear-gradient(#fff, #000);
filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#ffffff', endColorstr='#000000');/*For IE7-8-9*/ 
height: 1%;/*For IE7*/ 

Answer 4

আইই 9 এর বর্তমানে CSS3 গ্রেডিয়েন্ট সমর্থন নেই। যাইহোক, পরিবর্তে একটি এসভিজি (উল্লম্ব রৈখিক) গ্রেডিয়েন্ট ফিরিয়ে আনার জন্য পিএইচপি ব্যবহার করে একটি দুর্দান্ত কার্যক্ষম সমাধান রয়েছে যা আমাদের স্টাইলশীটে আমাদের ডিজাইনটি রাখতে দেয়।

<?php

$from_stop = isset($_GET['from']) ? $_GET['from'] : '000000';
$to_stop = isset($_GET['to']) ? $_GET['to'] : '000000';

header('Content-type: image/svg+xml; charset=utf-8');

echo '<?xml version="1.0"?>
';

?>
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="100%" height="100%">
    <defs>
        <linearGradient id="linear-gradient" x1="0%" y1="0%" x2="0%" y2="100%">
            <stop offset="0%" stop-color="#<?php echo $from_stop; ?>" stop-opacity="1"/>
            <stop offset="100%" stop-color="#<?php echo $to_stop; ?>" stop-opacity="1"/>
        </linearGradient>
    </defs>
    <rect width="100%" height="100%" fill="url(#linear-gradient)"/>
</svg>

কেবল এটি আপনার সার্ভারে আপলোড করুন এবং ইউআরএলকে কল করুন:

gradient.php?from=f00&to=00f

এটি আপনার সিএসএস 3 গ্রেডিয়েন্টগুলির সাথে একত্রে ব্যবহার করা যেতে পারে:

.my-color {
    background-color: #f00;
    background-image: url(gradient.php?from=f00&to=00f);
    background-image: -webkit-gradient(linear, left top, left bottom, from(#f00), to(#00f));
    background-image: -webkit-linear-gradient(top, #f00, #00f);
    background-image: -moz-linear-gradient(top, #f00, #00f);
    background-image: linear-gradient(top, #f00, #00f);
}

আপনি যদি আই 9 এর নীচে লক্ষ্য করতে চান তবে আপনি এখনও পুরানো মালিকানাধীন 'ফিল্টার' পদ্ধতিটি ব্যবহার করতে পারেন:

.ie7 .my-color, .ie8 .my-color {
    filter: progid:DXImageTransform.Microsoft.Gradient(startColorStr="#ff0000", endColorStr="#0000ff");
}

অবশ্যই আপনি গ্রেডিয়েন্টে আরও স্টপ যুক্ত করতে পিএইচপি কোড সংশোধন করতে পারেন, বা আরও পরিশীলিত (রেডিয়াল গ্রেডিয়েন্টস, স্বচ্ছতা ইত্যাদি) তৈরি করতে পারেন তবে এই সাধারণ (উল্লম্ব) লিনিয়ার গ্রেডিয়েন্টগুলির জন্য এটি দুর্দান্ত।

Comments

মার্জিত সমাধান। এফওয়াইআই: আমি কেবল নিশ্চিত করেছি যে ব্রাউজারগুলি সমর্থন করার জন্য এসভিজি ডাউনলোড করা হয়নিlinear-gradient ।

— জোনাথন ক্রস

আমি ভাবছি যদি এই এসভিজি ফাইলগুলি তৈরি হয়ে যায় তখন তাদের ক্যাশে দেওয়ার কোনও উপায় আছে কিনা?

— মাইক Kormendy

আরও শক্তিশালী প্রশ্ন হ'ল প্রতিটি ক্যাশযুক্ত ফাইলের অনুরোধের জন্য সময় এবং সার্ভারের লোড উভয় ক্ষেত্রে পারফরম্যান্স কী তা খুঁজে পাওয়া উচিত each প্রতিবার এবং একবার ফাইল স্ট্রিম উত্পন্ন করার জন্য।

— মাইক Kormendy

পিএইচপি-এর আপনার ইউআই ডিজাইনে কখনও জ্ঞান বা সহায়তা থাকা উচিত নয়। ক্লায়েন্টের ক্লায়েন্টের প্রয়োজনীয়তা রাখুন।

— অ্যালেক্স হোয়াইট

Answer 5

আমি সমস্ত ব্রাউজার গ্রেডিয়েন্টের জন্য কোডটি ব্যবহার করি:

background: #0A284B;
background: -webkit-gradient(linear, left top, left bottom, from(#0A284B), to(#135887));
background: -webkit-linear-gradient(#0A284B, #135887);
background: -moz-linear-gradient(top, #0A284B, #135887);
background: -ms-linear-gradient(#0A284B, #135887);
background: -o-linear-gradient(#0A284B, #135887);
background: linear-gradient(#0A284B, #135887);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#0A284B', endColorstr='#135887');
zoom: 1;

আইইতে কাজ করার জন্য আপনাকে একটি উচ্চতা নির্দিষ্ট করতে হবে বা উপাদানটিতে zoom: 1প্রয়োগ hasLayoutকরতে হবে।

---

হালনাগাদ:

আপনারা কম ব্যবহারকারীর জন্য এখানে একটি কম মেশিন (সিএসএস) সংস্করণ রয়েছে:

.gradient(@start, @end) {
    background: mix(@start, @end, 50%);
    filter: ~"progid:DXImageTransform.Microsoft.gradient(startColorStr="@start~", EndColorStr="@end~")";
    background: -webkit-gradient(linear, left top, left bottom, from(@start), to(@end));
    background: -webkit-linear-gradient(@start, @end);
    background: -moz-linear-gradient(top, @start, @end);
    background: -ms-linear-gradient(@start, @end);
    background: -o-linear-gradient(@start, @end);
    background: linear-gradient(@start, @end);
    zoom: 1;
}

Comments

কম ব্যবহারকারী হিসাবে, আমি গ্রেডিয়েন্টগুলি আইই 9-তেও কাজ করতে পারি সে জন্য একটি উপায় খুঁজছিলাম hunting আমি কীভাবে এসভিজি জেনারেট করতে হবে সে সম্পর্কে একটি ব্লগ নিবন্ধ পেয়েছি: blog.philipbrown.id.au/2012/09/…

— জেমস লং

Answer 6

অপেরা শীঘ্রই গ্রেডিয়েন্ট সমর্থন, পাশাপাশি অন্যান্য সিএসএস বৈশিষ্ট্য সহ বিল্ডগুলি পাওয়া শুরু করবে।

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

প্রতিটি ব্রাউজার সংস্থা বিভিন্ন সফ্টওয়্যার চক্র পদ্ধতি, পরীক্ষা ইত্যাদি ব্যবহার করে। প্রক্রিয়া সময় লাগে।

আমি নিশ্চিত যে অনেক, অনেক পাঠকই ভাল জানেন যে আপনি সিএসএস 3-তে কিছু ব্যবহার করলে আপনি "প্রগতিশীল বর্ধন" বলে যা করছেন - সর্বাধিক সমর্থন সহ ব্রাউজারগুলি সেরা অভিজ্ঞতা পান। এর অন্য অংশটি হ'ল "ক্রেফুল অবক্ষয়" যার অর্থ অভিজ্ঞতা সম্মত হবে তবে যতক্ষণ না ব্রাউজারটি মডিউলটি প্রয়োগ না করে বা মডিউলের যে অংশগুলি আপনি করতে চান তা প্রাসঙ্গিক না হওয়া পর্যন্ত সম্ভবত সেরা বা আকর্ষণীয় নয়।

এটি বেশ অদ্ভুত পরিস্থিতি তৈরি করে যা দুর্ভাগ্যক্রমে ফ্রন্ট-এন্ড ডেভসগুলি অত্যন্ত হতাশ হয়ে পড়ে: বাস্তবায়নের ক্ষেত্রে অসঙ্গত সময় istent সুতরাং এটি উভয় পক্ষেই সত্যিকারের চ্যালেঞ্জ - আপনি কি ব্রাউজার সংস্থাগুলি, ডাব্লু 3 সি বা আরও খারাপটিকে দোষ দিচ্ছেন - নিজেরাই (সদাচরণ জানেন আমরা এটি সব জানতে পারি না!) আমাদের মধ্যে যারা ব্রাউজার সংস্থা এবং ডব্লু 3 সি গ্রুপের জন্য কাজ করছেন তারা কি করেন? সদস্যরা নিজেদের দোষ দেয়? আপনি?

অবশ্যই না. এটি সর্বদা ভারসাম্যের একটি খেলা, এবং এখনও পর্যন্ত, আমরা কোনও শিল্প হিসাবে খুঁজে পাইনি যেখানে ভারসাম্যের সেই বিন্দুটি আসলে is বিবর্তনমূলক প্রযুক্তিতে কাজ করার আনন্দ এটিই :)

Answer 7

আমি বুঝতে পারি যে IE9 এখনও সিএসএস গ্রেডিয়েন্টকে সমর্থন করবে না। যা লজ্জাজনক, কারণ এটি অন্যান্য দুর্দান্ত নতুন স্টাফগুলিকে সমর্থন করে।

আপনি সর্বনিম্ন কোলাহল সহ বিভিন্ন CSS3 বৈশিষ্ট্য (গ্রেডিয়েন্টগুলি সহ, তবে বর্ডার-ব্যাসার্ধ এবং বাক্স-ছায়া সহ) সমর্থন করতে IE এর সমস্ত সংস্করণ পাওয়ার আইওর উপায় হিসাবে আপনি CSS3Pie দেখতে চাইবেন want

আমি বিশ্বাস করি CSS3Pie আই 9 এর সাথে কাজ করে (আমি এটি প্রাক-প্রকাশের সংস্করণে চেষ্টা করেছি, তবে বর্তমান বিটাতে এখনও নেই)।

Comments

ধন্যবাদ স্পডলি আমি আই এস to থেকে ৮ এ CSS3Pie ব্যবহার করছি, তবে আমি IE9 এ এটি ব্যবহার থেকে দূরে সরিয়ে নেওয়ার আশা করছিলাম! আইই 8-এ আমার CSS3Pie স্টাইল সহ প্রতিটি আই-এর জন্য আলাদা স্টাইলশিট পেয়েছি। যতক্ষণ না আমি বর্তমানে ব্যবহার করা CSS3 থেকে গ্রেডিয়েন্টগুলি একমাত্র জিনিস অনুপস্থিত, আমি আইএস 9 এর জন্য CSS3Pie ব্যবহার না করেই অন্য স্টাইলশিট যুক্ত করব যদি আমি এটি থেকে সরে যেতে পারি।

— স্নিফার

আমি এই পোস্টটি দেখতে পাইনি, আমার খারাপ। কেবল একটি উত্তর লিখেছিল এবং একই তথ্য দিয়ে মুছতে ভোট দিয়েছিল। দ্রষ্টব্য: জানা সমস্যাগুলি সম্পর্কে সতর্ক থাকুন: css3pie.com/docamentation/

— علوم-

Answer 8

আইআই 9 সম্পর্কে নিশ্চিত নন, তবে অপেরা এখনও কোনও গ্রেডিয়েন্ট সমর্থন বলে মনে করছেন না:

• http://www.opera.com/docs/specs/presto26/#css

এই পৃষ্ঠায় "গ্রেডিয়েন্ট" এর কোনও উপস্থিতি নেই।

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

• http://robertnyman.com/2010/02/15/css-gradients-for-all-web-browsers-without-using-images/

নিশ্চিত না যে ফ্যালব্যাক হিসাবে কোনও চিত্র ব্যবহার করতে এটি বাড়ানো যায় কিনা।

Comments

এটি আমাকে অবাক করে দেয়, যেহেতু অপেরা সাধারণত মানগুলি প্রয়োগের ক্ষেত্রে সর্বাগ্রে থাকে। উত্তরের জন্য ধন্যবাদ পল।

— স্নিফার

আমি মনে করি না যদিও গ্রেডিয়েন্টগুলি এটিকে এখনও একটি মান হিসাবে তৈরি করেছে। আমি প্রক্রিয়াটি বোঝার সাথে সাথে নতুন সিএসএস বৈশিষ্ট্যগুলি ব্রাউজারে প্রয়োগ করা হয়, পরে শেষ পর্যন্ত একটি স্ট্যান্ডার্ডে নির্দিষ্ট করা হয়। আমি বিশ্বাস করি ওয়েবকিট টিম প্রথমে সিএসএসে গ্রেডিয়েন্টগুলি প্রয়োগ করে (যদি আপনি মাইক্রোসফ্ট এবং তাদের filterজিনিস গণনা করেন না, যা সত্যই আমার বইয়ের সিএসএস হিসাবে যোগ্যতা অর্জন করে না)। ফায়ারফক্স এখন তাদের অনুসরণ করেছে, তবে ডাব্লু 3 সি সিএসএস খসড়াটিতে এখনও কিছু নেই বলে মনে হচ্ছে: google.co.uk/… দেখুন

— পল ডি ওয়েট

Answer 9

সংস্করণ 11 হিসাবে, অপেরা-বিক্রেতা-উপসর্গের সাথে রৈখিক গ্রেডিয়েন্টগুলি সমর্থন করে। ক্রিস মিলস একটি Dev.Opera নিবন্ধ লিখেছিলেন এটি সম্পর্কে: http://dev.opera.com/articles/view/css3-linear-gradient/

র‌্যাডিয়াল গ্রেডিয়েন্টগুলি এখনও চলছে (উভয় অনুমানে এবং অপেরার মধ্যে)।

Answer 10

একটি গ্রেডিয়েন্ট জেনারেটর ব্যবহার করুন - এবং সবকিছু নিখুঁত হবে;) http://www.colorzilla.com/gradient-editor/