HTMLとCSSの深い沼・・・

当事務所のHPは、元国家公務員の超アナログ税理士が市販の本とインターネットの情報だけを頼りに少しづつ進化(していると思う)HPです。

しかし、そこは素人。

全てを自分の手で作るのは所詮無理な事なので「WordPress」とWordPressの無料テーマ「Cocoon」のチカラをお借りしています。

アフィリエイトにも挑戦しましたが、今はやっていません。

HTMLとCSS

Cocoonを使っていれば大概の事はできたのですが、だんだん欲が出てきてもっと良いHPが作りたいと思うように。

そこで避けては通れないのが「HTMLとCSS」です。

HTML

HTMLとは、Hyper Text Markup Language(ハイパーテキスト・マークアップ・ランゲージ)の略で、Webページを作るための最も基本的なマークアップ言語のひとつです。

CSS

CSS(Cascading Style Sheets、カスケーディング・スタイル・シート)とは、ウェブページのスタイルを指定するための言語です。

私のようなド素人では、自分でHTMLとCSSを書き込むことはできません。

したがって、いくつのもHPを回り「これだ!」と思うものをコピー&ペーストしています。

ちなみに、上の囲み枠もお世話になっているブログからコピー&ペーストです。

CSSの修正が難しい!?

必要に応じてCSSを加工してサイズや色を変えるのですが、CSSの本質的な部分を理解していないので上手くできません。

例えば・・・

BUTTON

このボタン。以下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台欲しいです。

コメント