Maison >interface Web >tutoriel HTML >Comment obtenir un effet exposant en HTML

Comment obtenir un effet exposant en HTML

王林avant: 2020-10-22 18:43:384414parcourir

Jetons d'abord un coup d'œil à l'effet :

(tutoriel recommandé : tutoriel vidéo html)

Code d'implémentation :

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>制作角标的方法</title>
    <script src="http://cdn.static.runoob.com/libs/jquery/1.10.2/jquery.min.js"></script>
    <style>
          .con{
            height: 250px;
            width: 200px;
            margin: 0 auto;
            overflow: hidden;
            margin-top: 100px;
            position: relative;
            background-color: #4cd964;
          }
      .subscript{
        color: #fff;
        height: 30px;
        width: 100px;
        position: absolute;
        right: -30px;
        text-align: center;
        line-height: 30px;
        font-family: "黑体";
        background-color: #0c60ee;
        -moz-transform:rotate(45deg);
        -webkit-transform:rotate(45deg);
        -o-transform:rotate(45deg);
        -ms-transform:rotate(45deg);
        transform:rotate(45deg);
      }
    </style>
</head>
<body>
<div>
    <div>
      角标
    </div>
</div>
</body>
</html>

Recommandations associées : Tutoriel HTML

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

html

Déclaration：

Cet article est reproduit dans:. en cas de violation, veuillez contacter admin@php.cn Supprimer

Article précédent：Présenter ce qu'est une requête médiaArticle suivant：Présenter ce qu'est une requête média

Articles Liés

Voir plus