Memformat angka (tempat desimal, ribuan pemisah, dll) dengan CSS

Apakah mungkin untuk memformat angka dengan CSS? Yaitu: tempat desimal, pemisah desimal, pemisah ribuan, dll.

Anda bisa menggunakan Number.prototype.toLocaleString(). Itu juga dapat memformat untuk format angka lain, misalnya latin, arab, dll.

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Number/toLocaleString

Kelompok kerja CSS telah menerbitkan Draf tentang Pemformatan Konten pada tahun 2008. Tapi tidak ada yang baru saat ini.

Nah, untuk setiap nomor di Javascript saya menggunakan yang berikutnya:

var a = "1222333444555666777888999";
a = a.replace(new RegExp("^(\\d{" + (a.length%3?a.length%3:0) + "})(\\d{3})", "g"), "$1 $2").replace(/(\d{3})+?/gi, "$1 ").trim();

dan jika Anda perlu menggunakan pemisah lain sebagai koma misalnya:

var sep = ",";
a = a.replace(/\s/g, sep);

atau sebagai fungsi:

function numberFormat(_number, _sep) {
    _number = typeof _number != "undefined" && _number > 0 ? _number : "";
    _number = _number.replace(new RegExp("^(\\d{" + (_number.length%3? _number.length%3:0) + "})(\\d{3})", "g"), "$1 $2").replace(/(\d{3})+?/gi, "$1 ").trim();
    if(typeof _sep != "undefined" && _sep != " ") {
        _number = _number.replace(/\s/g, _sep);
    }
    return _number;
}

Mungkin cara terbaik untuk melakukannya adalah kombinasi pengaturan span dengan kelas yang menunjukkan pemformatan Anda, lalu gunakan Jquery .each untuk melakukan pemformatan pada span saat DOM dimuat ...

Tidak, Anda harus menggunakan javascript setelah berada di DOM atau memformatnya melalui sisi server bahasa Anda (PHP / ruby ​​/ python dll.)

Bukan jawaban, tapi perhpas yang menarik. Saya memang mengirim proposal ke CSS WG beberapa tahun yang lalu. Namun, tidak ada yang terjadi. Jika memang mereka (dan vendor browser) akan melihat ini sebagai masalah pengembang asli, mungkin bola bisa mulai bergulir?

Jika itu membantu ...

Saya menggunakan fungsi PHP number_format()dan Narrow No-break Space (  ). Ini sering digunakan sebagai pemisah ribuan yang tidak ambigu.

echo number_format(200000, 0, "", " ");

Karena IE8 memiliki beberapa masalah untuk merender Narrow No-break Space, saya mengubahnya menjadi SPAN

echo "<span class='number'>".number_format(200000, 0, "", "<span></span>")."</span>";

.number SPAN{
    padding: 0 1px; 
}

Anda tidak dapat menggunakan CSS untuk tujuan ini. Saya merekomendasikan menggunakan JavaScript jika itu berlaku. Lihatlah ini untuk informasi lebih lanjut: JavaScript setara dengan printf / string.format

Juga Seperti yang disebutkan Petr, Anda dapat menanganinya di sisi server tetapi itu sepenuhnya tergantung pada skenario Anda.

Saya tidak berpikir Anda bisa. Anda bisa menggunakan number_format () jika Anda membuat kode dalam PHP. Dan bahasa pemrograman lainnya memiliki fungsi untuk memformat angka juga.

Anda dapat menggunakan Pustaka tag Jstl untuk memformat Halaman JSP

JSP Page
//import the jstl lib
<%@ taglib uri="http://java.sun.com/jstl/fmt" prefix="fmt" %>

<c:set var="balance" value="120000.2309" />
<p>Formatted Number (1): <fmt:formatNumber value="${balance}" 
        type="currency"/></p>
<p>Formatted Number (2): <fmt:formatNumber type="number" 
        maxIntegerDigits="3" value="${balance}" /></p>
<p>Formatted Number (3): <fmt:formatNumber type="number" 
        maxFractionDigits="3" value="${balance}" /></p>
<p>Formatted Number (4): <fmt:formatNumber type="number" 
        groupingUsed="false" value="${balance}" /></p>
<p>Formatted Number (5): <fmt:formatNumber type="percent" 
        maxIntegerDigits="3" value="${balance}" /></p>
<p>Formatted Number (6): <fmt:formatNumber type="percent" 
        minFractionDigits="10" value="${balance}" /></p>
<p>Formatted Number (7): <fmt:formatNumber type="percent" 
        maxIntegerDigits="3" value="${balance}" /></p>
<p>Formatted Number (8): <fmt:formatNumber type="number" 
        pattern="###.###E0" value="${balance}" /></p>

Hasil

Nomor Format (1): £ 120,000.23

Nomor Format (2): 000.231

Format Nomor (3): 120,000.231

Nomor Format (4): 120000.231

Nomor Diformat (5): 023%

Nomor Diformat (6): 12,000.023.0900000000%

Nomor Diformat (7): 023%

Nomor Diformat (8): 120E3