更新日: 2022年09月09日公開日: 2017年08月29日CSSだけで吹き出しをつくる!デザインサンプル26個 CSSだけでつくれる「吹き出し」のデザインサンプルを26個、用意しました! どのサンプルもコピペで利用することができますので、デザインの参考にぜひ取り入れてみてください。 コピペでOK!CSSだけで吹き出しをつくる! HTMLとCSSだけで作れる吹き出し のサンプルをご紹介します! サンプルのコードをコピー&ペーストするだけで使える吹き出しを20個以上! シンプルなものから、枠線、丸、影付きなど様々なバージョンをご用意しました。 これから紹介する全ての吹き出しは レスポンシブに対応 しています! 普通の吹き出し まず、一番シンプルな吹き出しのサンプルです。 balloonクラスのdivを吹き出し本体とし、balloonの before疑似要素 で三角のアイコンを表現します。
WordPressをしばらく運用していると、「もっと自由にデザインを変更してみたい」「機能を自分好みにカスタマイズしたい」と考える人も多いと思います。 そんなときは、自分自身でWordPressテーマを自作してしまうという方法があります。 テーマを自作すれば、1から100まで自分の理想を反映させたWebサイトを作ることができます。 WordPressテーマを自作するメリットは、運営するWebサイトに合った理想のデザインや機能を搭載できるということと、あとからでも機能の追加やデザインの変更がしやすいことです。 逆にデメリットとしては、時間と手間がかかることがあげられます。 WordPressテーマの自作は意外と簡単ではあるものの、HTMLやCSS、PHPの基礎知識に加え、WordPressの構造に関する知識があるといいでしょう。 本記事では、WordPressのテーマを自作する方法を解説しま
WordPressの段落ブロックに枠線(囲み線)を付ける方法をご紹介します。段落ブロックには、クリックだけで枠線を付与してくれるような便利機能は用意されていません。CSSなどを使って付与する必要があります。 今回は、段落ブロックの「高度な設定」機能を使って、CSSで段落ブロックに枠線を追加します。いくつかCSSのデザインサンプルを載せています。よろしければコピペしてご利用ください。 段落ブロックに枠線を付ける方法 STEP1:「高度な設定」にCSSクラスを追加する 枠線を付けたい段落ブロックを選択します。画面右側に「高度な設定」が表示されます。「追加 CSS クラス」に好みのクラス名を追加します。 今回は「waku」と付けています。 参考 ソースで見ると、段落<p>のタグが<p class="waku">に変更されます。 STEP2:スタイルシートを追加する 先ほど付けたクラス名に対するス
SCREENグラフィックソリューションズは9月4日、京都市のふるさと納税の返礼品として「ふるさと納税パック ヒラギノ基本6書体」を登録したと発表した。寄付金額は60,000円。 SCREENグラフィックソリューションズ ロゴ 「ふるさと納税パック ヒラギノ基本6書体」は、「ヒラギノ角ゴシック体 W3/W6/W8」「ヒラギノ丸ゴシック体 W4」「ヒラギノ明朝体 W3/W6」の6書体、12フォントをCD-Rに収録したもの。高品質で視認性が高く、ウエイトの使い分けも可能なため、ビジネス文書やプレゼンテーション、店頭POPなど幅広い場面で活用できる。 2023年9月4日現在、この返礼品を掲載済みのふるさと納税ポータルサイトは「さとふる」、「ふるさとチョイス」、「ふるなび」、「楽天ふるさと納税」の4件。 返礼品の内容は、CD-R 1枚(DVDトールケースに封入)、DVDトールケースサイズはW135×
組版の基本ルール(句読法・禁則処理)についてまとめました。 あくまでも、基本ルールといっても、①発注者の方針を尊重しましょう。②仕事内容と作業性の兼ね合いを検討しましょう。③処理方法の優先順位をきましょう。以上のようなことに注意してください。 ご不明な点、ご質問がありましたらばメールかお電話(029-282-0372)をいただければご説明いたします。 1冊の本を通して、句読点やパーレン類の使い方、組み方を統一することが原則です。 (発注者の意向による選択) (1)縦組みでは、テンとマル(、。)を使います。 (2)横組みでは、下記の方法があります。 ①本日は、晴天なり。(テン・マル方式) ②本日は,晴天なり。(カンマ・マル方式) ③本日は,晴天なり.(カンマ・ピリオド方式) 数字や欧文が多く含まれるときは、カンマとピリオドが望ましいです。 【パーレン類の組み方】 (1)原則として前後2分あけ
こんにちは、株式会社バーグハンバーグバーグでデザインのアルバイトをしている、お高菜と申します。普段は美術系の大学でデザインを学んでいます。 来年には大学を卒業するので、そろそろ就活の準備をしようかなと思っているのですが……皆さん、こういったものをご存知でしょうか? こちらは「ポートフォリオ」と呼ばれる作品集。 デザイナーが自分の作品をファイルし、就職先に「私はこういう作品を作っていました」「こんなこともできます」とアピールするための作品集です。 デザイン系の職種の場合、企業はこのポートフォリオを見て学生の力量を判断します。つまり、ポートフォリオの出来が一生を左右すると言っても過言ではありません。 でも…… ・ページ数は多い方がいいの? ・作品はどのくらい説明すればいいの? ・そもそも企業は何を知りたくてポートフォリオを見ているの? など、あまりにも疑問点が多すぎて困っています。 というわけ
ウイスキーをじっくりと味わえる、オン・ザ・ロックに欠かせない「ロックグラス」。一般的に重厚感のあるフォルムで飲み口が広く、大きな氷をそのまま入れられるのが特徴です。 今回はおすすめのロックグラスをピックアップ。選び方やおすすめのブランドについても解説するので、購入を検討している方は、ぜひチェックしてみてください。 ※商品PRを含む記事です。当メディアはAmazonアソシエイト、楽天アフィリエイトを始めとした各種アフィリエイトプログラムに参加しています。当サービスの記事で紹介している商品を購入すると、売上の一部が弊社に還元されます。 By: amazon.co.jp ロックグラスは、口径が広く背が低いタンブラータイプのグラスです。ウイスキーと氷で楽しむオンザロックには欠かせないアイテムで、別名「オールドファッションドグラス」とも呼ばれています。 飲み口が広い形状は、大きな氷を入れやすいのがメ
ポスターやスライド、その他の資料を作るときのおすすめのフォントをまとめておきます。書体の選び方や使い方の項目で解説したように、重要なのは、可読性、視認性、判読性を意識しながらの「TPOに合わせたフォント選び」です。すでに説明した通り、「短文か長文か?」、「読みにくいフォントではないか?」、「太字・斜体に対応しているか?」ユニバーサルデザインか(=判読性が高いか)?ということに着目しておすすめフォントを紹介します。これまで触れてきませんでしたが、フォントを選ぶときには汎用性・互換性にも注意しなければなりません。 最後にPowerPointにおけるフォント関連の便利なテクニックをいくつか紹介しますので、ぜひ参考にしてみてください。 ゴシック体(和文書体) Winならメイリオ/游ゴシック、Macならヒラギノ角ゴシックも プレゼン用のスライドや学会発表のポスターなどでは、視認性の高いゴシック体を使
iPhoneをデザインしたAppleのデザイナー、ジョナサン・アイブ氏にも影響を与えたといわれる伝説の工業デザイナーであるディーター・ラムス氏は「いいデザインの十か条」を提唱しています。ラムス氏と「いいデザインの10か条」を映画監督のゲーリー・ハストウィット氏が映像化した「Dieter Rams’ 10 Principles of Good Design」が無料公開中です。 Rams — Gary Hustwit https://www.hustwit.com/rams 「Dieter Rams’ 10 Principles of Good Design」は以下から見ることが可能です。 Dieter Rams’ 10 Principles of Good Design on Vimeo 「全てのものは相互作用し、同時に他から独立しています」というラムス氏の言葉と共にムービーはスタート。 「
「Firefox」のアイコンの外観がまた変わるという。 Firefoxの「Quantum」ブランド版向けにシンプルで明るくなったアイコンを採用してからまだ1年も経っていないが、Mozillaは再び、アイコンをモダンなものにする取り組みに着手した。今回は、単にFirefoxの新しいアイコンを作成するだけでなく、新しいサービスや、「Rocket」や「Focus」といったFirefoxバージョンなど、同社の主力ブラウザ以外の製品にも対応するアイコン群を構築する計画だ。 「炎の尾を持つ素早いキツネ(fox)のアイコンは、製品群全体を表現するデザインとしては十分ではない」と、Firefoxのユーザーエクスペリエンス担当シニアディレクターであるMadhava Enros氏とMozillaのクリエイティブディレクターであるTim Murray氏は、米国時間7月30日付のブログ記事で述べた。「そのロゴの色
WordPressではカテゴリーページも記事ページも、また固定ページであっても基本的には全て同じテンプレート(デザイン)を使用して表示されます。それでも特に問題ないというブログも多いでしょうが、こだわりがあるブログやカテゴリーごとに大きくテーマが変わる場合など、カテゴリーごとにページのデザインを別々に変更したいというケースもあるでしょう。 「カテゴリーごとにデザインを変えることなんてできないでしょう!?」と思われる方も多いのですが、カスタマイズの自由度が高いWordPressではそれが可能です。 このページでは『カテゴリーごとに記事一覧が表示されるアーカイブページのデザインを変更する方法』と『特定のカテゴリーに含まれる記事ページのデザインを変更する方法』をご紹介致します。 記事一覧のデザインを変更する方法例えば「ブログ」「SEO」「ニュース」というカテゴリーが存在し、「SEO」のカテゴリー
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く