¡Olé! Make

全体的に備忘録。

テストページ作成 - 備忘録作成の為の前準備

備忘録を書くにあたり、ひとまず必要そうな記法を確認する。
Markdown編集を使用。CSSは以下。

/* base */

.table-of-contents {
}
.table-of-contents::before {
  content: "目次";
  font-weight: bold;
}
h3 {
  background-color: #171717;
  color: #ffffff;
  border-left: #06c270 0.4em solid;
  padding: 0.4em;
}
h4 {
  border-left: #06c270 0.2em solid;
  border-bottom: #6f6f6f 1px dotted;
  padding: 0.2em 0.4em;
}
h5 {
  border-bottom: #6f6f6f 1px dotted;
  padding: 0 0.4em;
}
h5::before {
  content: "■";
  color: #06c270;
  padding-right: 0.4em;
}
.red {
  color: #d91f11;
}
.emphasis {
  font-size: 1.5em;
  font-weight: bold;
}

/* code */

.code-line {
  counter-increment: linenumber;
}
.code-line::before {
  content: counter(linenumber);
  display: inline-block;
  color: #858585;
  text-align: right;
  width: 3.5em;
  padding: 0 1.5em 0 0;
}
pre.code {
  background-color: #1e1e1e;
  color: #d4d4d4;
  padding: 2em 1em 1em 1em;
  overflow-x: auto;
  white-space: pre;
}
pre.code::before {
  content: attr(data-lang);
  display: inline-block;
  background: #06c270;
  color: #ffffff;
  padding: 0 0.5em;
  position: absolute;
  margin-left: -1em; 
  margin-top: -2em;
}

.lang-c .synComment { color: #ffcc00; }
.lang-c .synConstant { color: #ce9178; }
.lang-c .synIdentifier { color: #dcdcaa; }
.lang-c .synPreProc { color: #9b9b9b; }
.lang-c .synSpecial { color: #d4d4d4; }
.lang-c .synStatement { color: #c586c0; }
.lang-c .synType { color: #569cd6 }

.lang-css .synComment { color:#ffcc00; }
.lang-css .synConstant { color: #05c270; }
.lang-css .synIdentifier { color: #d4d4d4; }
.lang-css .synPreProc { color: #d4d4d4; }
.lang-css .synSpecial { color:#ff0000; }/*?*/
.lang-css .synStatement { color: #d4d4d4; }
.lang-css .synType { color: #5b8dee; }

.lang-lua .synComment { color:#ffcc00; }
.lang-lua .synConstant { color: #b5cea8; }
.lang-lua .synIdentifier { color: #dcdcaa; }
.lang-lua .synPreProc { color: #ff0000; }/*?*/
.lang-lua .synSpecial { color: #ff0000; }/*?*/
.lang-lua .synStatement { color: #c586c0; }
.lang-lua .synType { color: #ff0000; }/*?*/

h3 - 通常文

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

長椅子は町のぼんやり眼団をかっこうを出し外ならまし。ところがどうそれどころですたというバケツたまし。生意気たたのならはなところが皿の上手曲の所をはにわかにだめたらして、いつまで首を教えられんたまし。

入っすぎいつも子が赤くだてさっきのさきのいちど汁へいろ第二血汁のおじぎから飛びたちときたた。楽長は半分ぶっつけながら出しじ。からだは二すましおいでのように弾きていた。

手はむし手たり私をつかまえとやった。ぶんは床下へどっかりにして赤にセロのようのなれがヴァイオリンをくわえてとうとうゴーシュにしててどし。

h4 - 各種記法

 \displaystyle
\frac{\pi}{4}=\sum_{n=0}^{\infty} \frac{(-1)^{n}}{2 n+1}=1-\frac{1}{3}+\frac{1}{5}-\frac{1}{7}+\frac{1}{9} - \cdots

 \displaystyle
F = ma

#include <stdio.h>

int main (void) {
  printf("Hallo World!");
}
sll.preprocessing.drawMaterial = function(x, y, a)
  if a == nil then
    obj.drawpoly(x - obj.w / 2, y - obj.h / 2, 0, x + obj.w / 2, y - obj.h / 2, 0,
                 x + obj.w / 2, y + obj.h / 2, 0, x - obj.w / 2, y + obj.h / 2, 0)
  else
    obj.drawpoly(x - obj.w / 2, y - obj.h / 2, 0, x + obj.w / 2, y - obj.h / 2, 0,
                 x + obj.w / 2, y + obj.h / 2, 0, x - obj.w / 2, y + obj.h / 2, 0,
                 0, 0, obj.w, 0, obj.w, obj.h, 0, obj.h, a)
  end
end

引用
何かに使うかもしれない。

インラインコード<div>

h5 - 参考

juu7g.hatenablog.com

mikan-alpha.hatenablog.com

ari23.hatenablog.com

hero-rin.hatenablog.com

help.hatenablog.com

www.haurin-zatunenlife.com

u-ff.com

www.okb-shelf.work

fclout.hateblo.jp