php - full - image size html




تجاوز خلفية اللون بنسبة معينة (2)

في فب:

echo "
<td>
    <div class='progress-bar' style='width: $percent_friendly%'></div>
    <span>$percent_friendly%</span>
</td>";

في كس:

td               { position: relative; }
td .progress-bar { position: absolute; background: grey; top: 0; bottom: 0; left: 0; }
td span          { position: relative; }

هذا يتيح لك تطبيق أي أنماط الهيكلية / الخط إلى عنصر td ، وسوف شريط التقدم ضبط بشكل صحيح من تلقاء نفسها.

أضيف صفا من خلال a <table> foreach <table> مع foreach .

في مرحلة ما أريد خلية لديها خلفية رمادية على أساس نسبة كالكولتاتد في فب.

مثال: 50٪ يعني نصف خلفية الخلية التي تكون رمادية والباقي تبقى فارغة | 33،33٪ = 1/3 من الخلفية وما إلى ذلك.

المشاكل التي التقيت بها إما النص في <td> حصلت ستريشد من قبل أي ديف الأخرى، إذا كنت تطبيق اللون إلى <td> أنا أيضا تجاوز النص في وقت لاحق على الخ ..

إليك الرمز:

$percent = 1/3; // For example
$percent_friendly = number_format( $percent * 100, 2 ); //This will return 33.33

echo '<td>'.$percent_friendly.' %
    <div style="background-color: grey"> // So I want the grey to fill 33.33% of the space
    </div>
    <div style="background-color: white">
    </div>
</td>';

والأسلوب المطبق حتى الآن:

table {
    margin-left:auto; 
    margin-right:auto;
    font-size:18px;
}

table, th, td {
    text-align: center;
    border: 1px solid black;
    position:relative;
}

يجب أن يكون في عداد المفقودين شيء ولكن كس حقا ليس شيئا، أي تفسير أو مساعدة سيكون موضع تقدير كبير.


هل يمكن استخدام التدرج الخطي للون الخلفية، إذا كنت لا تمانع في النظر مربكة بعض الشيء:

echo '<td style="background: linear-gradient(to right, grey 0%,grey '.$percent.'%,white '.$percent.'%,white 100%);">'.
            $percent_friendly.'%'.
     '</td>';

كن على علم من أن هذا لن تعمل في IE9 وأدناه





percentage