css 3の未読メッセージの赤い点



<html lang="zh-CN">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <style>
        .red-point{
          position: relative;
        }

        .red-point::before{
          content: " ";
          border: 3px solid red;/* */
          border-radius:3px;/* */
          position: absolute;
          z-index: 1000;
          right: 0%;
          margin-right: -5px;
          margin-top: -5px;
        }
    style>
head>
<body>
  <span class="red-point">hello worldspan>
body>
html>