highlight多种语言与主题示例代码
代码语言:html
所属分类:其他
代码描述:highlight多种语言与主题示例代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html> <html lang="en" > <head> <meta charset="UTF-8"> <link rel='stylesheet' href='//repo.bfw.wiki/bfwrepo/js/styles/dracula.min.css'> <style> body, html { background: #F3F5FF; font-family: "Roboto", sans-serif; } * { box-sizing: border-box; } .Container { width: 500px; border-radius: 6px; position: relative; background: #282B36; margin: 60px auto 0 auto; box-shadow: 0 10px 40px 0 rgba(40, 43, 54, 0.3); } .Container nav { top: 15px; left: 15px; position: absolute; } .Container nav a { z-index: 2; color: #A5AAAF; font-size: 13px; padding: 5px 8px; border-radius: 4px; display: inline-block; text-decoration: none; } .Container nav a:hover, .Container nav a.active { color: white; } .Container nav .current { top: 0; left: 0; z-index: 0; width: 40px; height: 22px; border-radius: 3px; position: absolute; background-color: rgba(255, 255, 255, 0.2); } .Container .Contents { width: 100%; display: flex; overflow: hidden; align-items: flex-start; } .Container .Content { width: 100%; flex-shrink: 0; color: #FFFFFF; font-size: 15px; line-height: 24px; padding: 60px 30px 30px 30px; } .Container .Content .hljs { padding: 0; font-size: 13px; line-height: 24px; font-family: Consolas, Monaco, monospace; } .hljs-number { color: #FFC24C; } .credit { left: 50%; bottom: 30px; width: 300px; position: fixed; text-align: center; margin-left: -150px; } .credit p { color: #6C738B; font-size: 13px; font-weight: 300; line-height: 20px; } .credit p a { color: #32325D; font-weight: 400; text-decoration: none; } .credit p a:hover { color: #5C33FF; } </style> </head> <body > <div class="Container"> <nav> <div class="current"></div> <a href="#one" class="active">Ruby</a> <a href="#two">Python</a> <a href="#three">Node</a> <a href="#four">Go</a> </nav> <div class="Contents"> <div class="Content" id="one"> <pre><code>require "stripe" Stripe.api_key = "..." Stripe::Charge.create( :amount => 2000, :currency => "eur", :source => "tok_mastercard", # obtained with Stripe.js :description => "Charge for <a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="8ce4e9e0e0e3ccf8e4e3e1edffeff9e0e0e9e2a2e5e3">[email protected]</a>" )</code></pre> </div> <div class="Content" id="two"> <pre class="python"><code>import stripe stripe.api_key = "..." stripe.Charge.create( amount=2000, currency="eur", source="tok_amex", # obtained with Stripe.js description="Charge for <a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="d6bbb7b2bfa5b9b8f8a1bfbaa5b9b896b3aeb7bba6bab3f8b5b9bb">[email protected]</a>" )</pre></code> </div> <div class="Content" id="three"> <pre><code>var stripe = require("stripe")( "..." ); stripe.charges.create({ amount: 2000, currency: "eur", source: "tok_visa", // obtained with Stripe.js description: "Charge for <a href="/" class="__cf_email__" data-cfemail="83e9e2fae7e6edadeee2f1f7eaede6f9c3e6fbe2eef3efe6ade0ecee">[ema.........完整代码请登录后点击上方下载按钮下载查看
网友评论0