ブログ記事9件
機能と美観を考慮した「引用」デザイン記事を書いていると「引用」は時々必要になります。編集画面にデフォルトで備わった「」のアイコンで、「blockquote」の基本的な「引用部」のデザインを作れますが、デザインが少し物足りないのと、本文幅が狭い時は1行の文字数が少なくなりレイアウトに苦労するかも知れません。そこで制作したのが「BQuoteSign⭐」で、配色も自由に変更出来る箇所が多くて、好みの「引用」デザインを得られると思います。8種のマークの選択と色の設定について
こんにちは！麺です。先週梅雨明けし、いよいよ夏本番ですが皆様はいかがお過ごしでしょうか？私はもうすでに連日の猛暑にやられて外出が億劫になっています笑今回はそんな猛暑でもお出掛けしたい！という方におすすめのスポットをご紹介したいと思います。その名も！！ホテル雅叙園東京にあります、東京都有形指定文化財の百段階段で行われている企画展でございます。引用元:目黒雅叙園東京東京都有形指定文化遺産百段階段https://www.hotelgajoen-tokyo.com/ここは1年中季節
ブログを読んでもらうなら自分の伝えたい思いをメリハリよく、肌全体にしみわたる高保湿化粧水のように読みやすいブログにしたい！と思って日々、試し試し試行錯誤を重ねながらブログを書いている星セイカ今日は自分のブログに画像上のみどりの矢印部分⇒こんな縦線をいれてみたくてどうしたら入れられるのか調べて無事自分で入れられるようになったのでシェアしていきたいと思います学んだこと、知り得た知識はアウトプットすることでより自分の糧になることを一緒に思いだしていこ
Firefoxのデザイン崩れに修復対応しましたFirefoxの「input要素」のスピナー幅に対応したデザイン修正を行いました。また、「引用マーク」の絵文字が「斜体」になる場合とならない場合が、表示環境によって不確実でした。今回、スタイル指定を確実にする事で、これを改善しました。 「BQuoteSign」の操作方法以下のページの「操作マニュアル」を参照ください。「BQuoteSign」マニュアル「BQuoteSign」は、デフォルトの「引用部デザイン」を、よ
「引用マーク」のデザイン「svgタグ禁止」の指定で、これまでの「BQuoteSign」は使えなくなりました。「引用マーク」はこのツールのアレンジするデザインで一番肝心な部分で、従来の「svg」を置換える「文字」を探して、なんとか再生しました。頻度は多くないですが、デフォルトの貧弱な「引用部」のデザインは使えませんから。「SVGRepair⭐」ver.0.3で使用した「」の文字を、新しい「BQuoteSign⭐」でも使用しています。「svg画像」のマークを使っている
「引用マーク」のデザインブログ文書中で「他の文書の引用」を使用する時、引用を示す「blockquote」の表示を付ける事がマナーとされます。その表示は「引用では～で、私は～と考える」という形で、記事自体の趣旨を明瞭にします。「blockquote」のこの効果は、マナー以上に大事かも知れません。「BQuoteSign」は、デフォルトの「引用部デザイン」を、より見栄えのするデザインにするツールです。今回は、新しいデザインを「2種」追加しました。引用表示のデザイン 追加した
「BQuoteSign」は、デフォルトの「引用部デザイン」を、より見栄えのするデザインにするツールです。このツールは「右クリック」を使用しません。マニュアル上の「Click」の表記はすべて「左クリック」の意味です。目次「BQuoteSign」の常駐について「BQuoteSign」の起動前に必要な操作「BQuoteSign」の起動と「引用部」の指定「引用部デザイン」の選択「マーク色」の設定「背景色」の設定「マーク色」「背景色」の濃度「デザイン登録」機能の使い方
「BlockQuote」デザインの登録・呼出し機能を追加この種のツールでは定番の「デザイン登録・呼出し」機能を追加しました。この機能があれば、ブログの定型を運用したり、臨機応変なアレンジを試したりできます。登録ボタンや呼出しボタンのコードは、これまで「LinkCardEditor」で使って来たものを利用し、ボタンから動作するコードも似た様なコードで、そう苦労する事なく作れました。◎ストレージ内には「BQ_Style」という登録名で、以下のデータが登録されます。コー
「引用マーク」のデザイン選択機能を追加「BQuoteSign」の表示する「引用マーク」のデザインを色々と試作しましたが、簡単にこれと決められません。結果、幾つも「引用マーク」を作って「BQuoteSign」のコードを差し替えてテストすることになりました。そのうちに、いっそのことデザインを簡単に切替え可能にすれば、デザインの適・不適が判り易いと考えました。削除しなかった「」ボタンを、このデザイン選択機能に使う事に決定。選択ボタンのデザインも「FontAwesome」のデザ
「引用マーク」の配色コントロールを追加「BQuoteSign」は、明瞭で少し見栄えの良い「引用マーク」を引用部に表示します。PCでもスマホでもこれを表示する事が、ツールの大きな目的です。当初、背景色に白抜きの「引用マーク」だけを考えていたのですが、背景色は余り濃く出来ないので「白抜き」は明瞭さに欠けます。この事から、マークに着色して色を調節可能にしました。コードは、背景色のコードを少し加工するだけで済みましたが、最初から作るとかなりややこしいコードです。「引用マー
「LinkCardEditor」の解体とリメイク「LinkCardEditor」は、各種パーツを細かな部分まで追い込んだので、色々とノウハウが詰まっています。新しくツールを制作する際も、多くの共通部分が利用できるので、「LinkCardEditor」を習って作るより、解体してリメイクする方が効率的です。という事で、コードの「id」「class」名等を変更して、他のツールとの干渉を避け、必要なパーツのみ残したリメイクを行いました。下は「Blockquote」をアレンジする新しいツ
情報が引用である事 を示すブログに書き込む情報源は、それを明らかにしないとならない場合があります。特に著作物の内容をブログ記事に引用する場合は、それが「引用」である事を断っておかないと、お叱りを受けるだけで済まない場合もあり得ます。「編集アイコン」の「」は、選択した範囲を「blockquote要素」に設定します。これは「HTML上」で、その文節や段落が「引用」である事を明示する方法です。（全ての場合でこれでOKとはならないと思いますが、最低限の作法でしょう）
各種画像サンプルれむれりけれりけけれりれけりむけ膜＋れ魔れれけれりれけりむけ膜＋れ魔れれテストElements囲み枠〔h2〕❶のれのABameblo.jpテストElements囲み枠〔h2〕❶のれのABameblo.jpAmebaテストiframe/iframeリンクblog.ameba.jpDisplayALTBlogPage/atmain·personwritepContribu
各種画像サンプルれむれりけれりけけれりれけりむけ膜＋れ魔れれけれりれけりむけ膜＋れ魔れれテストElements囲み枠〔h2〕❶のれのABameblo.jpテストElements囲み枠〔h2〕❶のれのABameblo.jpAmebaテストiframe/iframeリンクblog.ameba.jpDisplayALTBlogPage/atmain·personwritepContri
site_view-8028654 2022.04.20◎秒が隠れてしまいましたが、多分、私のコードの間違いと思います。コメント記入欄を開くと「投稿データ」の状態が変わるので、このへんで間違った気がします。「投稿データ」の部分のコードを改めました。今回の方が無理のないコードで、例えばユーザー名の文字数が変わっても、影響を受けなくなっています。◎Seesaa絵文字補正、上に戻るボタンのCSSを追加している現在のコードと、置き換え可能にしています。このまま、520行
