display:noneとtransparentの違い

ウェブサイト上で表示される記事や画像は、ＨＴＭＬ上に記述を置いて、
ＣＳＳ指定でサイズや位置が指示されサイト上に現れます

さらに言えば、見出しとか、borderなどのＨＴＭＬ関連の表示されるものを
指して事情により非表示とする場合は、ＨＴＭＬ記述そのものを削除すれば、
存在そのものが消え去ります

しかし、再度使うかもしれないなどとする場合、見えなくする（隠す）ということも

削除したためにどこかが、レイアウトを含めてずれが出るなどの場合、
ＣＳＳ記述で表示をしない、
もしくはＨＴＭＬ表示記述はそのままにして存在そのものを透明化する
という手段を用いることができます

非表示を指示する記述コード

display:none
表示しないの指示が一般的な理解で、指定した場合そのものが存在しないと
判断される

使用する項目は、表示をする記述コード　display: block;をdisplay:noneに
書き換える

display: blockで表示を指示していない箇所で表示されている場合も
ありますが、その場合は、HTMLに表示物が置いてあるので、記載なしでも
サイズ指定などしている項目内に追加します

透明化を指示する記述コード

transparent
表示を消す、存在はするものの姿を見ない、透明にしてしまうですね
構築上、その隙間を残しておきたいなどと思われるならこちらが
適合します

こちらの透明化記述は、HTML内でも反映されます

例　フォント
ウェブ記事......という文字が見えますね

こちらでは.......
カラーコードを　transparent　に書き換えると透明化するので認識できなく
なります
（ソースでは記述が確認できます）

ウェブ記事......という文字が見えませんね

結果、見た目は同じでも、中身が違うとご判断願います