Now, click on the “Network” tab and filter by CSS.Īs the page loads the CSS will appear. This will open up the Chrome Developer Tools. Right-click the background and choose the option “Inspect”. To access the “Pretty Print” function, open Chrome and visit your website. This will make the file easier to read by adding back whitespace such as new lines and indentation. Google Chrome has a built-in “Pretty Print” function. Let's start with the fasted solution using Google Chrome “Pretty Print” function. Let's look at reversing some of the changes to make it readable again. Now that we have a good understanding of what these tools do. It's the same end result but with less characters. So tools such as CSSNano will take advantage of these optimizations for us. This takes your large CSS file and runs through a series of optimizations to produce a smaller file. The smaller the file, the faster it will download and the quicker our website performance will be. We minify CSS to make the file size smaller. We should understand what happens to the CSS when we minify it? Minify CSS Process In other words, it makes the CSS easy to read.īefore we look at how to beautify the CSS. The process of un-minifying is sometimes referred to as beautifying. Once you have made the changes to the file I will then show you how to minify the file again. This technique will convert the minified CSS back into a form that is easy to read. I will show you how you can un-minify it and make the changes you need for your site.
0 Comments
Leave a Reply. |
AuthorWrite something about yourself. No need to be fancy, just an overview. ArchivesCategories |