高校生のためのWeb制作講座

高校生のためのWeb制作講座 29 サーバ編 7 XFREE WordPress利用設定(2)

 

SSLの設定はできませんでした。
 WordPress管理画面[ブログ管理ツール]のパスワード設定を行う。

  • 2020.03.30 Monday
  • 22:23

高校生のためのWeb制作講座

高校生のためのWeb制作講座 28 サーバ編 6 XFREE WordPress利用設定

 

必要なデータは忘れないようにメモを残す
管理ユーザ:     wordpr
ブログURL:     http://okmrtmo.wp.xdomain.jp/
パスワード:     
[ブログ管理ツール] http://okmrtmo.wp.xdomain.jp/wp-admin/ 

  • 2020.03.29 Sunday
  • 22:42

高校生のためのWeb制作講座

高校生のためのWeb制作講座 27 HTML編 17 中央揃え

 

<body background="gz/bac.gif">
<center>
<!--  <div style="text-align:center">  -->
<p><img src="gz/tp2.jpg" width="50%" style="border:double 7px #ff0000"></P>
<h1>皆さんの力でWeb制作</h1>
<p>一人ひとりの力を出し合い、Web制作のサイトを作りましょう。</p>
<h2>工事中</h2>
<!-- </div>  -->
</center> 
</body>

<center>〜</center>
<div style="text-align:center">〜</div>

text-align(アライン):行揃えの位置や均等割付の形式を指定
div(ディヴィジョン ※divisionの略):分割 囲った部分をブロック要素としてまとめて扱うことができる

  • 2020.03.28 Saturday
  • 17:35

高校生のためのWeb制作講座

高校生のためのWeb制作講座 25 FTP編 2 新規ホスト作成

 

FTPソフトの設定に最低限必要な情報
ホスト名
ユーザー名
パスワード

FTPホスト    sv3.html.xdomain.ne.jp
FTPユーザー    【アカウント名】okmrtmo.html.xdomain.jp
FTPパスワード    【アカウント名のパスワード】

  • 2020.03.24 Tuesday
  • 20:49

高校生のためのWeb制作講座

高校生のためのWeb制作講座 21 サーバー編 3 XFREE管理パネルの表示

 

お気に入り(ブックマーク)
XFREEのホームページ

ログイン 登録したメールアドレス
     登録したパスワード
 

  • 2020.03.23 Monday
  • 16:21

高校生のためのWeb制作講座

高校生のためのWeb制作講座 20サーバー編 2 XFREEの申し込み方法

 

申し込みにはメール、パソコン?が必要

方法
XFREE 検索 XFREEホームページ
無料レンタルサーバー新規お申し込み
メールのアドレス入力 確認メールを送信
メールを確認 お申し込みURL   登録情報を入力
ログイン サーバID入力:半角英数字で
サーバIDの確認 XFREE管理パネル
 

  • 2020.03.22 Sunday
  • 22:16

高校生のためのWeb制作講座

高校生のためのWeb制作講座 19サーバー編 1 XFREEサーバとは

 

サーバー:ホームページを表示するために必要となる情報を格納しておく場所のことです。格納しておく情報は、色々な言語でエディターで作ることが出ます。また、言語が分からなくて作れるソフトがあります。その中でも現在最も使われていると思われるのがWordPressです。このWordPressの使い方を覚えるためには下の様なサーバーが必要になります。

*自宅サーバー
 XAMPP
*無料レンタルサーバー
 XFREEサーバ 
*有料レンタルサーバー            
 エックスサーバー
 ロリコップサーバー

 

  • 2020.03.22 Sunday
  • 15:11

高校生のためのWeb制作講座

高校生のためのWeb制作講座18 HTML編 17 画像に枠をつける

 

<body background="gz/bac.gif">
<br>
<p align="center" ><img src="gz/tp1.jpg" ></P>
<p align="center" ><img src="gz/tp2.jpg" ></P><br>

<p align="center" ><img src="gz/tp2.jpg" width="50%" border="1" ></P>
<p align="center" ><img src="gz/tp2.jpg" width="50%" style="border:solid 7px #000000"></P>
<p align="center" ><img src="gz/tp2.jpg" width="50%" style="border:double 7px #ff0000"></P>
<p align="center" ><img src="gz/tp2.jpg" width="50%" style="border:outset 17px #00ff00"></P>
<p align="center" ><img src="gz/tp2.jpg" width="50%" style="border:inset 17px #00ff00"></P>
</body>


実線    solid    
点線    dotted    
破線    dashed    
二重線    double    
内側が凹形    inset    
内側が凸形    outset    
線が凹形    groove    
線が凸形    ridge    
 

  • 2020.03.20 Friday
  • 15:32

高校生のためのWeb制作講座

高校生のためのWeb制作講座17 HTML編 16 画像の大きさを変える(2)大きさ指定

 

<body background="gz/bac.gif">
<br>
<p align="center" ><img src="gz/tp1.jpg" ></P>
<p align="center" ><img src="gz/tp2.jpg" ></P><br>

<p align="center" ><img src="gz/tp2.jpg" width="1280" height="228" ></P>
<p align="center" ><img src="gz/tp2.jpg" width="1280" height="114" ></P><br>

<p align="center" ><img src="gz/tp1.jpg" width="100%" ></P>
<p align="center" ><img src="gz/tp1.jpg" width="50%" ></P>
<p align="center" ><img src="gz/tp2.jpg" width="50%" ></P>


<img src="" width="ピクセル値" height="ピクセル値">
<img src="" width="%値" height="%値">

width:幅   height:高さ
 

  • 2020.03.19 Thursday
  • 17:21

高校生のためのWeb制作講座

高校生のためのWeb制作講座16 HTML編 16画像の大きさを変える(1)ファイルの大きさ

 

<body background="gz/bac.gif">
<br>
<p align="center" ><img src="gz/tp1.jpg" ></P>
<p align="center" ><img src="gz/tp2.jpg" ></P>

tp1.jpg  1280×228ピクセル
tp2.jpg  640×114ピクセル

解像度:ディスプレイは画素(ピクセル、pixel)と呼ばれる小さな点を縦横に並べ、それらの点を別々に制御することで画面を表示しています。1280×1024ならば、横に1280、縦に1024の画素(ピクセル)があります。掛け合わせたものが画面上の総画素数になります。
一般的に、解像度が大きいほうが表示できる画面領域も大きくなります。

本来の解像度:ppi 一インチ内のピクセル数
解像度 Windows:96ppi
        Mac:72ppi
    印刷用:200から300ppi

  • 2020.03.18 Wednesday
  • 21:58