CSS Minifier Tool
Sure, here's a complete responsive code for a CSS minifier tool that can be embedded in an HTML document using JavaScript:
HTML Code:
php
Copy code
CSS Minifier Tool
CSS Code:
css
Copy code
.container {
margin-top: 50px;
}
@media only screen and (max-width: 768px) {
.container {
margin-top: 20px;
}
}
JavaScript Code (saved in "script.js" file):
javascript
Copy code
function minify() {
var cssInput = document.getElementById("cssInput").value;
var minifiedCss = cssInput.replace(/\s+/g, " ").replace(/\/\*.*?\*\//g, "").replace(/(^\s+|\s+$)/g, "").replace(/(\r\n|\n|\r)/gm, "");
document.getElementById("minifiedCss").value = minifiedCss;
}
This code uses Bootstrap 4 for styling and includes media queries to ensure that the page is responsive on different screen sizes. The JavaScript code defines a function that retrieves the input CSS code from the text area, minifies it using regular expressions, and displays the minified CSS in another text area
Comments
Post a Comment