※当サイトは、Google Adsense、Amazonアソシエイト、各種アフィリエイト広告を利用しています。


CSS

Thumbnail of post image 000

Contact Form 7を使っていると
色々と細かい調整が必要になるときがあります。

使用しているWordpressのテーマによって
レイアウトが崩れる場合もありますので。

今回は送信ボタン ...

Thumbnail of post image 016

CSS

例えば、対象のHTMLコードが修正できなく、classやidが無いなどで何番目かの要素に対してCSSを指定したい場合以下の通り指定いただくと解決します。 最初の要素 :first-child :first-of-type 最後の要素 :la ...

Thumbnail of post image 014

CSS

CSSのプロパティである「clear」とは、要素をその前にある浮動要素の下に移動する必要があるかどうかを設定することが出来ます。ちなみにclearは、浮動要素も非浮動要素もどちらも対応出来ます。 clear: none; clear: le ...

Thumbnail of post image 014

CSS

例えばdivなどでレイアウトを行う際に、縦並びにしたい場合があります。 そんなときは、以下コードにて、flexboxで縦並びにするとよいです。 お試しください。 使い方は、親要素に以下CSSを追加することでその内部が縦並びになります。 .w ...

Thumbnail of post image 085

CSS

サイト制作していると、時々デザインの関係で、リンクの下線を消したいときがあります。 その下線を消すにはどうしたら良いか? あまりCSSに詳しくない方は、border-bottomなどで指定してうまくいかないなんてこともあるかもしれません。 ...

Thumbnail of post image 048

2022年3月25日CSS

ホームページ制作で 電話番号とか住所の番地にリンクを貼り付けていないのに スマホで確認すると電話のリンクが付いてる場合があります。   そのリンクを解除する場合は 以下、CSSを追加し リンクが付いてるところにClassで 指定し ...

Thumbnail of post image 005

CSS

CSSにて、文字の太さを指定する方法は以下の通り   .example { font-weight: bold; }   font-weightの指定は normal:標準 (初期値) bold: 太字 で指示することで ...

Thumbnail of post image 153

CSS

CSSで大活躍するborderについて 例えば、border-bottomで下線を引いたとしよう ホントは文字だけに下線を引きたいのだが 色んな条件によって文字だけを指定できず 文字エリア全体を指定せざるおえない場合 そのままだと画面いっぱ ...

Thumbnail of post image 183

CSS

ワードプレスなどサイト制作しているときに 結構ハマりがちな問題でCSSが全然効かないことがある。 これってCSSの優先順位などによって どうしようもない場合があったりする。 そんなときは一旦initialで CSSの要素を解除してみると良い ...

Thumbnail of post image 163

CSS

フローティングウィンドウ・フローティングメニューを 実装する方法を解説していきます。 今回はふたつ 左側にバナーやメニューや メッセージなど自由に設定出来ます。 一つは単純にフローティングウィンドウを表示 2つ目は、閉じるボタンを実装してい ...

Thumbnail of post image 082

2020年4月5日CSS

CSSで、float:leftだとかfloat:rightとかで指定することで 左右に並べて表示させることが出来るが これが時々左右に並べて表示出来ず 改行されてしまうことがある。 これの原因としてはwidthの指定値よりも 合計が多くなっ ...

Thumbnail of post image 015

2020年1月31日HP制作覚書,CSS

CSSで背景に画像を繰り返し挿入する 以下コードを挿入すると 指定エリア全画面上に繰り返し表示されます。 追加したいエリアの指定クラスまたはID{ background-image: url("画像のURLを差し替える"); } CSSで背 ...

Thumbnail of post image 113

2019年10月15日HP制作覚書,CSS

WPのテーマによっては、 <ul><li>タグが効かずに ドットが表示されないときがある。 また別のケースでは ドットを消したい場合がある。 そんな時は、 以下コードをCSSに書き込むことで解決する。 リストタグのド ...