-
-
【CSS】影だけじゃないbox-shadowプロパティの使い方
2020/6/29
CSS3で新たに追加されたプロパティを用いれば、かつては画像を用意しなければできなかったようなさまざまな表現が可能です。 box-shadowプロパティはボックスモデルの要素に影を追加するプロパティで ...
-
-
【CSS】box-shadowプロパティでフキダシのしっぽいろいろ
2020/6/30
CSS3で新たに追加されたプロパティを用いれば、かつては画像を用意しなければできなかったようなさまざまな表現が可能です。 この記事では、会話風のフキダシをHTMLとCSSで表現するときの ...
-
-
HTMLとCSSで作る会話風フキダシ3選
2020/9/30 LINE
イガちゃん こんにちは。 まるでLINEみたいなフキダシですね。 WordPressとか各種ブログサービスで使えます。 いいでしょ。 ステキ。 こちらはiPhoneのメッセージ風。 フキダシが青なのは ...
-
-
iPhoneのメッセージを吸い出してWebページで再現する
2021/1/2
iPhoneのメッセージアプリで実際にやりとりした画面を、Webページで再現したい。スクリーンショット(キャプチャ画像)じゃなくて、HTMLとCSSで(JavaScriptも使います)。 ...
-
-
Webページで iPhoneのメッセージ画面を再現する
2021/1/3
iPhoneのメッセージの画面をHTMLとCSSでブログ等のWebページに再現する方法。 画像として記事に表示させるんだったら、スクリーンショットを撮って配置すれば比較的簡単。下の画像が ...
-
-
【AFFINGER5】フキダシのしっぽを調整する
このブログのWordPressテーマは「WING(AFFINGER5)」を使用しています。 会話風のアイコンとフキダシを簡単にレイアウトできる便利な「会話ふきだし機能」がついてるんですが ...
-
-
【AFFINGER】カテゴリ一覧スライドショーのサムネイルにラベルを貼る
このサイトのWordPressテーマは「WING(AFFINGER5)」を使用しています。 トップページの上部に、おすすめ記事が水平方向にスライドしているのは、この「WING(AFFIN ...
-
-
【WordPress】配置した覚えのない記事一覧が表示されて焦った話
表示確認のためiPhoneで自分の投稿を眺めていたら... サイトの最下部 一番下、フッターのさらに下に配置した覚えのない投稿一覧が表示されていました。 なんだ、これ? 最下部のさらに下に… ウィジェ ...
-
-
【AFFINGER5】カテゴリ一覧スライドショーのコンテンツの高さを調整する方法
このブログでは、WING(AFFINGER5)というテンプレートを使わせていただいています。 なかなか高機能なテンプレートで便利な機能も盛りだくさんなんですが、ver20180521βから「カテゴリ一 ...
-
-
全自動で外部リンクのテキストに
アイコンがつくカスタマイズ(改定版)外部リンクのテキストに自動的にアイコンがつくようにする 外部サイトへのリンクテキストに、それとわかるようにアイコン()を自動的につけるカスタマイズです。 意外とネットに情報がなくて色々考えた末この方法 ...