Search

Recent Posts
[All]

→and more...

Recent Comments

Categories

Statistics

  • レンダリング時間: 0.297 秒

Archives

Links

QR Code

QRコード
http://xirasaya.com
  • valid_html
  • valic_xhtml
  • valid_css
  • valid_css
top > posts > categories

CATEGORY "HTML・JS・CSS"

(35 件中 1 件目〜 5 件目を表示中)
1234567next>>

マトリックス風な画面を動的に生成するページ

Category HTML・JS・CSS

Posted on 2016/01/22 (金) 18:23 By xirasaya
マトリックス風な画面をHTML、Javascript、CSSのみで作ることができる。

ページにアクセスするだけでこのように文字が流れる。



本家にいくと余計なゴミが表示されてしまうので該当コード部分のみのページを用意した。
■マトリックス風な画面のページ
http://xirasaya.com/demo/15/

うまく画面が表示されない場合は別のブラウザで試すこと。
自分の環境ではIEだとJavasエラーが発生してうまく動かなかったがFirefoxとChromeではうまく動いた。



■マトリックス風なページのコード

<body style=...
...
...
read more >>>

Read More     Comments(0)

[CSS]checkboxとテキストの位置がずれるのを直す

Category HTML・JS・CSS

Posted on 2015/12/14 (月) 16:15 By xirasaya
HTMLを普通に組んでいるとチェックボックスとかラジオボタンがテキストとずれる。

だからinput要素のチェックボックスとテキストとのずれをCSSで調整する。


■CSSでチェックボックスのズレを調整する

input[type="checkbox"],
input[type="radio"] {
display: inline-block;
margin: 0 2px;
padding: 0;
vertical-align: middle;
position: relative;
top: -1...
...
...
read more >>>

Read More     Comments(0)

[Javascript]ウィンドウを閉じるwindow.close()が効かない

Category HTML・JS・CSS

Posted on 2015/11/12 (木) 15:07 By xirasaya
開いたウィンドウを閉じるjavascriptのwindow.close()はブラウザによって効いたり効かなったりする。
だから使えない…と思っていた。そうちょっと前までは。


最近のブラウザだと以下のように書けば問題なく動くことがわかった。


■開いたウィンドウを閉じるスクリプト

<a href="javascript:window.open('about:blank','_self').close();">close</a>


試した環境は以下の通り。
・Firefox ESR 38.3.0
・GoogleChr...
...
...
read more >>>

Read More     Comments(0)

[CSS]連番のIDやクラスをまとめて指定する書き方

Category HTML・JS・CSS

Posted on 2015/05/13 (水) 12:14 By xirasaya
連番になっているようなIDやクラスをCSSでまとめて指定する必要性が出てきた。


調べてみるとjavasと同じような指定の仕方でいけるようだ。
ということでメモ。



まずは連番IDを適当に作ってみる。

<html>
<body>
<div id="test_1">test_1</div><br />
<div id="test_2">test_2</div><br />
<div id="test...
...
...
read more >>>

Read More     Comments(0)

本サイトのfont-familyを変更してみた

Category HTML・JS・CSS

Posted on 2015/03/04 (水) 13:48 By xirasaya
このサイトを作った頃はまだXPが現役だったんだけど、もはやそれも過去のものとなった。


以前は"ＭＳ Ｐゴシック"を優先フォントにしていたんだけど、
古いブラウザを切り捨てることができるようになったので改めてCSSを以下のように変更した。


■新しく設定したfont-family

html, body, input, select, textarea, button, p {
font-family: Verdana, Arial, Helvetica, "メイリオ", Meiryo, "ヒラギノ角ゴPro W3&q...
...
...
read more >>>

Read More     Comments(0)


(35 件中 1 件目〜 5 件目を表示中)
1234567next>>


top > posts > categories

  • Public Relations