Commit f0ae943d authored by YukiOtake's avatar YukiOtake

Initial commit

parents
File added
@charset "UTF-8";
/*縦横box css*/
div#tateyoko{
height: 300px;
width: 300px;
}
/*padding,margin css*/
div#pad{
padding: 10px 20px;
margin-left: 30px;
}
/*border css*/
div#sen{
border: 3px dotted #FA5882;
padding: 3px 5px;
margin: 10px;
}
/*float css*/
img#kizuna{
height: 300px;
width: 300px; float: left;
/*float: left or right;*/
}
/*clearfix css*/
/*
.clearfix{
zoom: 1;
}
.clearfix:after{
content: "";
display: block;
clear: both;
}
*/
/*--------------------------------------------------*/
/*以下気にせず*/
body{
background-color: black;
}
h1#title{
font-family: "メイリオ";
font-size: 40px;
color: blue;
text-align: center;
}
h2.sub{
color: azure;
}
p#name{
font-size: 20px;
color: #0174DF;
}
div.white{
background-color: white;
}
div#fl{
padding: 3px 5px;
margin: 10px;
}
\ No newline at end of file
/* style.css */
@charset "UTF-8";
body{
background-color: #0B2161;
}
h1#title{
font-family: "メイリオ";
font-size: 40px;
color: #EFF8FB;
text-align: center;
}
p{
color: white;
}
p#name{
font-size: 20px;
color: #0174DF;
}
h1#subject{
color: #00FFFF;
}
h2.danraku{
color: #0174DF;
text-align: center;
}
\ No newline at end of file
/* style.css */
@charset "UTF-8";
body{
background-color: #0B2161;
}
h1#title{
font-family: "メイリオ";
font-size: 40px;
color: #EFF8FB;
text-align: center;
}
p#name{
font-size: 20px;
color: #0174DF;
}
h1#subject{
color: #00FFFF;
}
h2.danraku{
color: #0174DF;
text-align: center;
}
div#box_1{
background-color: #FFF;
color: #FE2E2E;
}
div#box_2{
background-color: #FFF;
color: #088A29;
}
\ No newline at end of file
/* style.css */
@charset "UTF-8";
body{
background-color: #0B2161;
}
h1#title{
font-family: "メイリオ";
font-size: 40px;
color: #EFF8FB;
text-align: center;
}
p#name{
font-size: 20px;
color: #0174DF;
}
h1#subject{
color: #00FFFF;
}
h2.danraku{
color: #0174DF;
text-align: center;
}
section#bun{
width: 1200px;
margin: 0 auto;
padding: 15px 50px;
background-color: #585858;
}
div#box_1{
float: left;
width: 500px;
padding-left: 30px;
padding-right: 30px;
background-color: aliceblue;
color: #FE2E2E;
}
div#box_2{
float: right;
width: 500px;
padding-left: 30px;
padding-right: 30px;
background-color: aliceblue;
color: #088A29;
}
.clearfix{
zoom: 1;
}
.clearfix:after{
content: "";
display: block;
clear: both;
}
\ No newline at end of file
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Hello html</title>
<meta name = "keywords" content ="課題,演習,日本大学">
    <meta name = "description" content ="授業中の演習課題です">
<link rel="icon" href="favicon.ico">
<link rel="stylesheet" href="css/ex.css">
</head>
<body>
<h1 id="title">Hello HTML!</h1>
<hr>
<p id="name">第4回HTML講習会(ブロック要素編)</p>
<hr>
<!--縦横大きさを自由にいじってみよう-->
<h2 class="sub">height,width</h2>
<div id="tateyoko" class="white">
<p>縦横大きさを変えてみよう</p>
</div>
<hr>
<!--padding,marginプロパティ-->
<h2 class="sub">padding,marginプロパティ</h2>
<div id="pad" class="white">
<p>色々余白を変えてみよう</p>
</div>
<hr>
<!--borderプロパティ-->
<h2 class="sub">borderプロパティ</h2>
<div id="sen" class="white">
<p>枠線を引いてみよう</p>
</div>
<hr>
<!--floatプロパティ-->
<h2 class="sub">floatプロパティ</h2>
<div id="fl" class="white">
<p><img id="kizuna" src="img/image.jpg" alt="キズナアイって何">
キズナアイ(Kizuna AI)はActiv8株式会社が開発した日本のバーチャルYouTuber。
人工知能(AI)を自称しているが、実際とは異なる。
YouTubeチャンネル「A.I.Channel」と「A.I.Games」を運用しており、
両チャンネル合わせた登録者数は2018年4月現在のべ240万人を超え、
総視聴回数は1億4000万回を超えている。
</p>
</div>
</body>
</html>
\ No newline at end of file
favicon.ico

4.06 KB

// 本来はJavascriptを書きます
\ No newline at end of file
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Hello html</title>
<meta name = "keywords" content ="課題,演習,日本大学">
    <meta name = "description" content ="授業中の演習課題です">
<link rel="icon" href="favicon.ico">
<link rel="stylesheet" href="css/style.css">
</head>
<body>
<h1 id="title">Hello HTML!</h1>
<hr>
<p id="name">第4回HTML講習会(ブロック要素編)</p>
<hr>
<h1 id="subject">吾輩は猫である</h1>
<div id="box_1">
<h2 class="danraku">-段落1-</h2>
<p>&emsp;吾輩わがはいは猫である。名前はまだ無い。<br>
&emsp;どこで生れたかとんと見当けんとうがつかぬ。
何でも薄暗いじめじめした所でニャーニャー泣いていた事だけは記憶している。
吾輩はここで始めて人間というものを見た。
しかもあとで聞くとそれは書生という人間中で一番獰悪どうあくな種族であったそうだ。
この書生というのは時々我々を捕つかまえて煮にて食うという話である。
しかしその当時は何という考もなかったから別段恐しいとも思わなかった。
ただ彼の掌てのひらに載せられてスーと持ち上げられた時何だかフワフワした感じがあったばかりである。
掌の上で少し落ちついて書生の顔を見たのがいわゆる人間というものの見始みはじめであろう。この時妙なものだと思った感じが今でも残っている。
第一毛をもって装飾されべきはずの顔がつるつるしてまるで薬缶やかんだ。その後ご猫にもだいぶ逢あったがこんな片輪かたわには一度も出会でくわした事がない。
のみならず顔の真中があまりに突起している。そうしてその穴の中から時々ぷうぷうと煙けむりを吹く。どうも咽むせぽくて実に弱った。
これが人間の飲む煙草たばこというものである事はようやくこの頃知った。</p>
</div>
<div id="box_2">
<h2 class="danraku">-段落2-</h2>
<p>&emsp;この書生の掌の裏うちでしばらくはよい心持に坐っておったが、しばらくすると非常な速力で運転し始めた。
書生が動くのか自分だけが動くのか分らないが無暗むやみに眼が廻る。胸が悪くなる。
到底とうてい助からないと思っていると、どさりと音がして眼から火が出た。
それまでは記憶しているがあとは何の事やらいくら考え出そうとしても分らない。<br>
&emsp;ふと気が付いて見ると書生はいない。たくさんおった兄弟が一疋ぴきも見えぬ。
肝心かんじんの母親さえ姿を隠してしまった。
その上今いままでの所とは違って無暗むやみに明るい。
眼を明いていられぬくらいだ。はてな何でも容子ようすがおかしいと、のそのそ這はい出して見ると非常に痛い。
吾輩は藁わらの上から急に笹原の中へ棄てられたのである。</p>
</div>
</body>
</html>
\ No newline at end of file
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Hello html</title>
<meta name = "keywords" content ="課題,演習,日本大学">
    <meta name = "description" content ="授業中の演習課題です">
<link rel="icon" href="favicon.ico">
<link rel="stylesheet" href="css/style1.css">
</head>
<body>
<h1 id="title">Hello HTML!</h1>
<hr>
<p id="name">第4回HTML講習会(ブロック要素編)</p>
<hr>
<br>
<section id="bun" class="clearfix">
<h1 id="subject">吾輩は猫である</h1>
<div id="box_1">
<h2 class="danraku">-段落1-</h2>
<p>&emsp;吾輩わがはいは猫である。名前はまだ無い。<br>
&emsp;どこで生れたかとんと見当けんとうがつかぬ。
何でも薄暗いじめじめした所でニャーニャー泣いていた事だけは記憶している。
吾輩はここで始めて人間というものを見た。
しかもあとで聞くとそれは書生という人間中で一番獰悪どうあくな種族であったそうだ。
この書生というのは時々我々を捕つかまえて煮にて食うという話である。
しかしその当時は何という考もなかったから別段恐しいとも思わなかった。
ただ彼の掌てのひらに載せられてスーと持ち上げられた時何だかフワフワした感じがあったばかりである。
掌の上で少し落ちついて書生の顔を見たのがいわゆる人間というものの見始みはじめであろう。この時妙なものだと思った感じが今でも残っている。
第一毛をもって装飾されべきはずの顔がつるつるしてまるで薬缶やかんだ。その後ご猫にもだいぶ逢あったがこんな片輪かたわには一度も出会でくわした事がない。
のみならず顔の真中があまりに突起している。そうしてその穴の中から時々ぷうぷうと煙けむりを吹く。どうも咽むせぽくて実に弱った。
これが人間の飲む煙草たばこというものである事はようやくこの頃知った。</p>
</div>
<div id="box_2">
<h2 class="danraku">-段落2-</h2>
<p>&emsp;この書生の掌の裏うちでしばらくはよい心持に坐っておったが、しばらくすると非常な速力で運転し始めた。
書生が動くのか自分だけが動くのか分らないが無暗むやみに眼が廻る。胸が悪くなる。
到底とうてい助からないと思っていると、どさりと音がして眼から火が出た。
それまでは記憶しているがあとは何の事やらいくら考え出そうとしても分らない。<br>
&emsp;ふと気が付いて見ると書生はいない。たくさんおった兄弟が一疋ぴきも見えぬ。
肝心かんじんの母親さえ姿を隠してしまった。
その上今いままでの所とは違って無暗むやみに明るい。
眼を明いていられぬくらいだ。はてな何でも容子ようすがおかしいと、のそのそ這はい出して見ると非常に痛い。
吾輩は藁わらの上から急に笹原の中へ棄てられたのである。</p>
</div>
</section>
</body>
</html>
\ No newline at end of file
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Hello html</title>
<meta name = "keywords" content ="課題,演習,日本大学">
    <meta name = "description" content ="授業中の演習課題です">
<link rel="icon" href="favicon.ico">
<link rel="stylesheet" href="css/original.css">
</head>
<body>
<h1 id="title">Hello HTML!</h1>
<hr>
<p id="name">第4回HTML講習会(ブロック要素編)</p>
<hr>
<h1 id="subject">吾輩は猫である</h1>
<p>&emsp;吾輩わがはいは猫である。名前はまだ無い。<br>
&emsp;どこで生れたかとんと見当けんとうがつかぬ。
何でも薄暗いじめじめした所でニャーニャー泣いていた事だけは記憶している。
吾輩はここで始めて人間というものを見た。
しかもあとで聞くとそれは書生という人間中で一番獰悪どうあくな種族であったそうだ。
この書生というのは時々我々を捕つかまえて煮にて食うという話である。
しかしその当時は何という考もなかったから別段恐しいとも思わなかった。
ただ彼の掌てのひらに載せられてスーと持ち上げられた時何だかフワフワした感じがあったばかりである。
掌の上で少し落ちついて書生の顔を見たのがいわゆる人間というものの見始みはじめであろう。この時妙なものだと思った感じが今でも残っている。
第一毛をもって装飾されべきはずの顔がつるつるしてまるで薬缶やかんだ。その後ご猫にもだいぶ逢あったがこんな片輪かたわには一度も出会でくわした事がない。
のみならず顔の真中があまりに突起している。そうしてその穴の中から時々ぷうぷうと煙けむりを吹く。どうも咽むせぽくて実に弱った。
これが人間の飲む煙草たばこというものである事はようやくこの頃知った。</p>
<p>&emsp;この書生の掌の裏うちでしばらくはよい心持に坐っておったが、しばらくすると非常な速力で運転し始めた。
書生が動くのか自分だけが動くのか分らないが無暗むやみに眼が廻る。胸が悪くなる。
到底とうてい助からないと思っていると、どさりと音がして眼から火が出た。
それまでは記憶しているがあとは何の事やらいくら考え出そうとしても分らない。<br>
&emsp;ふと気が付いて見ると書生はいない。たくさんおった兄弟が一疋ぴきも見えぬ。
肝心かんじんの母親さえ姿を隠してしまった。
その上今いままでの所とは違って無暗むやみに明るい。
眼を明いていられぬくらいだ。はてな何でも容子ようすがおかしいと、のそのそ這はい出して見ると非常に痛い。
吾輩は藁わらの上から急に笹原の中へ棄てられたのである。</p>
</body>
</html>
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment