---
title: view-del-ins
tags: view-css
---

# view-custom-del-ins

{%hackmd @hackmd-style/custom-del-ins %}

## 效果如下

<del>
　“I apologize for the delay.”
</del>
<ins cite="../howtobeawizard.html" datetime="2018-05">
<p>“A wizard is never late …”</p>
</ins>

---

## 套用 css 的方法

**method01:**

撰寫另一個 hackmd 文件，然後引入進來。

{%hackmd @hackmd-style/custom-del-ins %}

--

**method02:**

把 css 夾在 style 的html標籤裡面。

<style>

del, ins {
    display: block;
    text-decoration: none;
    position: relative;
}

del {
    background-color: #fbb;
}

ins {
    background-color: #d4fcbc;
}

del::before, ins::before {
    position: absolute;
    left: .5rem;
    font-family: monospace;
}

del::before {
    content: '−';
}

ins::before {
    content: '+';
}

p {
    margin: 0 1.8rem 0;
    font-family: Georgia, serif;
    font-size: 1rem;
}

</style>

---

## END