hugo-blog/public/elements/index.html

17 lines
362 KiB
HTML
Raw Permalink Normal View History

<!doctype html><html lang=en-us><head><meta charset=utf-8><title>Elements</title><base href=https://demo.gethugothemes.com/reporter/><link rel=alternate hreflang=en href=https://demo.gethugothemes.com/reporter/elements/><link rel=alternate hreflang=fr href=https://demo.gethugothemes.com/reporter/fr/elements/><link rel=alternate hreflang=x-default href=https://demo.gethugothemes.com/reporter/elements/><meta name=viewport content="width=device-width,initial-scale=1,maximum-scale=5"><meta name=description content="this is meta description"><meta name=author content="Themefisher"><meta name=generator content="Hugo 0.85.0"><link rel="shortcut icon" href=/reporter/images/favicon_huc22558c83d5b7272ed2f6a642d813294_1645_32x0_resize_box_2.png type=image/x-icon><link rel=icon href=/reporter/images/favicon_huc22558c83d5b7272ed2f6a642d813294_1645_32x0_resize_box_2.png type=image/x-icon><link rel=icon type=image/png sizes=16x16 href=/reporter/images/favicon_huc22558c83d5b7272ed2f6a642d813294_1645_16x0_resize_box_2.png><link rel=icon type=image/png sizes=32x32 href=/reporter/images/favicon_huc22558c83d5b7272ed2f6a642d813294_1645_32x0_resize_box_2.png><link rel=apple-touch-icon sizes=180x180 href=/reporter/images/favicon_huc22558c83d5b7272ed2f6a642d813294_1645_180x0_resize_box_2.png><link rel=manifest href=/reporter/manifest.webmanifest><meta name=msapplication-TileColor content="#13AE6F"><meta name=theme-color content="#fff"><meta name=twitter:title content="Elements"><meta name=twitter:description content="this is meta description"><meta property="og:title" content="Elements"><meta property="og:description" content="this is meta description"><meta property="og:type" content="article"><meta property="og:url" content="https://demo.gethugothemes.com/reporter/elements/"><meta property="article:section" content><meta name=twitter:card content="summary"><meta name=twitter:title content="Elements"><meta name=twitter:description content="this is meta description"><link rel="shortcut icon" href=https://demo.gethugothemes.com/reporter/images/favicon.png type=image/x-icon><link rel=icon href=https://demo.gethugothemes.com/reporter/images/favicon.png type=image/x-icon><meta http-equiv=x-dns-prefetch-control content="on"><link rel=preconnect href=//ajax.googleapis.com><link rel=preconnect href=https://fonts.gstatic.com crossorigin=anonymous><link rel=preconnect href=https://use.fontawesome.com crossorigin><link rel=preconnect href=//cdnjs.cloudflare.com><link rel=preconnect href=//www.googletagmanager.com><link rel=preconnect href=//www.google-analytics.com><link rel=dns-prefetch href=https://fonts.gstatic.com><link rel=dns-prefetch href=https://use.fontawesome.com><link rel=dns-prefetch href=//ajax.googleapis.com><link rel=dns-prefetch href=//cdnjs.cloudflare.com><link rel=dns-prefetch href=//www.googletagmanager.com><link rel=dns-prefetch href=//www.google-analytics.com><link rel=dns-prefetch href=//fonts.googleapis.com><link rel=dns-prefetch href=//connect.facebook.net><link rel=dns-prefetch href=//platform.linkedin.com><link rel=dns-prefetch href=//platform.twitter.com><style crossorigin=anonymous media=all type=text/css integrity="sha512-fopc3r4/C96frrJzrPxdgjAvA5qYCVhgzxUxyukzLQtDqTTaj4uL0Vu0f0O8wnUBP7LAZOs1VSEyu1aV4x4bSQ==">/*!* Bootstrap v4.5.2 (https://getbootstrap.com/)
* Copyright 2011-2020 The Bootstrap Authors
* Copyright 2011-2020 Twitter, Inc.
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)*/:root{--blue:#007bff;--indigo:#6610f2;--purple:#6f42c1;--pink:#e83e8c;--red:#dc3545;--orange:#fd7e14;--yellow:#ffc107;--green:#28a745;--teal:#20c997;--cyan:#17a2b8;--white:#fff;--gray:#6c757d;--gray-dark:#343a40;--primary:#007bff;--secondary:#6c757d;--success:#28a745;--info:#17a2b8;--warning:#ffc107;--danger:#dc3545;--light:#f8f9fa;--dark:#343a40;--breakpoint-xs:0;--breakpoint-sm:576px;--breakpoint-md:768px;--breakpoint-lg:992px;--breakpoint-xl:1200px;--font-family-sans-serif:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";--font-family-monospace:SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace}*,::after,::before{box-sizing:border-box}html{font-family:sans-serif;line-height:1.15;-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:transparent}article,aside,figcaption,figure,footer,header,hgroup,main,nav,section{display:block}body{margin:0;font-family:-apple-system,BlinkMacSystemFont,segoe ui,Roboto,helvetica neue,Arial,noto sans,sans-serif,apple color emoji,segoe ui emoji,segoe ui symbol,noto color emoji;font-size:1rem;font-weight:400;line-height:1.5;color:#212529;text-align:left;background-color:#fff}[tabindex="-1"]:focus:not(:focus-visible){outline:0!important}hr{box-sizing:content-box;height:0;overflow:visible}h1,h2,h3,h4,h5,h6{margin-top:0;margin-bottom:.5rem}p{margin-top:0;margin-bottom:1rem}abbr[data-original-title],abbr[title]{text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted;cursor:help;border-bottom:0;-webkit-text-decoration-skip-ink:none;text-decoration-skip-ink:none}address{margin-bottom:1rem;font-style:normal;line-height:inherit}dl,ol,ul{margin-top:0;margin-bottom:1rem}ol ol,ol ul,ul ol,ul ul{margin-bottom:0}dt{font-weight:700}dd{margin-bottom:.5rem;margin-left:0}blockquote{margin:0 0 1rem}b,strong{font-weight:bolder}small{font-size:80%}sub,sup{position:relative;font-size:75%;line-height:0;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}a{color:#007bff;text-decoration:none;background-color:transparent}a:hover{color:#0056b3;text-decoration:underline}a:not([href]):not([class]){color:inherit;text-decoration:none}a:not([href]):not([class]):hover{color:inherit;text-decoration:none}code,kbd,pre,samp{font-family:SFMono-Regular,Menlo,Monaco,Consolas,liberation mono,courier new,monospace;font-size:1em}pre{margin-top:0;margin-bottom:1rem;overflow:auto;-ms-overflow-style:scrollbar}figure{margin:0 0 1rem}img{vertical-align:middle;border-style:none}svg{overflow:hidden;vertical-align:middle}table{border-collapse:collapse}caption{padding-top:.75rem;padding-bottom:.75rem;color:#6c757d;text-align:left;caption-side:bottom}th{text-align:inherit}label{display:inline-block;margin-bottom:.5rem}button{border-radius:0}button:focus{outline:1px dotted;outline:5px auto -webkit-focus-ring-color}button,input,optgroup,select,textarea{margin:0;font-family:inherit;font-size:inherit;line-height:inherit}button,input{overflow:visible}button,select{text-transform:none}[role=button]{cursor:pointer}select{word-wrap:normal}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button}[type=button]:not(:disabled),[type=reset]:not(:disabled),[type=submit]:not(:disabled),button:not(:disabled){cursor:pointer}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{padding:0;border-style:none}input[type=checkbox],input[type=radio]{box-sizing:border-box;padding:0}textarea{overflow:auto;resize:vertical}fieldset{min-width:0;padding:0;margin:0;border:0}legend{display:block;width:100%;max-width:100%;padding:0;margin-bottom:.5rem;font-size:1.5rem;line-height:inherit;color:inherit;white-space:normal}progress{vertical-align:baseline}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{outline-offset:-2px;-webkit-appearance:none}[type=search]::-w
<button aria-label="navbar toggler" class="navbar-toggler border-0" type=button data-toggle=collapse data-target=#navigation>
<span class=navbar-toggler-icon></span></button></div><form action=/reporter/search class="search order-lg-3 order-md-2 order-3 ml-auto"><input id=search-query name=s type=search placeholder=Search...></form><div class="collapse navbar-collapse text-center order-lg-2 order-4" id=navigation><ul class="navbar-nav mx-auto mt-3 mt-lg-0"><li class=nav-item><a class=nav-link href=/reporter/about/>About Me</a></li><li class="nav-item dropdown"><a class="nav-link dropdown-toggle" href=# role=button data-toggle=dropdown aria-haspopup=true aria-expanded=false>Articles</a><div class=dropdown-menu><a class=dropdown-item href=/reporter/articles/travel/>Travel</a>
<a class=dropdown-item href=/reporter/articles/lifestyle/>Lifestyle</a>
<a class=dropdown-item href=/reporter/articles/cruises/>Cruises</a></div></li><li class=nav-item><a class=nav-link href=/reporter/contact/>Contact</a></li></ul></div></nav></div></header><main><section class=section><div class=container><div class=row><div class="col-lg-8 mx-auto"><div class="breadcrumbs mb-4"><a href=/reporter>Home</a>
<span class=mx-1>/</span> <a href=https://demo.gethugothemes.com/reporter/elements>Elements</a></div></div><div class="col-lg-8 mx-auto mb-5 mb-lg-0"><h1 class=mb-4>Elements</h1><div class=content><h4 id=heading-example>Heading example</h4><p>Here is example of hedings. You can use this heading by following markdownify rules. For example: use <code>#</code> for heading 1 and use <code>######</code> for heading 6.</p><h1 id=heading-1>Heading 1</h1><h2 id=heading-2>Heading 2</h2><h3 id=heading-3>Heading 3</h3><h4 id=heading-4>Heading 4</h4><h5 id=heading-5>Heading 5</h5><h6 id=heading-6>Heading 6</h6><hr><h3 id=emphasis>Emphasis</h3><p>Emphasis, aka italics, with <em>asterisks</em> or <em>underscores</em>.</p><p>Strong emphasis, aka bold, with <strong>asterisks</strong> or <strong>underscores</strong>.</p><p>Combined emphasis with <strong>asterisks and <em>underscores</em></strong>.</p><p>Strikethrough uses two tildes. <del>Scratch this.</del></p><hr><h3 id=link>Link</h3><p><a href=https://www.google.com>I&rsquo;m an inline-style link</a></p><p><a href=https://www.google.com title="Google's Homepage">I&rsquo;m an inline-style link with title</a></p><p><a href=https://www.themefisher.com>I&rsquo;m a reference-style link</a></p><p><a href=../blob/master/LICENSE>I&rsquo;m a relative reference to a repository file</a></p><p><a href=https://gethugothemes.com>You can use numbers for reference-style link definitions</a></p><p>Or leave it empty and use the <a href=https://www.getjekyllthemes.com>link text itself</a>.</p><p>URLs and URLs in angle brackets will automatically get turned into links.
<a href=http://www.example.com>http://www.example.com</a> or <a href=http://www.example.com>http://www.example.com</a> and sometimes
example.com (but not on Github, for example).</p><p>Some text to show that the reference links can follow later.</p><hr><h3 id=paragraph>Paragraph</h3><p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Quam nihil enim maxime corporis cumque totam aliquid nam sint inventore optio modi neque laborum officiis necessitatibus, facilis placeat pariatur! Voluptatem, sed harum pariatur adipisci voluptates voluptatum cumque, porro sint minima similique magni perferendis fuga! Optio vel ipsum excepturi tempore reiciendis id quidem? Vel in, doloribus debitis nesciunt fugit sequi magnam accusantium modi neque quis, vitae velit, pariatur harum autem a! Velit impedit atque maiores animi possimus asperiores natus repellendus excepturi sint architecto eligendi non, omnis nihil. Facilis, doloremque illum. Fugit optio laborum minus debitis natus illo perspiciatis corporis voluptatum rerum laboriosam.</p><hr><h3 id=ordered-list>Ordered List</h3><ol><li>List item</li><li>List item</li><li>List item</li><li>List item</li><li>List item</li></ol><hr><h3 id=unordered-list>Unordered List</h3><ul><li>List item</li><li>List item</li><li>List item</li><li>List item</li><li>List item</li></ul><hr><h3 id=notice>Notice</h3><div class="notices note"><p>This is a simple note.</p></div><div class="notices tip"><p>This is a simple tip.</p></div><div class="notices info"><p>This is a simple info.</p></div><hr><h3 id=code-and-syntax-highlighting>Code and Syntax Highlighting</h3><p>Inline <code>code</code> has <code>back-ticks around</code> it.</p><div class=highlight><pre style=color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4><code class=language-javascript data-lang=javascript><span style=color:#66d9ef>var</span> <span style=color:#a6e22e>s</span> <span style=color:#f92672>=</span> <span style=color:#e6db74>&#34;JavaScript syntax highlighting&#34;</span>;
<span style=color:#a6e22e>alert</span>(<span style=color:#a6e22e>s</span>);
</code></pre></div><div class=highlight><pre style=color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4><code class=language-python data-lang=python>s <span style=color:#f92672>=</span> <span style=color:#e6db74>&#34;Python syntax highlighting&#34;</span>
print s
</code></pre></div><hr><h3 id=blockquote>Blockquote</h3><blockquote><p>This is a blockquote example.</p></blockquote><hr><h3 id=inline-html>Inline HTML</h3><p>You can also use raw HTML in your Markdown, and it&rsquo;ll mostly work pretty well.</p><dl><dt>Definition list</dt><dd>Is something people use sometimes.</dd><dt>Markdown in HTML</dt><dd>Does *not* work **very** well. Use HTML <em>tags</em>.</dd></dl><hr><h3 id=tables>Tables</h3><p>Colons can be used to align columns.</p><table><thead><tr><th>Tables</th><th style=text-align:center>Are</th><th style=text-align:right>Cool</th></tr></thead><tbody><tr><td>col 3 is</td><td style=text-align:center>right-aligned</td><td style=text-align:right>$1600</td></tr><tr><td>col 2 is</td><td style=text-align:center>centered</td><td style=text-align:right>$12</td></tr><tr><td>zebra stripes</td><td style=text-align:center>are neat</td><td style=text-align:right>$1</td></tr></tbody></table><p>There must be at least 3 dashes separating each header cell.
The outer pipes (|) are optional, and you don&rsquo;t need to make the
raw Markdown line up prettily. You can also use inline Markdown.</p><table><thead><tr><th>Markdown</th><th>Less</th><th>Pretty</th></tr></thead><tbody><tr><td><em>Still</em></td><td><code>renders</code></td><td><strong>nicely</strong></td></tr><tr><td>1</td><td>2</td><td>3</td></tr></tbody></table><hr><h3 id=image>Image</h3><img loading=lazy decoding=async class="w-100 d-block mb-4" src=/reporter/images/post/post-1_hua1e5b559361bd6e94ca3533b740cc879_111792_750x0_resize_q100_h2_box.webp alt="THIS IS AN IMAGE"><hr><h3 id=youtube-video>Youtube video</h3><div style=position:relative;padding-bottom:56.25%;height:0;overflow:hidden><iframe src=https://www.youtube.com/embed/C0DPdy98e4c style=position:absolute;top:0;left:0;width:100%;height:100%;border:0 allowfullscreen title="YouTube Video"></iframe></div></div></div></div></div></section></main><footer class="bg-dark mt-5"><div class="container section"><div class=row><div class="col-lg-10 mx-auto text-center"><a class="d-inline-block mb-4 pb-2" href=/reporter><img loading=prelaod decoding=async class=img-fluid width=150 height=34 src=/reporter/images/logo-white_hu39064d157e5a173b39ac2983945767c3_4993_2448d0c291d9338ff7c3b386153869f4.webp alt="Reporter Hugo" onerror="this.onerror=null,this.src='/reporter/images/logo-white_hu39064d157e5a173b39ac2983945767c3_4993_150x0_resize_box_2.png'"></a><ul class="p-0 d-flex navbar-footer mb-0 list-unstyled"><li class="nav-item my-0"><a class=nav-link href=https://demo.gethugothemes.com/reporter/about>About</a></li><li class="nav-item my-0"><a class=nav-link href=https://demo.gethugothemes.com/reporter/sitemap.xml>Sitemap</a></li><li class="nav-item my-0"><a class=nav-link href=https://demo.gethugothemes.com/reporter/elements>Elements</a></li><li class="nav-item my-0"><a class=nav-link href=https://demo.gethugothemes.com/reporter/privacy-policy>Privacy Policy</a></li><li class="nav-item my-0"><a class=nav-link href=https://demo.gethugothemes.com/reporter/terms-conditions>Terms Conditions</a></li></ul></div></div></div><div class="copyright bg-dark content">Designed By <a href=https://themefisher.com/>Themefisher</a> & Developed By <a href=https://gethugothemes.com/>Gethugothemes</a></div></footer><script src=https://cdn.jsdelivr.net/gh/theprojectsomething/webfontloader@feature/google-fonts-v2/webfontloader.js></script><script type=application/javascript>WebFont.load({google:{api:'https://fonts.googleapis.com/css2',families:['Work Sans:wght@400;500;600;700','Neuton:wght@700&display=swap'],version:2},active:()=>{sessionStorage.fontsLoaded=!0}})</script><script crossorigin=anonymous defer data-turbolinks-suppress-warning integrity="sha512-OVYHCzIAga7y8hx/MArY/TdXeDHawiJWGivnE5HexHxWzDrslpUKTNAIF3b/jlhLb4UOZn4VHStmGInVCg6IsA==" type=application/javascript>/*! jQuery v3.5.1 | (c) JS Foundation and other contributors | jquery.org/license */var fuseOptions,searchQuery;!function(a,b){"use strict";"object"==typeof module&&"object"==typeof module.exports?module.exports=a.document?b(a,!0):function(a){if(!a.document)throw new Error("jQuery requires a window with a document");return b(a)}:b(a)}("undefined"!=typeof window?window:this,function(d,bW){"use strict";var q=[],bC=Object.getPrototypeOf,r=q.slice,bD=q.flat?function(a){return q.flat.call(a)}:function(a){return q.concat.apply([],a)},aG=q.push,X=q.indexOf,$={},bO=$.toString,_=$.hasOwnProperty,bs=_.toString,bZ=bs.call(Object),f={},c=function(a){return"function"==typeof a&&"number"!=typeof a.nodeType},D=function(a){return null!=a&&a===a.window},e=d.document,bT={type:!0,src:!0,nonce:!0,noModule:!0},aB,a,s,x,aA,az,ax,bN,bL,bJ,bH,k,bG,U,n,bF,bA,C,b,g,bz,bx,ak,B,o,t,u,bw,P,ai,v,ac,G,ah,ag,i,bu,bt,bQ,aL,bp,bo,aT,Z,Q,aj,bm,al,am,an,bk,ap,bj,ar,E,V,A,bh,bg,bf,be,K,a$,a_,aY,aE,aF,L,aH,aa,aW,aK,aV,aU,aN,aO,aP,aQ,aR,aS,aM,ad,ao,ab,aX,H,aZ,aC,W,ba,bb,bc;function bd(g,a,d){var b,f,c=(d=d||e).createElement("script");if(c.text=g,a)for(b in bT)(f=a[b]||a.getAttribute&&a.getAttribute(b))&&c.setAttribute(b,f);d.head.appendChild(c).parentNode.removeChild(c)}function N(a){return null==a?a+"":"object"==typeof a||"functio