• CSSで以下のように見出しのデザインを編集しました。

    記述している場所は、「外観」の「テーマファイルエディタ」の「SWELL CHILD: Stylesheet (style.css)」です。

    /* h3 見出し */
    .post_content h3 {
      padding: 0.6em 0.5em;/*文字の上下 左右の余白*/
      color: #010101;/*文字色*/
      background: #f4f4f4;/*背景色*/
      border-left: solid 5px #1c3982;/*左線*/
    	border-bottom: solid 3px #d7d7d7;/*下線*/
    }
    
    /* h4 見出し */
    .post_content h4 {
      border-bottom: solid 3px #c6dff4;
      position: relative;
    }
    
    .post_content h4:after {
      position: absolute;
      content: " ";
      display: block;
      border-bottom: solid 3px #1d4189;
      bottom: -3px;
      width: 30%;
    }
    
    /* h5 見出し */
    .post_content h5 {
      padding: 0.25em 0.5em;/*上下 左右の余白*/
      color: #494949;/*文字色*/
      background: transparent;/*背景透明に*/
      border-left: solid 5px #7db4e6;/*左線*/
    }
    
    /* h6 見出し */
    .post_content h6 {
      color: #505050;/*文字色*/
      padding: 0.5em;/*文字周りの余白*/
      display: inline-block;/*おまじない*/
      line-height: 1.3;/*行高*/
      background: #dbebf8;/*背景色*/
      vertical-align: middle;
      border-radius: 25px 0px 0px 25px;/*左側の角を丸く*/
    }
    
    .post_content h6:before {
      content: '●';
      color: white;
      margin-right: 8px;
    }
    /* ここまで */

    ちなみに、swellではh3以降の見出しのデザインはオフにしています。

    このようにカスタマイズしているときに、swellの編集画面で記事を書こうとすると、h3見出し以降が表示されません。

    記事を編集しているときに、編集画面でもCSSが適用されないと、一目でどれが見出しなのか分かりにくく、効率的に記事を執筆できません。

    インターネットで検索して色々試しましたが、どうしてもh3以降のCSSが反映されません。

    編集画面でもCSSを反映させる方法を教えていただけたら幸いです。

1件の返信を表示中 - 1 - 1件目 (全1件中)
1件の返信を表示中 - 1 - 1件目 (全1件中)
  • トピック「編集画面でh3以降のCSSデザインが表示されない」には新たに返信することはできません。