2019年2月

  • 2019.02.11

スタイルシートからブロックの順序を入れ替える

cssは編集可能で、htmlソースに手を加えたくない、もしくは手を加えられないような場合って以外とあると思います。 そのような場合にhtmlソースをそのままで、スタイルシートに手を加えることで、ブロックの順序(表示位置)を変えることが可能です。 PCは左右に振り分けて表示で、スマホは全幅にしてPCと並び順を変えるなんてことが可能です。 こんな感じですね。 これで、PCのときはblock1、bloc […]

  • 2019.02.06

特定のclassセレクタを持つ要素の親要素にスタイルを適用する

言ってること伝わります?(笑) WordPressだと、function.php にごにょごにょすると、bodyタグのクラスセレクタにページスラッグを追加できたりするので、コンテンツ部分を作ってしまってからでも、各ページの特定の部分だけに要素を適用することも可能だったりします。 ところが、基本的にコンテンツ部分のソースには手を加えられない(もしくはページ数が多すぎで手を加えたくない)ようなサイトリ […]

  • 2019.02.02

before擬似要素で指定した背景画像の位置決め – 行頭マークなどの配置

こんな具合にメニュー項目の左側にアイコンをつけたい。なんて場合が多々ありますが、あとあとのメンテナンスのしやすさや、工数を削減するために、既存サイトのコンテンツを活用しながらデザインリニューアルするために、HTMLに image タグで配置するのではなく、スタイルシートに before 擬似要素として設定することが多いのです。 多いのですが、ちょうどよい位置決めの方法をいつも忘れます(笑) 覚えよ […]

↑上へまいりま〜す