HTMLとCSSの深い沼・・・
当事務所のHPは、元国家公務員の超アナログ税理士が市販の本とインターネットの情報だけを頼りに少しづつ進化(していると思う)HPです。
しかし、そこは素人。
全てを自分の手で作るのは所詮無理な事なので「WordPress」とWordPressの無料テーマ「Cocoon」のチカラをお借りしています。
アフィリエイトにも挑戦しましたが、今はやっていません。
目次
HTMLとCSS
Cocoonを使っていれば大概の事はできたのですが、だんだん欲が出てきてもっと良いHPが作りたいと思うように。
そこで避けては通れないのが「HTMLとCSS」です。
HTMLとは、Hyper Text Markup Language(ハイパーテキスト・マークアップ・ランゲージ)の略で、Webページを作るための最も基本的なマークアップ言語のひとつです。
CSS(Cascading Style Sheets、カスケーディング・スタイル・シート)とは、ウェブページのスタイルを指定するための言語です。
私のようなド素人では、自分でHTMLとCSSを書き込むことはできません。
したがって、いくつのもHPを回り「これだ!」と思うものをコピー&ペーストしています。
ちなみに、上の囲み枠もお世話になっているブログからコピー&ペーストです。
CSSの修正が難しい!?
必要に応じてCSSを加工してサイズや色を変えるのですが、CSSの本質的な部分を理解していないので上手くできません。
例えば・・・
このボタン。以下CSSです。
.btn-circle-border-double {
display: inline-block;
text-decoration: none;
color: #668ad8;
width: 120px;
height: 120px;
line-height: 120px;
border-radius: 50%;
border: double 4px #668ad8;
text-align: center;
overflow: hidden;
transition: .6s;
}
.btn-circle-border-double:hover {
-webkit-transform: rotateY(360deg);
transform: rotateY(360deg);
}
CSSでサイズと色は変えられたんですけど、中の文字が反転した後の文字の色「赤」がどうしても変えられません。
あと、ボタンの位置をベージの中央にもっていきたいのですが、それもできません。
まとめ
HTMLとCSSを探していると「こんな事もできるだ!」という新しい発見が沢山あります。
が、ものすごく奥が深くて沼のよう。
上手に使いこなすことはできないですが・・・いつかは自慢できるようなHPにしたいと思う今日この頃。
まずは、リンクボタンを使ってHPを更新してみようと思います。
【編集後記】
ディスプレイがもう1台欲しいです。