【技术】js和css的大小写转化

    xiaoxiao2022-07-06  191

    1.javascript 转大写:

    var str="Hello world!"; str=str.toUpperCase();

    转小写:

    var str="Hello world!"; str=str.toLowerCase();

    2.css 转大写:

    text-transform:uppercase;

    转小写:

    text-transform:lowercase;

    首字母大写:

    text-transform:capitalize;

    实例:

    <!doctype html> <html> <head> <link rel="stylesheet" href="lib/style.css"> <script src="lib/script.js"></script> <style> .word::before{ content:"Hello world!" } .uppercase{ text-transform:uppercase; } .lowercase{ text-transform:lowercase; } .capital{ text-transform:capitalize; } pre{ font-family:sans-serif } </style> </head> <body> <h1>大小写转化</h1> <h2>js部分</h2> <ol> <li> <h6>js转大写:</h6> <pre> var str="Hello world!"; str=str.toUpperCase(); </pre> </li> <li> <h6>js转小写</h6> <pre> var str="Hello world!"; str=str.toLowerCase(); </pre> </li> </ol> <h2>css部分</h2> <ol> <li> <h6>转大写</h6> <p class="word uppercase"><p> </li> <li> <h6>转小写</h6> <p class="word lowercase"></p> </li> <li> <h6>首字母大写</h6> <p class="word capital"></p> </li> </ol> <script> var str="Hello world!" alert("原始字符串:Hello world!\n"+ "转大写 str.toUpperCase(): "+str.toUpperCase()+ "\n转小写 str.toLowerCase(): "+str.toLowerCase() ); </script> </body> </html>

    在线编辑预览:大小写转化

    最新回复(0)