HTML
テーブルのセル結合
<td colspan="2">水平方向</td>
<td rowspan="2">垂直方向</td>
ボタンに画像を設定
<input type="image" src="image.png">
セレクトボックスの既定値
<select name="project">
<option>1</option>
<option>2</option>
<!--既定値-->
<option selected>3</option>
<option>4</option>
<option>5</option>
</select>
CSS
テーブルの隙間をなくす
table{
border-collapse:collapse;
}
要素を画面いっぱいに表示
#full{
position:fixed;
top:0;
bottom:0;
right: 0;
left: 0;
}
取り消し線を引く
text-decoration: line-through;
横幅を計算
/*演算子の前後に半角スペースを入れないと計算してくれない*/
width:calc(100% - 16px);
K90
rm、rem
/*ページのデフォルトのフォントサイズの◯文字分*/
width:10em;
/*この要素に設定されているフォントサイズの◯文字分*/
width:10rem;
宣言の継承
baselineからの位置
/*行ボックスの中で上下位置を調整*/
vertical-align:bottom; /*下端に揃える*/
CSS変数
:root{
/*--プロパティ名:値;*/
--base-color:blue;
}
h1{
background:var(--base-color);
}
子結合子
/*子要素のみ適用*/
section > p{
color:red;
}
隣接兄弟結合子
/*直前の要素がliのliのみ適用(最初のliには適用されない)*/
li + li{
border-top:1px solid red;
}
◯番目の要素
/*最初の要素に適用*/
li:first-child{
color:red;
}
/*最後の要素に適用*/
li:last-child{
color:red;
}
/*3番目の要素に適用*/
li:nth-child(3){
color:red;
}
/*偶数番目の要素に適用*/
li:nth-child(even){
color:red;
}
/*奇数番目の要素に適用*/
li:nth-child(odd){
color:red;
}
/*n番目の要素に適用(以下は3の倍数)*/
li:nth-child(3n){
color:red;
}
Ruby on Rails
データベースの作成
# rails g model モデル名 カラム名:データ型 カラム名:データ型
rails g model User name:string email:string
コントローラの作成
# rails g controller コントローラ名 アクション名
rails g controller users index
マイグレーションの作成
# rails g migration ファイル名
rails g migration add_name_to_users #ファイル名は任意
# 複数カラムを追加する場合は別々に記述
# add_column :テーブル名, :カラム名, :データ型
add_column :users, :name, :string
change_column :article, :title, :text
テーブルの並び替え
# @変数名=モデル名.all.order(カラム名: "ASC") #昇順
# @変数名=モデル名.all.order(カラム名: "DESC") #降順
@tasks=Task.all.order(end: "ASC")
現在よりも前の日付のデータを抽出
# @変数名=モデル名.where("カラム名 <= ?", Time.now)
@tasks=Task.where("end <= ?", Time.now)
テーブルから複数条件検索
# モデル名.where(カラム名:データ).where(カラム名:データ)
Task.where(done: false),where("end <= ?", Time.now)
今日からn日後
モデル名.where(カラム名: Date.today..Time.now.end_of_day + (2.days))
空白データを後ろ
@変数名.order(Arel.sql("カラム名 IS NULL,カラム名 ASC")) #昇順
エラーメッセージをビューに引き継ぐ
# controller
# redirect_to "コントローラー/アクション" flash: {error: インスタンス変数.errors.full_messages}
redirect_to "/users/new",flash: {error: @user.errors.full_messages}
# view
flash[:error]