※当サイトは、Google Adsense、Amazonアソシエイト、各種アフィリエイト広告を利用しています。また、製品PRを行っている場合があります。


CSS

Thumbnail of post image 099

ブログやホームページにYoutube動画を埋め込む際に
Youtubeで埋め込みコードをコピペすると
サイズが小さかったり、でかすぎたり、
左寄せで見栄えが悪かったり。

そこで、縦横サイズを変えてみ ...

Thumbnail of post image 157

CSS

Contact Form 7を使っていると色々と細かい調整が必要になるときがあります。 使用しているWordpressのテーマによってレイアウトが崩れる場合もありますので。 今回は送信ボタンを中央寄せにする方法を解説します。 まず、送信ボタ ...

Thumbnail of post image 194

CSS

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

Thumbnail of post image 099

CSS

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

Thumbnail of post image 192

CSS

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

Thumbnail of post image 065

CSS

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

Thumbnail of post image 168

2022年3月25日CSS

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

Thumbnail of post image 130

CSS

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

Thumbnail of post image 023

CSS

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

Thumbnail of post image 052

CSS

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

Thumbnail of post image 181

CSS

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

Thumbnail of post image 116

2020年4月5日CSS

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

Thumbnail of post image 174

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

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

Thumbnail of post image 144

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

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