Bollate

HTML

[ANSWERED] css – nicely formatted python code in html files

By

Nov 20, 2022 ,

Solution 1 :

Update:
I just discovered highlightjs.org, which supports over 189 languages and 91 styles, and way easier to use. There is a code sample below:

<head>
  <link rel="stylesheet"
        href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/10.0.3/styles/default.min.css">
  <script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/10.0.3/highlight.min.js"></script>
  <script>hljs.initHighlightingOnLoad();</script>
</head>
<body>
  <pre><code class="python">def fib(n):
  a, b = 0, 1
    while a < n:
      print(a, end=' ')
      a, b = b, a+b
      print()
  fib(1000)</code></pre>
</body>

Origina Post:

Try codemirror.net. More info click here and here from Stack Overflow

Or like @EternalHour said, you can use <pre>Your code here</pre> <code>Your code here</code>

Solution 2 :

you can use pygments for styling python codes in your html pages.

Problem :

What are the options to display python code in HTML pages?

I do not want to execute python code in the page, but only produce HTML/CSS pages displaying nicely formatted (with e.g., syntax highlighting) python code snippets as done, for instance, by stackoverflow.

Basically I would like a tool that takes a python file as input and generate an HTML/CSS code.

Comments

Comment posted by EternalHour

You can use either

Comment posted by John Montgomery

For syntax highlighting, what you’re looking for is called a code prettifier. There’s a lot of options for that available online, look into it and see if one fits your needs (Stack Overflow doesn’t allow recommendation questions unfortunately).

Comment posted by qouify

@EternalHour : thanks for your answer. I did not know of theses tags

Comment posted by qouify

@john-montgomery : thank you. I did not know it was called like that (code prettifier). I have found a couple of tools that seem nice.

By

Related Post

HTML

[ANSWERED] How do you add a background image in the margins and top of the page behind the body? (Html, Css)

Nov 20, 2022
HTML

[ANSWERED] html – I can’t get my carousel buttons to respond bootstrap 4

Nov 20, 2022
HTML

[ANSWERED] javascript – Locomotive Scroll not working with Vue.js when having to load images on page

Nov 20, 2022

Leave a Reply

Your email address will not be published. Required fields are marked *

You missed

HTML

[ANSWERED] javascript – Text box to display updated text and save on button click

Nov 20, 2022
HTML

[ANSWERED] javascript – Pass html tag to angularjs variable from controller

Nov 20, 2022
HTML

[ANSWERED] html – bootstrap mobile menu not scrolling instead the background is scrolling

Nov 20, 2022
HTML

[ANSWERED] html – How to play live stream YouTube videos using CEF4Delphi?

Nov 20, 2022