ブックマーク / www.smatechblog.com (2)

  • ブログ記事にLINE風吹き出しをかんたんに載せる方法(はてなブログ) - すまてくブログ

    こんにちは、ヨシタカです!みなさん、ブログ楽しんでますか? いろいろなブログをみてると、何やらLINE風の吹き出し形式でおしゃべりして楽しそうなブログがありました。 これはやってみたい!!と思い、わたしもためしてみたので手順などレポートします。 かんたんな手順は以下のとおりです。 LINE風吹き出しかんたん手順 1.テンプレCSSをメモ帳にコピペ 2.クラス名と画像URLを記載 3.はてなブログのデザインCSSにコピペ 4.記事にコードを記述 でも、けっこう難しそうなんだけど・・・ いえいえ、かんたんに出来ましたよ。 では、さっそくやってみましょう٩(ˊᗜˋ*)و まずはメモ帳にCSSをコピペ クラス名と画像URLを記載 はてなブログのデザインCSSにコピペ 実際に記事で使ってみる お好みでアレンジ 吹き出しの色の変更 アイコン(クラス名)の追加 吹き出し色の追加 モバイルでの確認 まとめ

    ブログ記事にLINE風吹き出しをかんたんに載せる方法(はてなブログ) - すまてくブログ
    nodame79
    nodame79 2019/02/02
  • コピペするだけ!はてなブログで使えるアレンジ囲み枠13選 - すまてくブログ

    こんにちは、ヨシタカです!みなさん、ブログ楽しんでますか? 前回はブログ記事にLINE風吹き出しを載せる方法をご紹介しました。 www.smatechblog.com いろいろなブログをみてみると、四角い枠で文章を囲んでいるものがあって、わたしもやってみたかったのですが、、、 はてなブログではワンクリックで囲み枠にするアイコンってないんですよね。。。 そこで今回はコピペするだけでブログ記事に囲み枠をかんたんに追加する方法をまとめましたので、ご紹介したいと思います。 えっ、ほんとうにコピペするだけなの? そうですね、コピペするだけです。ただ、基色を赤(#fc4a1a)にしているので、色を変えたい場合はこの部分を変更してください。 カラーコードはWEB色見 原色大辞典 - HTMLカラーコードのサイトさんがまとめていただいているので参考にしてくださいね。代表となる色を一部記載します。 代表

    コピペするだけ!はてなブログで使えるアレンジ囲み枠13選 - すまてくブログ
    nodame79
    nodame79 2019/02/02
    今度使ってみます。勉強になりました。
  • 1