Now Loading...

2018年02月16日

IE 11で注意が必要です。

IE 11で注意が必要です。


Kirara| &Jure^
[\\\\]
$:%+..+%:#


前回の記事でご紹介した
文字の真ん中にラインを引くCSSで、
calc()って言うのを使うのですが、

IE 11で見てびっくり

ie_b2.JPG

何とも変な線になっている(;´д`)トホホ



解決策はここにあります。

IE11でlinear-gradientのcolor-stopにcalc()を使うと効かない場合がある | ITハット

久しぶりにハマったので忘れないように記事にしておきます。calc() はIE9から使える便利なCSS関数なのですが、グラデーションで使うときには注意が必要かもしれませ・・・



ちなみに・・・、
IE 11 がtext-fill-color
サポートしていませんので、


ie_b1.JPG


こんな感じになってしまう(;´д`)トホホ

これは仕方ないですね。



貴重なお時間を割き、
最後まで
ご高覧いただきまして
有難うございました






タグ:日記
posted by きらら&ジュレ at 06:25| 2018 きらら&ジュレの日記

2018年02月14日

Valentine Ribbon

} Valentine| ^ R]ibbon{ ^ }
Valentine’s day^

<Happy^ Valentine[ 's] day|>


$ 今日は Valentine's^ Day^ ですね

あくび印のフォントとCSSを使って、
R]ibbon{ を作ってみました

両端のカットがセンターでないところがミソです。
$neco913.kirara#


[\\] このフォントは
期間限定ダウンロードです。

カリグラフィ書体の1つ、
カッパープレート体だそうです。

作者さまは、
手書きカリグラフィに出きるだけ
近づけるよう努力をしたそうで、
素敵なフォントに仕上がっていますね。

おひげ(おしりのぴろんってやつ)も素敵です。

作者さまは
大文字の『 X 』がお気に入りだそうで、
X
こだわりを感じますね


カリグラフィー ( Calligraphy| )とは
「美しい書き物」という意味のギリシャ語で、
アルファベットを独特のタッチで書く技術。
$neco913.kirara#


% 昨日ご紹介いたしました
独自フォントを使ってライン風は、

IE 11 がtext-fill-color
サポートしていませんので、


text_fill.JPG

グラデーションではなく
単色にてご紹介いたします。



[*-neco913.kirara.st-*]


{*-neco913.kirara.st-*}


![wanko]!
このフォントカワ(・∀・)イイ!!でしょ?

こんな感じに[\*\]アクセントにも使えるかな?


{\-\}工夫すれば色々と楽しめそうですね♪

$neco913.kirara#



貴重なお時間を割き、
最後まで
ご高覧いただきまして
有難うございました






タグ:日記
posted by きらら&ジュレ at 05:09| 2018 きらら&ジュレの日記

2018年02月13日

お知らせ (2018/02/13)


おしらせ 2月13日(火)

きららとジュレのブログ


おせわになります。
きららとジュレのブログでは、
しばらくのあいだ、
コメントらんをとじさせていただきます。
せっかくいただいたコメントにおへんじもかけず、
みなさまのブログにほうもんもままならず、
本とうにもうしわけなくおもっております。


なお、しまいブログは
きほんコメントらんひらいてます。
どうしてもというかたはそちらに
かきこんでくださればさいわいです。
こんごともどうぞよろしくおねがいいたします。
        * Font By ちはやチョーク



/neco913/



[\\] このフォントの漢字は、
小学校1年生で習う漢字を収録しています。
ひらがなが多いですが、
ご了承くださいませ。
neco913.kirara.st


% 黒板風囲み枠に、
チョーク風フォント、テキストの横にラインを入れました。
フォントカラーもチョークっぽい色にしました。
neco913.kirara.st


/ 文面で強調したい箇所に
手書き風の下線と文字色を変えました。
こちらの下線と比べて頂くとお分かりかと思います。
neco913.kirara.st



DSC08410.JPG



~ 独自フォントを使って、
ライン風にしてみました。
カラーはグラデーションを施しています。

※ IE 11はtext-fill-colorを
サポートしていません。




[*-neco913.kirara.st-*]

{*-neco913.kirara.st-*}

![wanko] のフォントカワ(・∀・)イイ!!でしょ?


こんな感じに[\*\]アクセントにも使えるかな?

{\-\}工夫すれば色々と楽しめそうですね♪



$neco913.kirara#


$neco913.kirara#


$neco913.kirara#



            Font By あくび印
neco913.kirara.st



#Twemoji Awesome、Font Awesome
Font Awesome Animationの
CSS 定義をMIXして使っています。

独自フォントでも組み合わせ次第でうまく動作します。

この文の中でも、黒ねこのアニメーションや
この前後の肉球は
! flip-horizontalで逆転しています !



貴重なお時間を割き、
最後まで
ご高覧いただきまして
有難うございました




タグ:お知らせ
posted by きらら&ジュレ at 06:04| 2018 きらら&ジュレの日記

2018年02月09日

空倶楽部 2018/02/09/

空倶楽部です。

DSC08094.JPG

写真 DATE 2018/01/19 11:54 高崎市自宅付近


明日から三連休、忙しいです






空倶楽部、
今後ともよろしくお願いいたします

空倶楽部は毎月、
9の付く日に行います。
詳しくは、
かず某さんchacha○さん
までどうぞ。





29日 () 日直 きらら #

縦書きにちょう戦

黒板風の囲みわくを使って、
縦書たてがきにちょう戦してみました。
縦書きも簡単そうで中々難しく、
フォントも対応たいおうした物を使わないと、
見た目がくずれます。

日本語の『かっこ』は縦向きです。
字下げや数字の向きも変えます。
縦書きになるとリンクの線も
おかしな位置になるので変えます。
ふり仮名がな(ruby)も付けました。

* Font By りいのフォント



*このフォントの漢字は、
小学校で習う漢字(教育漢字)1006文字です。
ひらがなが多いですが、
ご了承くださいませ。
縦書きに対応しており、調整はほとんどいりません。
neco913.kirara.st/


% CSSで縦書きを設定するには、
縦書きにしたい箇所にCSSで writing-mode: vertical-rl; を記述します。
この「vertical」が縦、「rl」が右から左(Right to Left)という意味です。
neco913.kirara.st/


/ 縦書きできればOKというものでもなく、
あれこれ微調整が必要になるのが縦書きの難点で、
文字の表示方向にtext-orientationという
プロパティを使いたいのですが、
IE, Edgeが未対応です。
neco913.kirara.st/


: Chrome、Edgeでよい感じに
見える設定
が上記なのかなと思います。
neco913.kirara.st/


$黒板風の囲み枠と、
チョーク風フォントを使って
! 横文字バージョンこれから作成予定 !
neco913.kirara.st/


Twemoji Awesome、Font Awesome
Font Awesome Animationの
CSS 定義をMIXして使っています。
独自フォントにも使っています。
neco913.kirara.st/




貴重なお時間を割き、
最後まで
ご高覧いただきまして
有難うございました





タグ:空倶楽部
posted by きらら&ジュレ at 15:02| 2018 きらら&ジュレの日記

2018年02月07日

独自 Webフォントの反映

久しぶりの更新ですが、
写真とは関係ないお話をさせて下さい。

少々専門的?なお話なので、
興味のない方はスルーしてください。

DSC08079.JPG

↑ 写真もお話とは関係ありません(-"-;A ...アセアセ


当ブログは積極的に
Webフォントを
利用していますが、
Google Fontsのみで
独自のフォントは

利用しなかった・・
と言うか

出来なかったのです(´;ω;`)ウッ…

( 姉妹サイトは問題ありません。)


例えばニクキュウフォントは

Google Fontsですし、
簡単?に利用出来ますが、

独自に用意したフォントは

反映されない。

何故(・・?
いろいろと調べた結果、
クロスドメインが絡んでいるらしく、

クロスドメインリクエストが
制限されている状態らしいのです。


※ クロスドメイン (cross domain)とは、

ホームページを表示したときに、
複数の場所(ドメイン)から
データを持ってくるようになっている状態のこと

です。

さて、困った・・しかし、

どうやら「.htaccess」ファイルで、

クロスドメイン許可の設定ができるようで、

Header set Access-Control-Allow-Origin: "*"

※ 「*」はどんなURLからでもアクセスOKと言う意味。
自身のブログのURLを指定するのをおすすめします。

これを

「.htaccess」ファイルに書いてやると、


! & / * : ~ - _ %


# $ 黒猫です。


# 黒猫にアニメーションを反映させました。

Font by http://pandachan.jp/ Thanks %


↑ リンクをhoverするとアニメーションします。


こんな感じで、

独自で用意したフォントが反映されました(^^♪



※ 注意事項として、
「フォントをアップロードしたフォルダ」に
「.htaccess」を作ってやる必要があります。


://neco913.kirara.st/

↑ このフォント、面白いでしょ(・・?

このブログのURLを書いたのですが、
ラインみたいになりました。

まぁ・・、
読みづらい(-_-;)ってのは
さて置き、
Webフォントを利用してみたい方の
参考になれば幸いです。


# Font Awesome の fa-10x


バレンタイン、

ひな祭りと忙しいな・・。




貴重なお時間を割き、
最後まで
ご高覧いただきまして
有難うございました




タグ:日記
posted by きらら&ジュレ at 05:50| 2018 きらら&ジュレの日記

2018年01月29日

空倶楽部 2018/01/29/

空倶楽部です。

DSC08137.JPG
自宅ベランダより。
雪がまだ残っています

節分が終わるまで忙しいです。






空倶楽部、
今後ともよろしくお願いいたします

空倶楽部は毎月、
9の付く日に行います。
詳しくは、
かず某さんchacha○さん
までどうぞ。



貴重なお時間を割き、
最後まで
ご高覧いただきまして
有難うございました






posted by きらら&ジュレ at 17:58| 2018 きらら&ジュレの日記