/* 列表项基础样式（保证布局） */
.article-item {
  list-style: none;
  margin: 8px 0;
  /* 可选：调整列表项间距 */
  padding: 0;
  /* 限定列表项宽度（根据你的布局调整，比如侧边栏宽度） */
  width: 280px;
  /* 示例宽度，可改为100%适配父容器 */
}

/* 标题过长隐藏核心样式 */
.article-title {
  /* 核心三要素：超出隐藏+不换行+省略号 */
  white-space: nowrap;
  /* 强制标题不换行 */
  overflow: hidden;
  /* 超出部分隐藏 */
  text-overflow: ellipsis;
  /* 超出部分显示省略号 */

  /* 基础样式（保留原有视觉效果） */
  color: #333;
  /* 标题颜色，可自定义 */
  text-decoration: none;
  /* 去掉下划线 */
  font-size: 16px;
  /* 字号，适配你的布局 */
  display: block;
  /* 关键：让a标签继承父容器宽度，省略号生效 */
  padding: 2px 0;
  /* 可选：调整标题上下间距 */
}

/* hover效果（可选，提升交互） */
.article-title:hover {
  color: #0066cc;
  /* hover时变色，可自定义 */
  text-decoration: underline;
  /* 可选：hover显示下划线 */
}
.single-article-item {
    /* 限定列表项宽度（根据你的布局调整，比如侧边栏宽度） */
    width: 280px; /* 示例宽度，可改为100%适配父容器 */
    list-style: none; /* 可选：去掉默认列表圆点 */
    margin: 10px 0; /* 可选：调整上下间距 */
    padding: 0;
}

.single-article-item a {
    /* 核心：强制单行 + 超出隐藏 + 省略号 */
    white-space: nowrap;    /* 强制标题只显示一行，不换行 */
    overflow: hidden;       /* 超出宽度的部分隐藏 */
    text-overflow: ellipsis;/* 超出部分显示省略号... */
    
    /* 基础样式（保留原有视觉效果，可自定义） */
    display: block;         /* 关键：让链接继承父容器宽度，省略号生效 */
    color: #333;            /* 标题默认颜色 */
    text-decoration: none;  /* 去掉下划线 */
    font-size: 16px;        /* 字号，适配你的布局 */
    line-height: 1.5;       /* 行高，保证垂直居中 */
}

/* 可选：hover交互效果 */
.single-article-item a:hover {
    color: #0066cc; /* hover时变色，可替换为你的主色调 */
    text-decoration: underline; /* 可选：hover显示下划线 */
}