www.xbdev.net
xbdev - software development
Friday March 29, 2024
home | contact | Support | Javascript... so much power in such a few lines of code.. | HTML5 and Javascript Example based approach ....
>>
     
 

HTML5 and Javascript

Example based approach ....

 

Add Syntax Highlighting to your Code

Have you ever wondered how to make your code examples look nicer? To create beautify, sexy code highlighting! (As Color Does Make a Difference)

It can't be easier!

In this tutorial example:
1. You'll use Prismjs (free, simple, open source and flexible)
2. Extend the library with prism-live to support textarea highlighting


Below shows an example of with and without highlighting added two a textarea:


vs




Here are the three steps to adding code highlighting to your web page:
1. The steps are really easy, add the .css script to the top of your file (before your highlighted code).
2. Put your code in a 'textarea' tag, ensure you add the class="prism-live language-markup"
3. At the bottom of your file, add the .js script
4. Ta-da! It should just work!

Here is the Complete Code




References

* Download Source Code
* Homepage: https://prismjs.com/
* PrismJS-Live: https://prismjs.com/download.html#themes=prism&languages=markup+css+clike+javascript
* Online Editor [Link]



 
Advert (Support Website)

 
 Visitor:
Copyright (c) 2002-2024 xbdev.net - All rights reserved.
Designated articles, tutorials and software are the property of their respective owners.