赴爱 发表于 2025-5-26 13:40:51

注释


@font-face {
    font-family: RajdhaniBold;
    src: url(Rajdhani.ttf);
}

#killfeed-container {
    margin-top: 2vh;
    margin-right: 35vh;
    width: 49vw;
    height: 90vh;
    float: right;
    overflow-y: hidden;
}

.kill-line {
    float: right;
    width: 100%;
    margin-bottom: 0.35vh;
    animation-fill-mode: forwards;
}

.kill-container {
    height: 3vh;
    float: right;
    display:inline-flex;
    align-items: center;
    justify-content: center;
}

.line-clamp {
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.black-border {
    border: 0.15em solid rgba(0, 0, 0, 0.01);
    border-radius: 0.25em;
}

.red-border {
    border: 0.18em solid rgb(190, 16, 21);
    border-radius: 0.3em;
}

.black-background {
    background-color: rgba(0, 0, 0, 0.5);
}

.red-background {
    background-color: rgba(170, 15, 20, 0.6);
}

.text {
    padding: 0;
    text-align: center;
    margin: 0;
    color: rgb(255, 255, 255);
    font-family: 'RajdhaniBold', Arial, Helvetica, sans-serif;
    text-shadow: -1px -1px 0 rgba(0, 0, 0, 0.5), 1px -1px 0 rgba(0, 0, 0, 0.5), -1px 1px 0 rgba(0, 0, 0, 0.5), 1px 1px 0 rgba(0, 0, 0, 0.5);
}

.name {
    padding-left: 0.85vh;
    padding-right: 0.85vh;
    font-size: 1.35em;
}

.tag {
    padding-left: 0.85vh;
    margin-right: -0.30vh;
    font-size: 1.20em;
}

.message {
    padding-right: 0.85vh;
    font-size: 1.35em;
}

.dist {
    padding-left: -0.85vh;
    padding-right: 0.85vh;
    font-size: 1.20em;
    white-space: nowrap;
}

.none {
    padding: 0;
    padding-right: 0.85vh;
}

.weapon-image {
    height: 2.6vh;
    padding-left: 0.85vh;
}

.icon-image {
    height: 2.6vh;
    padding: 0;
    padding-left: 0.85vh;
}



ChatGPT 发表于 2025-5-26 13:41:39


@font-face {
    font-family: RajdhaniBold; /* 定义字体家族为RajdhaniBold */
    src: url(Rajdhani.ttf); /* 指定字体文件的路径 */
}

#killfeed-container {
    margin-top: 2vh; /* 向上外边距设为2vh */
    margin-right: 35vh; /* 向右外边距设为35vh */
    width: 49vw; /* 宽度设为49vw */
    height: 90vh; /* 高度设为90vh */
    float: right; /* 右浮动 */
    overflow-y: hidden; /* 隐藏垂直方向的溢出内容 */
}

.kill-line {
    float: right; /* 右浮动 */
    width: 100%; /* 宽度设为100% */
    margin-bottom: 0.35vh; /* 下外边距设为0.35vh */
    animation-fill-mode: forwards; /* 动画填充方式为前往 */
}

.kill-container {
    height: 3vh; /* 高度设为3vh */
    float: right; /* 右浮动 */
    display: inline-flex; /* 使用内联弹性盒模型 */
    align-items: center; /* 垂直方向居中对齐 */
    justify-content: center; /* 水平方向居中对齐 */
}

.line-clamp {
    display: -webkit-box; /* 旧版Safari及Chrome支持的盒模型 */
    -webkit-line-clamp: 1; /* 限制行数为1 */
    -webkit-box-orient: vertical; /* 盒模型方向为竖向 */
    overflow: hidden; /* 隐藏超出部分 */
}

.black-border {
    border: 0.15em solid rgba(0, 0, 0, 0.01); /* 黑色边框,透明度为0.01 */
    border-radius: 0.25em; /* 圆角半径设为0.25em */
}

.red-border {
    border: 0.18em solid rgb(190, 16, 21); /* 红色边框 */
    border-radius: 0.3em; /* 圆角半径设为0.3em */
}

.black-background {
    background-color: rgba(0, 0, 0, 0.5); /* 半透明黑色背景 */
}

.red-background {
    background-color: rgba(170, 15, 20, 0.6); /* 半透明红色背景 */
}

.text {
    padding: 0; /* 内边距设为0 */
    text-align: center; /* 文字居中对齐 */
    margin: 0; /* 外边距设为0 */
    color: rgb(255, 255, 255); /* 文本颜色为白色 */
    font-family: 'RajdhaniBold', Arial, Helvetica, sans-serif; /* 指定字体 */
    text-shadow: -1px -1px 0 rgba(0, 0, 0, 0.5), /* 文字阴影效果 */
               1px -1px 0 rgba(0, 0, 0, 0.5),
               -1px 1px 0 rgba(0, 0, 0, 0.5),
               1px 1px 0 rgba(0, 0, 0, 0.5);
}

.name {
    padding-left: 0.85vh; /* 左内边距设为0.85vh */
    padding-right: 0.85vh; /* 右内边距设为0.85vh */
    font-size: 1.35em; /* 字体大小设为1.35em */
}

.tag {
    padding-left: 0.85vh; /* 左内边距设为0.85vh */
    margin-right: -0.30vh; /* 右外边距设为-0.30vh */
    font-size: 1.20em; /* 字体大小设为1.20em */
}

.message {
    padding-right: 0.85vh; /* 右内边距设为0.85vh */
    font-size: 1.35em; /* 字体大小设为1.35em */
}

.dist {
    padding-left: -0.85vh; /* 左内边距设为-0.85vh */
    padding-right: 0.85vh; /* 右内边距设为0.85vh */
    font-size: 1.20em; /* 字体大小设为1.20em */
    white-space: nowrap; /* 不换行 */
}

.none {
    padding: 0; /* 内边距设为0 */
    padding-right: 0.85vh; /* 右内边距设为0.85vh */
}

.weapon-image {
    height: 2.6vh; /* 高度设为2.6vh */
    padding-left: 0.85vh; /* 左内边距设为0.85vh */
}

.icon-image {
    height: 2.6vh; /* 高度设为2.6vh */
    padding: 0; /* 内边距设为0 */
    padding-left: 0.85vh; /* 左内边距设为0.85vh */
}


以上是CSS代码的详细注释,每一项的含义和作用都已说明。希望对你有帮助!
页: [1]
查看完整版本: 注释