PC環境下でhtmlを作成していると、スマートフォンで見ると文字が小さくなって見づらいです。
SEO対策として、以下２点を記載しておきます。
スマートフォン対応の記述をヘッダに追加
htmlファイルを開きます。
sudo vi /var/www/html/index.html
追加（赤字が追加箇所）
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>初心者からのWEBサーバ構築
<link rel="stylesheet" href="css/style.css">
</head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>初心者からのWEBサーバ構築
<link rel="stylesheet" href="css/style.css">
</head>
レスポンシブ対応
cssファイルを開きます。
sudo vi /var/www/html/css/style.css
1.横幅指定を100%にする。
変更（赤字が変更箇所）
body{
text-align:center;
background-color:#f0f0f0;
}
#main{
width:100%;
background-color:#ffffff;
float:left;
}
text-align:center;
background-color:#f0f0f0;
}
#main{
width:100%;
background-color:#ffffff;
float:left;
}
2.画面幅の判定文を入れる。スマートフォンの横幅を640pxとする。
追加（赤字が追加箇所）
/* 画面幅が狭いとき(スマホ対応) */
@media screen and (max-width: 640px) {
#main{
width:100%;
float:left;
background-color:#ffffff;
}
}
@media screen and (max-width: 640px) {
#main{
width:100%;
float:left;
background-color:#ffffff;
}
}
