1. Put the below style links in your head section.
<link href='http://cdnjs.cloudflare.com/ajax/libs/prettify/r298/prettify.css' rel='stylesheet' type='text/css'/> <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
2. Now, place this script link before the closing body tag </body>
<script src='http://cdnjs.cloudflare.com/ajax/libs/prettify/r298/run_prettify.js'></script>
3. finally you can put your code in a pre tag with prettyprint class. your code block will be styled as per bootstrap pre class and syntax will be highlighted automatically with code-prettify.
<pre class="prettyprint">
x = input("Please Enter a number to reverse: ")
reverse = 0
while(x):
reverse = reverse * 10
reverse = reverse + x % 10
x = x/10
print(reverse)
</pre>
Here is a full working example with everything done as said in above steps.
<!DOCTYPE html>
<html>
<head>
<title>Code Prettify Example</title>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
<link href='http://cdnjs.cloudflare.com/ajax/libs/prettify/r298/prettify.css' rel='stylesheet' type='text/css'/>
</head>
<body>
<div class="container">
<pre class="prettyprint">
x = input("Please Enter a number to reverse: ")
reverse = 0
while(x):
reverse = reverse * 10
reverse = reverse + x % 10
x = x/10
print(reverse)
</pre>
</div>
<script src='http://cdnjs.cloudflare.com/ajax/libs/prettify/r298/run_prettify.js'></script>
</body>
</html>
Tweet
No comments:
Post a Comment