tdタグにnowrapが指定されている場合に強制改行させる。
半角英数字で記述すると、単語の途中では改行されず枠からはみ出るというものがあります。その場合は、スタイルシートで「wor ...
CSSの:before :afterでz-indexがうまく機能しない現象に対処
最近はHTMLのコーディング作業での装飾にスタイルシートを使うことが多くなりました。以前は画像を使って背景に当てていまし ...
スタイルシートだけで サイド部分をスクロール固定する。
ホームページは、2列構成になるケースがあります。メインカラムと、サイドカラムです。 たいていメインカラムのほうが縦に長く ...
cssでtdタグにmin-heightと同様の機能をいれてみた
tableタグを使用してカレンダーを構築している際に、気になることがありました。それはTDタグの高さが足りないということ ...
font awesome アイコンを文字の縦中央に合わせてみた
ホームページ制作でアイコンの役割はとても重要です。直感的に意味を伝えてくれるからです。 そんなわけで、アイコンフォントで ...
レスポンシブで長方形画像を正方形のままキープする
以前、長方形画像をスタイルシートで正方形表示する方法について記事を書きました。 スタイルシートの object-fit ...
css だけで文字を回転させる
ホームページ屋にとって、スタイルシートを極めることはとても重要です。なぜならば、レスポンシブに対応するためにはHTMLコ ...
CSSだけで縦書きを実現する
ホームページは基本的に横書きの媒体です。なぜならば、横書きは改行位置が上から下へ流れますが、縦書きの場合は改行後下から上 ...
半角アルファベットでレイアウトが崩れる場合に強制改行させる方法
HTMLに長いこと携わっていても、たまに初歩的なことでつまずくことがあります。単純な現象ほど難しかったりするものです。今 ...
inputのplaceholderに色を付けてみた
placeholderとはあまり聞きなれない名称です。わかりやすく言うと、入力フォームの中に記述されている「入力例」のこ ...
CSSだけでリンクを無効にしてみた
ホームページが一般的になって最も有効に使われたタグがあります。それは「リンクタグ」です。 他のページへジャンプするだけの ...
HTMLで画像の右クリック保存をガードする
HTMLはその特性上画像をダウンロードしたり、ソースを閲覧することが容易にできるようになっています。 ただ昨今、著作権や ...
fixedで指定したCSSを縦横中央寄席にしてみた
スタイルシートで、縦横中央寄席はよくありますが、いざ設定してみようとするとなかなかうまくいきません。 横中央揃えならとも ...
cssでmax-width min-widthの値をリセットする
ホームページのレスポンシブ化(画面サイズ自動可変表示)が一般的になり、スタイルシートの設計も複雑化してきました。 例えば ...
CSSで複数テキスト行を縦中央揃えにした。
CSSで正方形を作り、縦横中央揃えでテキストを入れることがしばしばあります。 横揃えは標準のスタイルシートで簡単にできま ...
CSSだけで画像を正方形に調整してみた
ホームページ制作の際に、画像サイズの調整はデザイン制作段階で行います。写真の縮尺等もPhotoshop等を使用して調整す ...
CSSでoverflow: scroll指定時に、横スクロールを無しにする
お知らせなど同じようなフォーマットが連続して縦に続く場合、iframeで埋め込み縦スクロールにするほうが見やすかったりし ...
ボタンの二度押しをwait画面でガードしてみた。
以前フォームの二重送信をガードする方法について書いた記事があります。 これは、ブラウザの更新ボタン(F5ボタン)連打をガ ...
Googleサイト内検索のデザインをカスタムした。
先日Google検索の埋め込み方についての記事を掲載いたしました。 埋め込むだけならば、「Googleサイト内検索」か ...
Font Awesomeが表示されない現象に対処
web制作でレスポンシブ(PCとスマホ表示を自動で切り替える構築方法)が一般的になって変化したことがあります。 それは「 ...
CSSで割り切れない値を横幅指定する方法
ホームページを組む場合に、横4列構成でレイアウトするケースがあります。例えば商品情報などです。 少量の情報一覧であれば、 ...
CSSで画像と文字を横並び縦中央に揃える
webデザインでレスポンシブが一般化してからは、スマホでの縮尺変化による見にくさ、高速化の観点から「デザイン画像」が使 ...
右下配置のCSS 背景画像に余白をつける
CSS背景に画像を指定することはよくあることです。背景指定方法には、縦位置、横位置の指定があり、左上、右下などに配置でき ...
CSSで複数枚背景画像を設定しさらに背景色も加える。
ホームページ制作で、背景画像を使用することはよくあります。またホームページ制作入門でもどちらかといえば初級のテクニックだ ...