SWELLのトップページのメインビジュアルの見出しの文字の大きさがデフォルトだとちょっと小さいから大きくしたいのでCSSでカスタマイズしてみました！
備忘録の意味もこめてこちら作業方法をブログにて紹介します♪
目次
SWELLトップページのメインビジュアルのメインテキストフォントサイズを変更する方法-CSSでカスタマイズ-
/*★トップページのメインビジュアルメインテキストの見出しのサイズを変更★*/
/*メインテキストのフォントサイズ*/
.p-mainVisual__slideTitle{
font-size:50px;
}
/*サブテキストのフォントサイズ*/
.p-mainVisual__slideText{
font-size:20px;
}
/*ボタンテキストのフォントサイズ*/
.c-mvBtn__btn{
font-size:15px;
}
/*スマホの場合*/
/*メインテキストのフォントサイズ*/
@media (max-width: 480px){
.p-mainVisual__slideTitle{
font-size:35px;
}
/*サブテキストのフォントサイズ*/
.p-mainVisual__slideText{
font-size:15px;
}
}トップページのメインビジュアルのメインテキストの文字間隔も調整
使用するフォントや文字によってはメインビジュアルのトップページの見出しのところだけ文字間隔を開けたい場合もあるかと思います。
その場合に使うのがこちらのCSS
.p-mainVisual__slideTitle {
letter-spacing: 0.1em;
}SWELLのデフォルトの状態だとちょっと文字が小さいなーって思うと思うので是非こちらのCSS試してみてくださいね♪
SWELLのテンプレ―トのCSSカスタマイズの依頼も受け付けております^^
