Summary of the most complete Mac code style in the whole network

Mac style code style, who would say no to it? So how to convert the code into Mac style in the interface of articles, blog posts, PPT reports, etc.? The island owner is here to teach you 4 methods

1. A Fantastic Converting Site

Recommended index: ⭐⭐⭐⭐⭐Just
paste the code on it, choose your favorite code color style and background style, and you can export a Mac-style code screenshot with one click, very elegant, isn’t it!
insert image description here

Reply "mac" in the comments to get the URL link.

2. Universal vscode plugin

Recommended index: ⭐⭐⭐⭐⭐
If you use vscode, then just download the plugin: codeSnape.
insert image description here
The method of use is extremely simple. Select the code and right-click on codesnape to convert it into a mac-style image.

3. Blog post writing website (strongly recommended for students who operate official accounts)

Recommendation index: ⭐⭐⭐⭐Many
people privately message me in the background to ask how to display the code in the official account in Mac style. Here is also a website that I recommend to everyone.
First of all, it is stated that this method needs to use markdown syntax to write blog posts, which is a bit of a threshold. But once you are familiar with this syntax, the speed of writing articles will increase several times! That's right, rich text is really the root of all evil~~
The effect is as follows:
insert image description here

If you want to get started with markdown, please read the previous article of the island owner:
https://zhuanlan.zhihu.com/p/103348449

The advantage is that the code converted through this website can be pasted and copied, unlike the previous two, which are only screenshots of the code.

Reply "mac" in the comments to get the URL link.

4. Use markdown syntax in VsCode to implement mac-style code blocks

Recommendation index: ⭐⭐Assuming
that you don't like the website recommended above, then there is a piece of magical code that can also achieve the same effect.
This code is self-tested in vscode.

<html>
<style>
    .mac {
    
    
        width:10px;
        height:10px;
        border-radius:5px;
        float:left;
        margin:10px 0 0 5px;
    }
    .b1 {
    
    
        background:#E0443E;
        margin-left: 10px;
    }
    .b2 {
    
     background:#DEA123; }
    .b3 {
    
     background:#1AAB29; }
    .warpper{
    
    
        background:#121212;
        border-radius:5px;
        width:400px;
    }
</style>
<div class="warpper">
    <div class="mac b1"></div>
    <div class="mac b2"></div>
    <div class="mac b3"></div>
<div>
<br>
</html>

```cpp
#include<iostream>
using namespace std;
int main(){
    
    
    return 0;
}

insert image description here

summary moment

It's time to wrap up again. For students with difficulty in choosing, the following suggestions are for reference only:

If you want a screenshot of the code and don't want to toss vscode, method 1 is the first choice;
If you usually use vscode for development, the codesnape plug-in is the first choice;
If you usually write official accounts, method 3 is strongly recommended;
Method 4 is for reference only and is not very practical.