# 圣诞帽子！

**URL:** <https://meta.discourse.org/t/christmas-hats/51846>\
**Category:** General\
**Created:** [2016年十月21日 10:05 UTC](https://meta.discourse.org/t/christmas-hats/51846 "2016-10-21T10:05:21Z")\
**Posts on this page:** 1\
**Page:** 2

<div class="post-metadata">

**Author:** ![Kartoon](https://avatars.discourse-cdn.com/v4/letter/k/e36b37/32.png) [@Kartoon](https://meta.discourse.org/u/Kartoon)\
**Post date:** [2024年十一月30日 07:17 UTC](https://meta.discourse.org/t/christmas-hats/51846/23 "2024-11-30T07:17:20Z")

</div>

> [@cpradio](#):
>
> 给你（感谢 sama74 从 SP 帮助完成此操作）
> 
> 1. 将 [此图片](https://sandbox.cpradio.org/uploads/default/optimized/1X/bc7a8948b080c0ccb41a2aa8d20915e0aba5c8d2_1_446x500.png) 上传到你的 Staff \> Assets 主题
> 2. 转到 Admin \> Customize \> CSS
> 
> ```plaintext
> #current-user div {
> position: relative;
> }
> #current-user div::after {
> position: absolute;
> content: '';
> display: block;
> top:-16px;
> left: -8px;
> width: 45px;
> height: 45px;
> /* UPDATE THE URL BELOW */
> background: url(url_of_christmas_hat_asset) no-repeat center;
> background-size: contain;
> }
> 
> ```
> 
> 最后但同样重要的是，确保自定义设置已保存并启用。

如果有人搜索并找到此主题，上面的代码不再有效，但我做了一个更新的版本。

```plaintext
.current-user {
  position: relative;
}
.current-user::after {
  position: absolute;
  content: '';
  display: block;
  top:-16px;
  left: -8px;
  width: 45px;
  height: 45px;
  /* UPDATE THE URL BELOW */
  background: url(URL HERE) no-repeat center;
  background-size: contain;
  pointer-events: none;
}

```

“pointer-events”行也很重要，因为如果没有它，你就无法再点击你的个人资料图片来打开菜单，因为帽子叠加层会挡住它（你可以点击右上角和最底部，但这很麻烦，而且不明显）。

@Robert 发布的另一个代码（第二个）用于在主题内的个人资料上添加帽子仍然有效，但它存在同样的问题（尽管不那么重要，因为这次你仍然可以直接点击图片旁边的用户名），但如果你也想修复它，你也可以添加 `pointer-events: none;`

[上一頁](https://meta.discourse.org/t/christmas-hats/51846.md?page=1)