HTML&CSS研究
どりーみー
Author:Dreamy
気に入った事はとことんやってしまいます。
ほどほどにしたいものデス。ヾ(´▽`*)ゝ
カテゴリー
カレンダー |
12
| 2015/01 |
02
日 |
月 |
火 |
水 |
木 |
金 |
土 |
- |
- |
- |
- |
1 |
2 |
3 |
4 |
5 |
6 |
7 |
8 |
9 |
10 |
11 |
12 |
13 |
14 |
15 |
16 |
17 |
18 |
19 |
20 |
21 |
22 |
23 |
24 |
25 |
26 |
27 |
28 |
29 |
30 |
31 |
|
ページ全体を自動スクロール
昔作ったホームページで空から降りてくる女の子がずっと下の方まで行くというのがなぜか動かなくなっていました。きょう、直そうとしたら、どうやったのか全く分からなくなっていました。四苦八苦の末やっと直せました。ほんとにこれは書き留めておかなくてはなりません。ページ全体を自動スクロールさせる方法です。HEADタグの中に<SCRIPT LANGUAGE="JavaScript"><!--var count = 0;var max = 100;function autoScroll()...
.
2015/01/26/javascript
Read More
すごいやつ display
cssにおいてdisplayを使うといろいろとすごいことが起きる。display:block;1.これだと確実に改行されます。2.aに設定すると 文字だけではなく全体がクリック可能に3.そしてコンテンツの表示それに対しdisplay: none;では非表示使い方としては@media screen and (max-width: 960px) {}@media screen and (max-width: 360px) {}などとウインドウの幅を設定するスタイルシートで960pxでは表示 360pxでは非表示。またはそ...
.
2015/01/24/css2
Read More
3カラムでウィンドウの幅が狭くなると左右のメニューがプルダウンメニューに変わる
DEMOは←こちらPC表示サイズのカラムが崩れる幅 960pxが切れるときブルタウンメニューにしました。ブルタウンメニューの幅はMOBILE用に310pxにしてみました。いかがでしょうか?2015年1月19日現在表示の当blog ではさらに1200pxの表示まで設定してあります。jQueryscriptはheadのなかに貼ります。<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script> <...
.
2015/01/19/javascript
Read More
phpで作る簡易掲示板
phpの使えるサーバーでは簡易掲示板が各ページに設置できます。ページの好きなところへ<form method="POST" action="/pinkbaby/index.php">お名前<input type="text" name="personal_name"><br>コメント<textarea name="contents" rows="3" cols="30"></textarea><br><input type="submit" name="btn1" value="投稿する"></form>と書きます。ページの拡張子は 「.php」とします...
.
2015/01/15/php
Read More
ホームページ作成その1 初めてホームページを作るにはメモ帳から始めます
私の環境はInternet Explorer11 (インターネット エクスプローラー11)windows8.1です。先ず、メニューからメモ帳を選びます。<html></html>と書きます。htmlとは HyperText Markup Language(ハイパーテキスト マークアップ ランゲージ)の略語だそうです。意味はウェブページ記述のためのマークアップ言語。とのこと。ちょっとわからないけど、まぁ良いですよね。<html>で始まり「/」を付けた</html>...
.
2015/01/14/HTML作成の基礎
Read More
TABLEを重ねてすっきりした掛け線風なTABLEを作る
TABLEを作る時TABLE border とすると左のようなTABLEができます。なぜか線が二重になっています。先日少しTABLEをいじっているとき、TABLEの中にまたTABLEと訳が分かりませんでしたが、その訳の一つがわかりました。TABLEを重ねることによって最初のTABLEの背景が視覚的に見えることになるんだそうです。二重のTABLE My Blog いつつば検索エンジン Yahoo!,Google 見える線の太さを調整するために中側のTABLEに 「cellpadding="10...
.
2015/01/12/table
Read More
横並びのDIVはウインドウサイズで変化
tebleタグでは「width:100%;」など指定が必要ですがDIVタグ では[float:left;]で横並びさせているのに、ウィンドウサイズが狭くなれば、ひとりでに縦並びになるようです。DEMO12345HTML<div class="box">1</div><div class="box2">2</div><div class="box">3</div><div class="box2">4</div><div class="box">5</div><br clear=left>CSSはdiv.box {float: lef...
.
2015/01/09/css2
Read More
ウインドウサイズに合わせたTABLE、max-widthも指定
以前はTABLEタグを使ってホームページを作ったこともありましたが、近年はDIVタグを使うことがほとんどなんです。ところが既存のショッピングカートをウインドウサイズに合わせたものにしようと思ったら、TABLEの中にTABLE、またその中にTABLEまたその中にもTABLEと際限なくTABLEが作られていて参りました。私も作ったことは有るので解るのですが、作るときは割と簡単なのですよね。できているT...
.
2015/01/07/table
Read More
リンク文字の背景領域でもクリック可能にする
エントリータイトルなどリンクの文字だけではなく背景も含めてクリックできるようにするにはHTML<h2>エントリータイトル</h2>CSSh2 {font-size:20px;}h2 a{display:block;border-left: 20px solid #ccc;border-bottom: 1px solid #ccc;border-right: 1px solid #ccc;border-top: 1px solid #ccc;background: #f0f8ff;padding: 10px;}DEMO水色のところ全体がクリックできるDEMO エントリータイトル DEMO...
.
2015/01/03/css2
Read More
どりーみー(12/19)
どりーみー(10/11)
りんご(10/10)
どりーみー(10/03)
りんご(10/03)