css中怎么画感叹号

admin 轻心小站 关注 LV.19 运营
发表于前端技术学习版块 css,教程

在CSS中,我们可以通过以下步骤来绘制感叹号:/* * 创建一个div元素并设置宽度和高度 */ div { width: 30px; height: 50px; } /* * 使用border-ra

在CSS中,我们可以通过以下步骤来绘制感叹号:

/*
 * 创建一个div元素并设置宽度和高度
 */
div {
  width: 30px; 
  height: 50px; 
}

/*
 * 使用border-radius设置元素的右上和右下角,形成一个倾斜的方块
 */
div:before {
  content: ""; 
  display: block; 
  height: 10px; 
  width: 10px; 
  border-radius: 2px; 
  background-color: #000; 
  transform: rotate(45deg); 
  position: absolute; 
  top: -8px; 
  right: 12px; 
}

/*
 * 在div里面添加“!”
 */
div:after {
  content: "!"; 
  display: block; 
  font-size: 30px; 
  font-weight: bold; 
  position: absolute; 
  top: 7px; 
  left: 9px; 
} 

通过以上代码,我们可以创建出一个类似于感叹号的形状,并在其中添加“!”,从而绘制出一个完整的感叹号。

文章说明:

本文原创发布于探乎站长论坛,未经许可,禁止转载。

题图来自Unsplash,基于CC0协议

该文观点仅代表作者本人,探乎站长论坛平台仅提供信息存储空间服务。

评论列表 评论
发布评论

评论: css中怎么画感叹号

粉丝

0

关注

0

收藏

0

已有0次打赏