Now Loading...

スタッフブログ

戻る

当社ブログは社員での持ち回りで掲載しております。
ビジネスだけではなく、社内イベント、プライベートなことを書いておりますので予めご承知おきください。

ロードバイク:5ヶ月目レビュー

こんにちは、さいとうです。

気がつけば9月!
今年は夏の暑さが前倒しでやってきたので、お盆過ぎにはもう涼しかった印象です。
イマイチ「夏」を満喫した実感がないですね。
もうちょっと「暑い夏」を楽しみたかったなーと思います。

楽しいよ!ロードバイク楽しいよ!

IMG_1510

前回、ロードバイクを買ったーという話を書きましたが、
購入後、雨の日と用事があった日以外の週末は、だいたいロードバイクでどこかへ行きました。
・豊平川河川敷
・白石〜厚別〜北広島のサイクリングロード
・滝野すずらん丘陵公園
・えこりん村(恵庭)
・小樽
羊蹄山一周(参加してくれたみんな、アリガトウ!)
・定山渓〜定山渓レイクライン〜小樽〜石狩
・定山渓〜中山峠〜支笏湖〜札幌(昇天コースw)
などなど、、、

ロードバイクを約5ヶ月乗ってみて、思いのほか身心に変化があったなーと感じます。

お腹周りがスッキリ!食べても食べても太らない!

お腹の周りについていた、なんとなく恥ずかしいポヨっとしたお肉が最近少なくなった気がします。
乗る日によっては半日くらい漕ぎ続けているので、当たり前といえば当たり前なんですけどね。

ロードバイクで出かけると、目的地に着く前にたびたび休憩して食べ物を食べるのですが、
食べても食べてもエネルギーとして使ってしまうので、全然太りません。
「美味しいもの食べたいけど、太っちゃうのは嫌だなー」と思っている方、ロードバイクはオススメですよ。
近郊の美味しいお店を巡るグルメツアーを計画しても楽しいです。

1日漕いでも筋肉痛にはなりにくい!

競輪選手みたいによっぽどペダルを踏みしめてスピードを出さない限り、
次の日に響くような筋肉痛には不思議と襲われません。
走ったその日に、骨に近い筋肉(インナーマッスル?)がじんわりするくらいです。

もちろん、筋肉を使っていないわけではないので、
太もも、もも裏、ふくらはぎ、お尻周りと筋肉が張って固くなってきます。
日頃からよくマッサージやストレッチをするように心掛けています。

春に乗り始めた頃はズボンの太ももがきつくなるかもなーと思いましたが、
今のところ全然そんなことはありませんでした。
むしろ、直立するとひざの間が1cmくらい空いていて微妙なO脚だったのですが、
なんと、今は膝がびったりくっつくようになりました!

気持ちが前向きになる!

単純に体を動かしているからかもしれませんが、やる気が少しアップした気がします。
休日になんとなくダラダラしてたら夜になっちゃったみたいなことがなくなりました。

知らない道を走って景色をみたり、
長〜い坂道を太ももをプルプルさせながら登ったり、
逆に下り坂では自動車並みの速度で風を感じながら下ったり、
ただ自転車に乗っているだけなのに非日常感があって、
自然とリフレッシュできてるのかなーと感じます。

———-

ロードバイクを始めたときに目標だった札幌〜旭川帰省や、
自転車ソロキャンプは来年にお預けになりそうですが、
それでも1日の走行距離が160kmオーバーを達成したり(定山渓〜中山峠〜支笏湖コース)、
みんなと自転車を車に積んで出かけたり(羊蹄山一周コース)、
たくさんの楽しい経験ができました。
ロードバイク初年度としては、まずまず充実したシーズンだと思います。

北海道はあと2ヶ月もすると、自転車には乗れない季節になってしまいますが、
今シーズン、もう一回みんなで出かけたいと思って、いろいろ計画中です。
(羊蹄山の次は、秋の洞爺湖一周ツアーを検討中!)
 
 
 
 
 
忘れてました。
今回のニッチはCSSコーナーで、連続するインライン化した要素の間にできる隙間を消す方法です。
え?何言ってるかわからない?

連続するインライン化した要素の間にできる隙間を消す方法

例えば、こんな感じのリストがあったとして、

[HTML]
<ul>
  <li>おはよう</li>
  <li>こんにちは</li>
  <li>こんばんは</li>
</ul>

CSSの ”display: inline-block;” を使って、これを横並びにしたとします。

[CSS]
ul {
  list-style: none;
}
ul li {
  display: inline-block;
  backbround-color: #ddd;
}

わかりやすいように、li要素に背景色をつけました。
すると、こんな風に表示されると思います。

cap_01

ね? <li>要素の間にほんの少し隙間ができるでしょ?
この隙間を消して、こんな風に隙間を無くしたいと思います。

cap_02

方法はいくつかあります。
 

(1)CSSでインライン化をやめてfloatする

[CSS]
ul {
  overflow: hidden;
  list-style: none;
}
ul li {
  float: left;
  backbround-color: #ddd;
}

横に並べる方法を問わないのであれば、この方法が手っ取り早いです。
<li>がフロートしたことにより、<ul>の領域が確保できないので
<ul>に ”overflow:hidden;” を当てています。
ちょっと前でいうところの ”clearfix” ってやつですね。
 

(2)HTMLで<li>タグの間に改行を入れない

[HTML]
<ul>
  <li>おはよう</li><li>こんにちは</li><li>こんばんは</li>
</ul>

こんな方法でも、隙間は消えます。
一列に並べると可読性が・・・という方は、

[HTML]
<ul>
  <li>おはよう</li><!--
  --><li>こんにちは</li><!--
  --><li>こんばんは</li>
</ul>

こんなふうに</li>と次の<li>をHTMLのコメントタグで隠すようにしてあげれば
改行しても隙間は消えます。

さて、様々な制約で(1)、(2)の方法が使えない時、
これから紹介する第3の方法でも対応できます。
 

(3)<ul>要素のフォントサイズを ”0” にする

どうもこの隙間って、<li>要素と要素の間の改行が関係しているようです。
(2)であれ?と思った方は鋭いです。
そこで、CSSで<ul>要素のフォントサイズを ”0” にしてみます。

[CSS]
ul {
  list-style: none;
  font-size: 0;
}
ul li {
  display: inline-block;
  backbround-color: #ddd;
}

どうですか?隙間は消えましたか!
でも文字も消えてしまいましたねw
<li>要素のフォントサイズを元に戻します。

[CSS]
ul {
  list-style: none;
  font-size: 0;
}
ul li {
  display: inline-block;
  backbround-color: #ddd;
  font-size: 16px;
}

フォントの大きさの変更だけで、隙間をなくすことができました。
あまり使う機会があるかというと微妙ですが、機会があればお試しあれ。

さいとう

その他の記事

記事一覧

BitStar流

Contact Us

ご不明な点や、気になったことなど、
お気軽にお問い合わせください。

お問い合わせ

Recruit

新卒採用、中途採用、エンジニア採用、
デザイナー採用を行っています。

採用情報