先週から制作の仕事依頼が2件入って、自分の仕事は最低限に済ませて制作に時間を費やしています。
もう最初の依頼から10年以上たっており、いい加減レスポンシブデザインに変更しなければいけないなーと思ってました。
1件はコンテンツ内容が100ページ以上あり、一度サイトの見直しをしたいとのことで保留。もう1件はぜひということで今製作中です。
制作の仕事は起業当初から仕入れの資金にするため、知人の依頼のみ受けてやっています。実は過去に実務経験がなく、ただPC詳しいというだけで依頼をされ受けて今までやってきました。気づけば10年以上たってました。
価格の高い依頼が入ったときは、オリジナル商品が試せます。今回は、先月の赤字埋め…。でもちょっとだけ使えるかもくらいです。
今回は先日本格的にはじめたXDを早速使っています。
形だけでも先にほしいと3日前に言われ、とても制作して渡せないのでXDを使いました。
内容はぼかしますが、ダミーを使ってですがあっという間に枠組みができました。
とりあえずやったことがない技術も入れ込んでみたり！
デザインは苦手なので先方に確認しながらにはなりそうです。
今日は早速、Boostrapで背景画像に文字を入れてみました。
Bootstrap制作は今まで自分の会社のサイトを作っただけです…。
なので今回のこの背景画像への文字入れははじめて。
若干古い記事になりますが、これでできました。
この方は文字がセンタリングされていたので、左寄せに変更。あと見出し追加。
<div class="cover-text text-left">背景は雲の画像です。
PC
スマホ
ちゃんとハンバーガーメニューと文字も画像も改行された！
できました！
最初CSSでやったらできなかったので、
「Bootstrap 背景画像に文字」
と検索したら上記のページが出てきてカスタマイズしたらできました。
navbar、ハンバーガーメニューは以前から練習してて、今のところエラーなくでいます。
普段Boostrapはできるだけ公式をみるようにしています。しかも英語の方を！
CardとかCarouselとか結構独自？の専門用語が出てくるため、英語で表示しておく方が覚えるかなーって思いました。
dropdownくらいは知っている方も多いと思うのですが、そういった用語で覚えておくと調べるのも早いんです。やりたいことの名称がわからないことが多すぎる。
今回の背景画像に文字入れはimageみても載ってなかったし、なんっていうかわからなかったからググりました。
初めてのプログラムができるとなんかうれしくなります。
引き続き明日も頑張りたいと思います。
