CSS知らん。でもAIに聞いたら、それっぽいブログができた話。

ブログ立ち上げました。

いい感じ。……のはずだった。

でも、ふと思った。

どうも、SHIRAN.CODER（しらんこーだー）のシランです。

「コードは知らない。でも、作れる。」が信条です。

普段PCでサイトいじったりしてますが、CSSはあやしい。

classとかidとかmarginとかpaddingとか、言葉の圧が強い。

でもですね、せっかく始めるなら、“自分っぽい見た目”にしたかったんです。

で、ChatGPTにこう聞いてみたんですよ。

そしたら返ってきたのが、

「以下のCSSを追加してください。」

……それっぽいコード、爆誕。

👾 でも、やってみたら地味に地獄だった。

サイドバーの色が変わらない...。どこのこと？、効いてるの。

あれ？背景変わってる？変わってない？“CSSあるある”が炸裂。

もうツッコミどころ満載。

ChatGPTは平然とCSS出してくるけど、タグとかクラスが違う。

この時点で、心の中で

「お前、現場見てないやろ」って心の中で叫んだのは内緒です。

💡 解決その①：HTMLは“部分”じゃなくて“親ごと”渡す！

「サイドバーのここだけ変えたい」って、その部分のHTMLだけをAIに渡しても、全体の構造が見えないと勝手に想像で書いてくるんですよ。

まるで“俺の考えた最強のCSS”みたいに。

→ サイドバーなら、サイドバー全体のHTMLを渡すと良い感じになった！

📸 解決その②：もう画像見せたほうが早いわ。

「そこじゃないってば！」

「いや、だから文字じゃなくて背景の方！」

……みたいなすれ違いを5往復ぐらいして、もうお手上げ。

いよいよ分かってもらえなくて、スクショ撮って、赤丸ぐるぐる付けて渡しました。

そしたら、まさかの完・全・理解。

「AI、もしかして目ある？」って思った瞬間です。

🐌 問題その③：コード増えすぎてAIが重くなる…

「あ、やっぱさっきのコードの上に追加で」

「いや、むしろ最初に戻って」

「てか、もう一回最初から…」

みたいなことを連続でお願いしてたら、AIくんの反応がどんどんトロくなっていって、ついにバグったっぽく無反応に。

🧹 対策：ChatGPTに“まとめてもらって”から、新スレッドに移る！

「AIくん、ちょっと重くなってきたから新しい部屋（スレッド）行こ」ってことで、

新しいスレッドに移りたいので、これまでの流れを簡単にまとめてください。

って入力したら、ちゃんと時系列で箇条書きしてくれた。

優秀かよ。

🎉 Before → After（達成感）

最初はこんなだったブログが……

完成後、意味もなく5回くらいF5押して眺めてました。

自分のブログにドヤ顔してたのは内緒です。

🧠 今日のハイライトはこれやった。

• CSS知らんでも、“伝え方”を工夫すればAIが助けてくれる
• HTMLは広めに渡すべし
• 困ったら、スクショに赤丸 ← 神
• ChatGPT重くなったら、“まとめて！”で解決

作れなくてもいい。伝えられれば、作ってもらえる。

🚀 …ってことで、最後に一言だけ残しておきますね。

「知らんけど、作れた」って、思ってた以上に気持ちよかったんです。

不安もあったけど、“自分にもできた”って実感が、一番うれしかった。

もしあなたも、「やってみたい」って少しでも思ったなら、それだけで、もう十分スタートラインに立ってます。

無理に完璧を目指さなくていい。

一緒に“なんか便利で、おもろいやつ”を作っていきましょ。