您的当前位置:首页>新品 > 正文

css编写红色星号 垂直居中显示更美观

来源:CSDN 时间:2023-01-29 14:04:40


【资料图】

在编写一些表单时,我们使用红色*号,作为必填项,我们一般都想要红色星号能够垂直居中显示,看起来更美观:

.xing {            font-size: 30px;            color: #f00;        }如果是*则必填

结果如下:

所以我们需要添加css样式:

.xing {    width: 20px;    height: 20px;    display: inline-block;    vertical-align: middle;    text-align: center;    line-height: 26px;    font-size: 30px;    color: #f00;}

原因: 通过display:inline-block;将span变成内联块元素,在给它高度和宽度,使用vertical-align: middle;让它垂直居中,但这样还不行,还需要通过line-height来上下微调;

标签:

最新新闻:

新闻放送
Top