Search Bloguru posts

こんにちは。紫のバラの人です。

https://en.bloguru.com/love

🌹マニュアル🌹WEB🌎HTML🌎フッター

thread
■基本


< div class="footer" >-----------------------フッターの部分をやる。
< div class="footer-logo" >Progate< /div >----ロゴの部分はProgate
< div class="footer-list" >-----------------リストの部分は次の通り
< ul>-------------------------------------unorderdlist(順序無関係のリスト)
< li >会社概要< /li >
  < li >採用< /li >
  < li >お問い合わせ/li >
< /ul >------------------------------------listの内容終わり
< /div >------------------------------------listの部分終わり
< /div >-------------------------------------フッターの部分終わり





--------------------

■そのままだと縦に並ぶ

Progate
会社概要
採用
お問い合わせ



■アレンジ1)リストを横並びにしたい

Progate 会社概要 採用 お問い合わせ


li{
float: right;------------listの要素を右に横並びになる
}

■アレンジ2)ロゴは左寄せ、リストは右寄せにしたい

Progate            会社概要
                採用
                お問い合わせ

左端に配置したい「footer-logo」にはfloat: left;を、
右端に配置したい「footer-list」にはfloat: right;を指定

---------------

一般的には
< header >< /header >
< footer >< /footer >



#html #フッター #マニュアル

People Who Wowed This Post

  • If you are a bloguru member, please login.
    Login
  • If you are not a bloguru member, you may request a free account here:
    Request Account
* indicates required fields
  • Comments must be approved before they are displayed

🙂 Using emojis in your blog:
• Keyboard shortcuts: For Mac, press [Ctrl + Cmd + Space]; for Windows, press [ Windows Key + . ]
• Copy and paste: Find a list of emojis and paste them into the text field.
  • none
  • center
  • left
  • right
If checked, your avatar will be displayed
Captcha
Happy
Sad
Surprise