タグ

ブックマーク / arts-factory.net (3)

  • 【css】要素をposition:absoluteで中央に配置する最新の方法(上下左右、上下、左右)

    positionを使って要素を配置する際、その要素を中央に配置したいといったことはよくあると思います。その場合どうすしたらいいのか悩まれた経験はありませんか? 今回は、positionで、要素の幅が確定していなくても上下中央、左右中央、上下左右中央に配置できるcssの設定方法をご紹介します。 positionとtranslateを使って要素を中央に配置する方法 具体例と解説 それでは、具体例を示しながら実際の設置方法を解説していきたいと思います。 例は、画像の上にテキストを配置するケースで、テキストの配置位置は、上下左右中央になるようにする場合です。 完成イメージは下記図になります。(わかりづらいかもしれませんが、水色部分が画像[img]だと仮定してください) 図 それでは、具体的にソースを示してから解説していきたいと思います。 まずは、htmlcssをご確認ください。 html

    【css】要素をposition:absoluteで中央に配置する最新の方法(上下左右、上下、左右)
    ar0
    ar0 2023/06/27
  • ページ読み込み時にjavascript(jQuery)を実行する方法

    ページが読み込まれたときにjavascript(jQuery)の処理を実行させたい、といったことはよくあると思います。 今回は、ページにアクセスされ読み込まれた時にjavascript(jQuery)を実行する方法につい […]

    ページ読み込み時にjavascript(jQuery)を実行する方法
    ar0
    ar0 2022/12/12
  • 【css】蛍光ペンで引いたようなラインマーカーをテキスト上に設置する方法

    文中の文字を強調したいときどういった手法を使いますか? 「文字を太文字に変える」 「文字の色を変える」 「アンダーラインを加える」 これだけでは、少しバリエーションが少ないようにおもいませんか? そこで、今回は、cssで蛍光ペンのラインマーカーをテキストに配置する方法をご紹介します。 蛍光ペンといえば、誰しも教科書の重要な部分にマーカーを引いた思い出があるはずです。そんな、親しみやすく馴染みのある手法を使わない手はないですよね? それでは、早速設置方法を見てみましょう!

    【css】蛍光ペンで引いたようなラインマーカーをテキスト上に設置する方法
    ar0
    ar0 2021/08/30
  • 1