作成者別アーカイブ: 真中のぶ

真中のぶについて

The B.B.BoogieというバンドでVocalをしています。サーフィンもします。シングルフィンのクラッシックなロングボードに乗っています。ウェブデザイナーでもあります。タカハシ先生の一番弟子ですが時々すっとこどっこいな質問をして校庭１０周と言われます。「パソコン倶楽部りんご」は僕が命名しました。ジョブズさんに敬意を表して。好きなcssはmargin{0 auto;}

学習履歴: WAVE立川校

職業: フリーのウェブデザイナー

SNS :

パンくずリスト mark up

コメントをどうぞ

みなさん、パンくずリストは何でマークアップしますか？

html5ならこんな方法もあるということで、現在製作中のサイトはこれにしてみました。

<nav>
 <p>
  <a href="/" rel="index up up up">第一階層</a> >
  <a href="/products/" rel="up up">第二階層</a> >
  <a href="/products/dishwashers/" rel="up">第三階層</a> >
  <a>現在位置</a>
 </p>
</nav>

<nav>

<p>

</p>

</nav>

参考にさせて頂いたサイト
coliss.com

2014-02-14 勉強会

コメントをどうぞ

この日は今年2回目の大雪の日でした。帰宅が困難になると予想して柴崎町学習館での勉強会は中止にしました。その代わり、コードシェアやFaceTime等を使い各自自宅にいながらの遠隔学習にチャレンジしました。

サイボウズや当サイトでもお伝えしていたように、先生は18:00〜22:00まで、みなさんの質問に答える為に自宅でスタンバイしてくれました。

僕は先生に、こんな事を教えてもらいました。
http://nobu-69.com/others.html
あとは、RWDについて少々。

やる気があれば、どんな状況でも工夫次第で勉強会は出来るものですね。

先生、お疲れさまでした。

レスポンシブデザイン・画像の問題

コメントをどうぞ

レスポンシブデザインにする場合、パソコン用サイトの知識だけでは、いろいろな問題が出てきますよね。

まずは画像です。大きい画面で見るとちょうどいいのに、小さい画面で見ると、はみ出したりしてしまいます。
何事も、はみ出してしまうのは恥ずかしいですよね。

そんなとき便利なのが、画像を画面のサイズに合わせて変化させる「Fluid Image」という手法です。

くわしくは、各自ググって下さい。Fluid Imageでたくさん出てきます。

レスポンシブデザイン

1件のフィードバック

こんばんは。

自分のサイトを製作中です。パソコン用のサイト（横幅1000px）を作り、スマホやタブレットなどはそのまま縮小されたのが表示されればいいや〜と思っていました。完成を間近にして、実際スマホなどで確認したところ不具合がありました。細々と修正しているうちに「こりゃダメだ〜サイトをレスポンシブデザインにせねば！」とレスポンシブデザインに開眼。
パソコン用のサイトとして、いくらカッコいいと思うものを作っても表示領域の小さいものでうまく表示されないのでは、人は見てくれません。極論ですが見てくれないものは存在しないというのと同じです。大学で勉強した哲学で言う所のエッセ・エルト・ペルキピ（注１）です。

以前、仕事でwordpressでサイトを作りました。テーマ2012をカスタマイズしました。その時はもちろんレスポンシブデザインでした。半分以上はテーマが対応しているので、自分がメディアクエリを書いたのはちょっとでした。

今回は全部自分でやるので、頑張ります！

あと、サイト全体のフォントサイズも16pxにしました。以前までは小さい方がおっしゃれ〜と思っていたのですが、大きく見やすい方が人に優しいかな。

「見やすい」「使いやすい」「伝える」などを形にするのがデザイン。
人がどう見ようと感じようと関係なく自分のイメージした物を形にするのがアート。（完全にそうとは言い切れないけど、とりあえずここでは対比の為に分かりやすくそうしておきます。）

仕事としてやっていくならウェブのデザイナーでなければいけません。
ウェブのアーティストというのもなんだかカッコよさそうですが、依頼がこなそうです。w　（来たらうらやましい）

僕はデザインとアートの境界線を分かっているつもりでいるけど、時々その境界線が曖昧になってしまいます。一人前のデザイナーになるには、この境界線をきっちりと知る事だと思い自分の為に記しておきます。

１からやり直し中のサイト
マナカデザイン
先生、
・ページの右上のロゴfluid imageやってみました。
・なるべく横幅は数値指定しないほうがいいですよね？（する時は%がよいですよね。）
・フォントサイズも、もちろんemがよいですよね。
・以前りんごでやったドロワーメニューにも挑戦しようと思います。wordpressの2012（りんご）のように、たたんで１つにしてタップで全部が下に表示という風にしたい。この議事録をもとにできますか？僕の議事録cssとjQueryの2種類がありますが、現在実用的にはどちらがよいですか？あとドロワーは1000px以下で出現しようと思いますがどうおもいますか？

その他レスポンシブについてのアドバイスあれば、お願い致します。

注１
エッセ・エルト・ペルキピとは、18世紀の哲学者ジョージ・バークリーの有名な言葉で「存在しているという事は、知覚されていること」という意味のラテン語である。事物は知覚された時に初めて存在し始める。そして、その事物についての意識外では、事物は全くの無であるというのだ。その知覚は私の精神だけでなく人間性を築き上げている精神の共同体によって知覚されているという事なのである。例えば現実とは、私達みんながそこに参加し、様々な仕方や観点で関わりあっているものといえる。（僕の大学レポートを抜粋）

2014-02-07 勉強会

コメントをどうぞ

この日は８人の参加者で賑わいました。

これから初心者の方の参加が目立ってきそうな感じですかね？！そうなるとレベルがバラバラになるので、全員で１つの事をやるのは無理が出てくるかも知れません。
wordpress関数をやっても初心者には理解不能だろうし、idとclassの違いについてやっても初心者以上には退屈でしょう。

来た全員が納得できる勉強会にするにはどうするのが良いか、各自考えてみて下さい。

いくつか考えました。

ある程度出来る人は初心者の方に教えるという立場になる。（ずっとじゃなくても）
仕事やポートフォリオ等の制作をしていて、困った事があり先生に聞くのはOKです。その為に来ている人もいるので。しかし何十分も先生を独占してしまうと、他の人に迷惑がかかります。かといって質問が出来ないのであれば来る意味がありません。なので、個人的に質問して先生を独占してしまうのはOKとして、そのかわり、その教わった事を必ずこのサイトに３日以内に議事録を書くとういのはどうでしょう。１人の人が何かの解決法を先生に聞いたとしても議事録に書いてくれれば、情報が１人だけのものではなく全員のものになるから。（というか、本来ならこんな事を決めなくてもやるべきだと思いますが….）
とりあえず行けばいいという考え方を止める。今日はこれを先生に質問しよう。初心者の人にこれを説明して上げよう。最近の◯◯は、どうしているのか全員に聞いてみよう。などなど。ぼんやりとして勉強会にいって先生が何かをやってくれて、言われるままにやったら出来ましたー！というのはなくなるかもしれませんね。（そもそも、りんごは学校じゃなく勉強会なんですから！）

先生、みなさん

どうですか。

特定の位置までスクロールしたときにアニメーションさせる(jQueryとcss)

コメントをどうぞ

2014-01-31と2014-02-07の2週にわたり勉強会でやった「特定の位置までスクロールしたときにアニメーションさせる」というのを自分なりにやってみました。
オブジェクトの数だけif文を書くという面倒なやり方ですが、理解しました。オブジェクトの数だけif文を書かなくて済む方法も先生に教わりましたが、まだちょっと難しいので理解していません。

とりあえず自分のサイトにアップしました。
http://nobu-69.com/others.html

授業に参加したみなさんは、どれくらい理解しましたか？
僕は理解するのに結構いじくりまわしました。時間も費やしました。授業で先生の説明を聞いただけで技術はモノになりません。聞いた事を基に家でいろいろやらないとダメです。

なので、細かい説明はしません。自分でやってみてつまずいた箇所があったら教えて下さい。分かる範囲でお答えします。

css

html,body {
		margin: 0;
		padding: 3em;
	}
	section{
		padding:30em 0
	}
	/*1つめ*/
	.box {
		height: 10em;
		margin: 0 1em 2em 0;
		position: relative;
		border: 2px solid #333;
	}
	.box:before {
		content: "1回転して３倍に拡大";
		display: block;
		position: absolute;
		left: 45%;
		top : 45%;
		background-color:pink;
		transition: 0.5s;
	}
	

	.on.box:before {
		transform: scale(3) rotate(1turn);
		background-color:purple;
		color:#fff;
	}
	
	/*2つめ*/
	.box2 {
		height: 10em;
		margin: 0 1em 2em 0;
		position: relative;
		border: 2px solid #333;
	}
	.box2:before {
		content: "半回転して2倍に拡大";
		display: block;
		position: absolute;
		left: 45%;
		top : 45%;
		background-color:indianred;
		transition: 0.5s;
	}
	

	.on.box2:before {
		transform: scale(-2) rotate(1turn);
		background-color:skyblue;
	}

html,body {

margin: 0;

padding: 3em;

}

section{

padding:30em 0

}

/*1つめ*/

.box {

height: 10em;

margin: 0 1em 2em 0;

position: relative;

border: 2px solid #333;

}

.box:before {

content: "1回転して３倍に拡大";

display: block;

position: absolute;

left: 45%;

top : 45%;

background-color:pink;

transition: 0.5s;

}

.on.box:before {

transform: scale(3) rotate(1turn);

background-color:purple;

color:#fff;

}

/*2つめ*/

.box2 {

height: 10em;

margin: 0 1em 2em 0;

position: relative;

border: 2px solid #333;

}

.box2:before {

content: "半回転して2倍に拡大";

display: block;

position: absolute;

left: 45%;

top : 45%;

background-color:indianred;

transition: 0.5s;

}

.on.box2:before {

transform: scale(-2) rotate(1turn);

background-color:skyblue;

}

jQuery

$(function(){
	var scrollBottom;
	var wHeight;
	var sec1Top = $("#sec1 .box").offset().top;//1つめ　varの関数名はif文で使われる　動かしたいオブジェクトの数だけこの行も必要
	var wowwow = $("#sec2 .box2").offset().top;//2つめ　varの関数名はif文で使われる
	
	function getScrollTop(){
		wHeight = Math.floor($(window).height() * 0.5);//0.5は画面の真ん中、0はTOP、1はBOTTOMで変化
		scrollBottom = $(window).scrollTop() + wHeight;
	
		//動かしたいオブジェクトの数だけifとelse（２つでワンセット）がある

		if(scrollBottom >= sec1Top){
			
			$("#sec1 .box").addClass("on");
		}
		else{
			$("#sec1 .box").removeClass("on");
		}
		
		
		if(scrollBottom >= wowwow){
			
			$("#sec2 .box2").addClass("on");
		}
		else{
			$("#sec2 .box2").removeClass("on");
		}
	
	
	}
	$(window).on("load scroll", getScrollTop);
});

//.offset() .scrollTop() .addClass .removeClassはjQueryの変数なので「ヌー」で調べられる。
//仕組みは、ある位置（ここでは0.5に来た時）にcssが入れ替わる。.boxから.box onに。
//変化する矩形は疑似要素でcssのtransformでアニメーションしている。

$(function(){

var scrollBottom;

var wHeight;

var sec1Top = $("#sec1 .box").offset().top;//1つめ　varの関数名はif文で使われる　動かしたいオブジェクトの数だけこの行も必要

var wowwow = $("#sec2 .box2").offset().top;//2つめ　varの関数名はif文で使われる

function getScrollTop(){

wHeight = Math.floor($(window).height() * 0.5);//0.5は画面の真ん中、0はTOP、1はBOTTOMで変化

scrollBottom = $(window).scrollTop() + wHeight;

//動かしたいオブジェクトの数だけifとelse（２つでワンセット）がある

if(scrollBottom >= sec1Top){

$("#sec1 .box").addClass("on");

}

else{

$("#sec1 .box").removeClass("on");

}

if(scrollBottom >= wowwow){

$("#sec2 .box2").addClass("on");

}

else{

$("#sec2 .box2").removeClass("on");

}

$(window).on("load scroll", getScrollTop);

});

//.offset() .scrollTop() .addClass .removeClassはjQueryの変数なので「ヌー」で調べられる。

//仕組みは、ある位置（ここでは0.5に来た時）にcssが入れ替わる。.boxから.box onに。

//変化する矩形は疑似要素でcssのtransformでアニメーションしている。

html

<section id="sec1">
			<div>
				<h1>Sec1</h1>
				<div class="box"></div>
			</div>
		</section>
        
        <section id="sec2">
			<div>
				<h1>Sec2</h1>
				<div class="box2"></div>
			</div>
		</section>

<div>

</div>

</section>

<div>

</div>

</section>

mac 解凍ソフト

1件のフィードバック

マック初心者です。
.sitという圧縮ファイルが解凍できません。なにか解凍ソフトをインストールする必要があるようですが、いくつかやってみたがインストールできません。

このフリーソフトいいよ、というのがあれば教えて下さい。

FireFox Javascript有効

1件のフィードバック

なにかいじっていたら、いつのまにかFireFoxのJavascriptが無効になったらしい。有効にする為に検索したら、ツールのオプションをクリックとあるが、ツールにオプションがない。あと、Firefoxから環境設定でコンテンツにjsについてのチェックボックスがあると書いてあるが、チェックボックス自体がない。

imac osx 10.9.1
Firefox 26.0

です。

jQueryのエラーチェック

コメントをどうぞ

2014-01-31 勉強会の議事録です。

この日もいろいいろな事を学びました。その中の1つをまとめました。

jQueryのスムーススクロールってありますよね。ページ内リンクで、しゅるしゅる〜って移動するやつ。私がずっと前から使っていたものは、jQuery本体とトリガーのみで実装する簡単にできるやつでした。それを設置しているページに別の新しいjQueryを入れました。そしたら、それが動きません！jQuery本体のバージョンが古いのかなあ？と思い最新版にしました。jQuery本体1.5.1を1.10.2にバージョンアップしました。それで、新しいjQueryは動きましたが、今度はなんと！スムーススクロールが動きません。

そういう場合は、FireBugのコンソールでチェックです。先生にチェックの仕方を教わりましたが、こちらのサイトにもありますので、見て下さい。Firebugでできること: ソースコードのエラー解析

これで、エラーが出ていたらその箇所を修正すれば良いのです。

//スムーススクロール
$(function(){
   // #で始まるアンカーをクリックした場合に処理
   $('a[href^=#]').click(function() {
      // スクロールの速度
      var speed = 1000;// ミリ秒
      // アンカーの値取得
      var href= $(this).attr("href");
      // 移動先を取得
      var target = $(href == "#" || href == "" ? 'html' : href);
      // 移動先を数値で取得
      var position = target.offset().top;
      // スムーススクロール
      $($.browser.safari ? 'body' : 'html').animate({scrollTop:position}, speed, 'swing');
      return false;
   });
});

//スムーススクロール

$(function(){

// #で始まるアンカーをクリックした場合に処理

$('a[href^=#]').click(function() {

// スクロールの速度

var speed = 1000;// ミリ秒

// アンカーの値取得

var href= $(this).attr("href");

// 移動先を取得

var target = $(href == "#" || href == "" ? 'html' : href);

// 移動先を数値で取得

var position = target.offset().top;

// スムーススクロール

$($.browser.safari ? 'body' : 'html').animate({scrollTop:position}, speed, 'swing');

return false;

});

コンソールチェックで下から4行目の　$.browser　がエラーですよ！と出ていたので。それを直します。
先生のアドバイスで、下から4行目を下記のように書きかえました。

//スムーススクロールzzzzzzzz
$(function(){
   // #で始まるアンカーをクリックした場合に処理
   $('a[href^=#]').click(function() {
      // スクロールの速度
      var speed = 1000;// ミリ秒
      // アンカーの値取得
      var href= $(this).attr("href");
      // 移動先を取得
      var target = $(href == "#" || href == "" ? 'html' : href);
      // 移動先を数値で取得
      var position = target.offset().top;
      // スムーススクロール
      $('body,html').animate({scrollTop:position}, speed, 'swing');
      return false;
   });
});

//スムーススクロールzzzzzzzz

$(function(){

// #で始まるアンカーをクリックした場合に処理

$('a[href^=#]').click(function() {

// スクロールの速度

var speed = 1000;// ミリ秒

// アンカーの値取得

var href= $(this).attr("href");

// 移動先を取得

var target = $(href == "#" || href == "" ? 'html' : href);

// 移動先を数値で取得

var position = target.offset().top;

// スムーススクロール

$('body,html').animate({scrollTop:position}, speed, 'swing');

return false;

});

これで直りました！やったー。

jQuery-1.9から「jQuery.browser」が完全にサポートされなくなっていたようです。jQuery $.browseで検索すると出て来ます。

jQueryがうまくいかないという事はよくあります。原因はさまざまですが、今回紹介したようにまずはエラーチェックをするのが良いでしょう。

jQuery (triggerのみ)とcss3で実装するscroll switchアニメーション

1件のフィードバック

2014-01-24の勉強会でやった事を現在製作中の自分のサイトにやってみました。

質問１
1つだけならうまくいきますが、２つ設置するとうまくいきません。（同時に作動してしまう。）

質問２
jQuery本体ですが、index.htmlにしゅるしゅるスムーススクロールをやる為に、
src=”http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js”
で本体を読み込んでいました。

しかし今回のアニメーションをやるにはversionが古すぎるようで、動きませんでした。
なので、最新の本体をダウンロードしてサイト内に設置しました。そしたらアニメーションは
動きましたが、しゅるしゅるスクロールが動作しません。

こういう場合の対処法については、どうしたらいいでしょうか？
新しいのに対応しているスムーススクロールを見つけるのがいいのかなあ。

製作中のサイトです。トップページにアニメーションあります。あと、何度もいいますが制作途中です。w
manakaa.com

先生が作ったサンプルサイト
ringo20140124
※ダウンロードしてjQ本体をリンクして下さい。

css図形

コメントをどうぞ

cssでインベーダー

こちらのサイトに載ってました。The Shapes of CSS

2014-01-17 勉強会

3件の返信

今回は先生から急遽病気で行けなくなったとの連絡をもらいましたので、先生ぬきでの勉強会でした。

サイトを見ていて気になるエフェクトってありますよね。そんなときはFireFoxのFireBugでhtmlとcssをコピってしまおう。そんでもってcssの値をかえたり、プロパティ自体をオフにしてみたりする事で理解を深める。「編集ボタン」でhtmlをコピー、cssをコピーしてhtmlファイルにペースト。どのcssをコピーするかは各自のセンスで。知らないプロパティとかが出て来てもとりあえずコピる。動けばとりあえずOK!

やってみた
 参考サイト

css

*, *:after, *:before {
    -moz-box-sizing: border-box;
}



nav a {
    color: #FFFFFF;
    display: inline-block;
    font-size: 1.35em;
    font-weight:400;
    letter-spacing: 1px;
    margin: 15px 25px;
    outline: medium none;
    position: relative;
    text-decoration: none;
    text-shadow: 0 0 1px rgba(255, 255, 255, 0.3);
    text-transform: uppercase;
}

.cl-effect-5 a span {
    display: inline-block;
    position: relative;
    transition: transform 0.3s ease 0s;
}

.cl-effect-5 a:hover span, .cl-effect-5 a:focus span {
    transform: translateY(-100%);
}

.container > section {
    margin: 0 auto;
    padding: 10em 3em;
    text-align: center;
}
.color-5 {
    background: none repeat scroll 0 0 #CD4436;
}
.cl-effect-5 a {
    height: 1em;
    overflow: hidden;
    padding: 0 4px;
}
.cl-effect-5 a span:before {
    content: attr(data-hover);
    font-weight:700;
    position: absolute;
    top: 100%;
    transform: translate3d(0px, 0px, 0px);
}

*, *:after, *:before {

-moz-box-sizing: border-box;

}

nav a {

color: #FFFFFF;

display: inline-block;

font-size: 1.35em;

font-weight:400;

letter-spacing: 1px;

margin: 15px 25px;

outline: medium none;

position: relative;

text-decoration: none;

text-shadow: 0 0 1px rgba(255, 255, 255, 0.3);

text-transform: uppercase;

}

.cl-effect-5 a span {

display: inline-block;

position: relative;

transition: transform 0.3s ease 0s;

}

.cl-effect-5 a:hover span, .cl-effect-5 a:focus span {

transform: translateY(-100%);

}

.container > section {

margin: 0 auto;

padding: 10em 3em;

text-align: center;

}

.color-5 {

background: none repeat scroll 0 0 #CD4436;

}

.cl-effect-5 a {

height: 1em;

overflow: hidden;

padding: 0 4px;

}

.cl-effect-5 a span:before {

content: attr(data-hover);

font-weight:700;

position: absolute;

top: 100%;

transform: translate3d(0px, 0px, 0px);

}

html

<section class="color-5">
				<nav id="cl-effect-5" class="cl-effect-5">
					<a href="#cl-effect-5"><span data-hover="Seraglio">Seraglio</span></a>
					<a href="#cl-effect-5"><span data-hover="Sumptuous">Sumptuous</span></a>
					<a href="#cl-effect-5"><span data-hover="Scintilla">Scintilla</span></a>
					<a href="#cl-effect-5"><span data-hover="Palimpsest">Palimpsest</span></a>
					<a href="#cl-effect-5"><span data-hover="Assemblage">Assemblage</span></a>
				</nav>
</section>

<a href="#cl-effect-5"><span data-hover="Seraglio">Seraglio</span></a>

<a href="#cl-effect-5"><span data-hover="Sumptuous">Sumptuous</span></a>

<a href="#cl-effect-5"><span data-hover="Scintilla">Scintilla</span></a>

<a href="#cl-effect-5"><span data-hover="Palimpsest">Palimpsest</span></a>

<a href="#cl-effect-5"><span data-hover="Assemblage">Assemblage</span></a>

</nav>

</section>

質問

・フォントの太さが参考サイトと違うのはなぜ？
・IE/Firefox だと文字の高さをキープするけど、Mac/Firefoxだと文字の高さが（幅も）キープされないのはなぜ？

今日の勉強会は謎をのこしつつ終了しました。

2014-01-10 勉強会

コメントをどうぞ

今年最初の勉強会はジェイコさん、キイさんが仕事で製作中のサイトやこれから取りかかるサイト制作の質問など。

あと、前からあるのに意外と知らないテーブルレイアウトについて。

今日ではサイトの見た目をいじるのはCSSでやるのが当たり前ですよね。テーブルでレイアウトした昔のサイトを見ると古くさく思いますよね。テーブルでレイアウトするのは、良くない！とされています。理由は「SEOに有効なマークアップが出来ない」「タグが入れ子になりすぎて見にくい」「面倒くさい」などなどです。

しかし、コンテンツに出てくる内容が表組の場合、テーブルはありです。
例えばhttp://juicyeyes.com/access.html（この場合はdl, dt, ddでも良いと思う）

そのテーブルのレイアウトについてです。

役職	氏名	所属
会長	山田　一郎	営業
副会長	山田　次郎	営業
幹事	野比　ノビタ	営業
幹事	小山　順三郎	営業
幹事	岸野　太郎	営業
幹事補佐	来如意	営業

以下のようにtheadとtbodyに分けると見やすいです。ちなみにtfootというのもあります。

<table>
      <thead>
        <tr>
          <th>役職</th><th>氏名</th><th>所属</th>
        </tr>
      </thead>
      <tbody>
        <tr><th>会長</th><td>山田　一郎</td><td>営業</td></tr>
        <tr><th>副会長</th><td>山田　次郎</td><td>営業</td></tr>
        <tr><th>幹事</th><td>野比　ノビタ</td><td>営業</td></tr>
        <tr><th>幹事</th><td>小山　順三郎</td><td>営業</td></tr>
        <tr><th>幹事</th><td>岸野　太郎</td><td>営業</td></tr>
        <tr><th>幹事補佐</th><td>来如意</td><td>営業</td></tr>
      </tbody>
    </table>

<table>

<thead>

<tr>

</tr>

</thead>

<tbody>

</tbody>

</table>

table{border:1px solid #999;border-collapse: collapse;}
th{background:#999;}
thead th{background:#fcc;}
td{background:#ccc;}

table{border:1px solid #999;border-collapse: collapse;}

th{background:#999;}

thead th{background:#fcc;}

td{background:#ccc;}

こちらのサイトに詳しく解説してあります。

——————————–
ご覧の皆様、今年もよろしくお願いします！

お仕事

コメントをどうぞ

遅くなりましたが、明けましておめでとうございます。
今年の初投稿です。

フリーランスでの仕事探し、ちょっとしたお小遣い稼ぎ、腕だめし、etc….
おもしろそうですよ。

日本最大級のクラウドソーシング

“クラウドワークスなら、アプリ開発・ホームページ・ロゴ・ライティングなど全国のプロフェッショナルと企業がお仕事を気軽に受発注できます！”

という事らしいです。サイトより。

2013-12-20 勉強会議事録

1件のフィードバック

2013-12-20 勉強会議事録
今回は、大きく時間をとって新しい技術に挑戦！という事はせず、基本的な事などを色々やりました。

CMSを人に説明する時にどう言うか
最近のウェブサイトのフォントサイズは16pxが主流らしい。（以前は12px）
インライン要素とブロック要素についておさらい
text-overflow: ellipsis;

続きを読む →

2024年4月
月	火	水	木	金	土	日
« 8月
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

真中のぶ について

真中のぶについて