cssを作成してみたのですがよかったらアドバイスをください

今日:5 hit、昨日:1 hit、合計:2895 hit

最高ランク : 1 , 更新：

https://uranai.nosv.org/u.php/novel/w2mvfc5wks1/

僕もCSS作成は初心者なのですが……
文字が少し見にくいかと

改善方法としては、
背景透過を無くすのが一番ですね

ですが、その方法になりますと
後ろのハートの画像が見えにくいです
なのでそこは自由なのですが……

はちと様がもし、
背景透過が良いのでしたら
文字色を変更すると見やすいですね
(背景のピンクより濃い色や
寒色系の色などが良いと思います)

その他はあまり問題はありません
なので大丈夫ですよ(o´∀`)b

長文失礼しました<(_ _)>

nemunemusama
違反報告リンク

私はCSSを作ったことはないですし、完全に個人的な意見ですが…
［良いところ］
・可愛い
・フォントと背景が合っている

［改善してほしいところ］
・文字が見えにくい(色が背景に同化している)

私はこんなふうに思いました

20070805
違反報告リンク

成程。。お二人共有難う御座います
文字の見難さは私も思っていましたが、矢張りきちんと見易くするべきですね、改善してみます。

w2mvfc5wksp0
違反報告リンク

少し色を濃くしてみました。まだ見辛いですかね。。？

w2mvfc5wksp0
違反報告リンク

さっきよりかは良いかと……

nemunemusama
違反報告リンク

今度のはどうですかね？
見易いですかね？

w2mvfc5wksp0
違反報告リンク

はじめまして。
普段CSSで遊んでいるものです。
あくまで自分の感想ですので、参考までに。

良いと思った所
・画像が可愛い。画像選びのセンスがあって羨ましいです。
フォントとの組み合わせもいいと思います。

変えた方がいいと思う所
・全体的に文字が見づらい。
色が少し薄い気がします…。
・リンクと普通の文字の色を変えるとわかりやすいです。
特に、本文の中にリンクを貼った時に紛れてしまうので、個人的に変えると良いかなと思います。

具体的な改善例
・文字の色
リンクを#9c9cadにするなど。

色は完全に私の好みですが、
これだけでも、見やすくなると思うので試してみてください。

白っぽい背景に薄い色は見づらいので、かなり濃くして良いと思いますね。

・背景の透明度
今は、
div#wrapper{background: rgba(255,255,255,0.5);border:0;}
となっているかと思いますが、0.5を0.7などに変えてみてはどうでしょうか。
ちなみに、0〜1の間で設定できるので、色々試してみてください。

あと、CSSに
input[type=radio]{visibility:hidden;}
を入れると、選択肢のボタンが画像のみになります。

これは私個人の意見なので、色々な人に意見を聞いたり、デザインなんかを見ながら作っていくといいと思いますよ〜。

長文&割り込み失礼しました。

em7
違反報告リンク

ものすごく参考になりました。。有難う御座います
早速改善してみたいと思います

w2mvfc5wksp0
違反報告リンク

em7様、私不躾ながらにも貴方の作品を拝見させて頂き、とってもお洒落で綺麗なCSSに見入ってしまいました。
そこで一つ質問なのですが、URLをクリックした瞬間、影が出てくるコマンドはどう打てばいいのでしょうか？また、どうしてそうなるのかを教えて頂ければ幸いです。

w2mvfc5wksp0
違反報告リンク

おーー！！かわいいと思いますよ！！
私はすごい好きです！
単純なデザインとか私は苦手なので尊敬します！！！

Mahta〚色彩〛
違反報告リンク

有り難う御座います！

w2mvfc5wksp0
違反報告リンク

見てくださるとは…ありがとうございます。
そう言ってくださるとこちらも嬉しいです。

リンクをクリックした時に、影をつけるには、
a:hover,a:active{
text-shadow:1px 1px 0px #ccc;}
でつけられます。

「:hover」は、カーソルが上に来た時、「:active」はリンクがクリックされた時というセレクタになります。
その前に付いている「a」というのは、ごく簡単に言うと、リンクの事を指します。
上のようにする事で、リンクをクリックした時だけ影をつけることができます。
厳密には、a:hoverとa:activeは違いますが、スマホなどからだと、ほぼ同じように見えるので、私はまとめて設定しています。

text-shadowは、左から、「影の左方向のずれる幅」、「影の下方向のずれる幅」、「影のぼかし具合」となっています。
カラーコードとかも変えると雰囲気も変えられます。

詳しくはCSS辞典に載っているのでそちらを確認してみてください！
返信遅くなってしまってすみません。
他にも何かあればお聞きください〜

em7
違反報告リンク