CSS learning memo no.1
『コメントアウト・headで編集』
CSS learning memo no1.
CSS まとめ
#1 コメントアウトするには /* */ で囲む #2 HTMLを編集する方法 headに詳細を入力する方法(タイトルの下に) <title>CSS Practice </title> <style> p{color : orange ;} </stkle> #3 直接対象のタグに入力する方法 お勧めしない <p style="color: violet;">こんにちは</p> #4 cリンクを貼って、CSSファイルに設定してhtmlファイルに反映させる。 ヘッドの部分に <title> css practive </title> <link rel ="stylesheet" href="style.css"> #5 セレクタ { プロパティ名 :値 ;} セレクタ { プロパティ名 :値 ; プロパティ名 :値 ; } #6 ユニバーサルセレクタ すべての要素を選ぶ*をつける 要素名 p h1 div #7 同じ行の文字、色を変える <span>で囲む
pythonでhtmlを扱う
pythonからhtmlを扱う ざっくりまとめ
html側の入力フォーム作成
名前入力か選択 : <input list="browsers" name="myBrowser" /></label> <datalist id="browsers"> <option value="鈴木イチロー"> <option value="山田ハナコ"> </datalist> <br> メニュー(1):<input type="text"name="value2"><br> メニュー(2):<input type="text"name="value3"><br> メニュー(3):<input type="text"name="value4"><br> メニュー(4):<input type="text"name="value5"><br> メニュー(5):<input type="text"name="value6"><br> メニュー(6):<input type="text"name="value7"><br> <input type="submit">
datalistは、登録した名前を選択可能であり、入力も可能
htmlから入力したデータをはきだす
<form action="/cgi-bin/Bond.py">
注意 bond.pyはhtmlとpythonコードを一つにしたものです
html learning memo no.7
『フォルダをまとめる』
html learning memo no.7
フォルダをまとめる事
フォルダをまたいたリンク結ぶ
フォルダをしっかり整理する。 作業を行う上で、しっかりとフォルダ分けと階層の理解をした方が良い 例えば、画像はimagesというフォルダを作り、まとめておく フォルダをまたいたリンクを行うときのまとめ フォルダ出てimagesフォルダの中のyakyu.jpgをひらく <img.src = " .. / images/yakyu.jpg"> yakyuフォルダの中のyakyu.htmlひらく <a href = " yakyuu/yakyu.html"></a> フォルダ出てyakyu.htmlを開く <a href = " ../yakyuu/yakyu.html"></a> フォルダを出てtennisフォルダの中のtennis.htmlを開く <a href = " ../tennis/tennis.html"></a>
html learning memo no.6
『属性について』
html learning memo no.6
属性について
<!-- グリーバル属性 id : 一つしかない要素 class : 複数ある要素 style : スタイルを直接指定
使用例
<p id = "message">こんにちは</p> <p class = "message active"> こんにちは</p> <p class = "massage" style ="background : skyblue ;">こんにちは</p>
久しぶりにpython サンプルコードと出来上がりformです!
今回は、入力用のフォームと表示用のtreeviewを一つにまとめてみました!
# -*- coding: utf-8 -*- def reset_form(): entry2.delete(0,tk.END) entry4.delete(0,tk.END) entry5.delete(0,tk.END) box1.delete(0,tk.END) box2.delete(0,tk.END) box3.delete(0,tk.END) box4.delete(0,tk.END) box5.delete(0,tk.END) box6.delete(0,tk.END) box7.delete(0,tk.END) box8.delete(0,tk.END) box9.delete(0,tk.END) # def exe_insert(): c = sqlite3.connect("text.db") year = box1.get() # 年 # month = box2.get() # 月 # day = box3.get() # 日 # user = box2.get() # 利用者 # s_time = box4.get() # 始業時間 # e_time = box5.get() # 終業時間 # reo_time = entry3.get() # 私用休憩 # meal = list3.get() # 食事 # pickup =list4.get() # 送迎 # outside = list2.get() # 施設外 # o_time = entry5.get() # 施設外時間 # absence = entry4.get() # 欠席内容 # adttion = box6.get() # 欠席加算 # date = (year+"-"+month+"-"+day) # 年月日 # print(date,user,s_time,e_time,reo_time,shokuji[meal],sougei[pickup],outsidesetugai[outside],o_time,absence,adttionsan[adttion]) try: c.execute(""" INSERT INTO main(date,user,time1,time2,rest,meal,pickup,outside,time3,absence,addition) VALUES('{}',{},'{}','{}',{},{},{},{},{},'{}',{});""".format(date,user,s_time,e_time,reo_time,shokuji[meal],sougei[pickup],outsidesetugai[outside],o_time,absence,adttionsan[adttion])) c.execute("COMMIT;") text=("一件登録されました!") tk.messagebox.showinfo("info",text) except: text=("エラーにより登録できませんでした") tk.messagebox.showinfo("info",text) def read_tree_view(sql): i=0 for r in c.execute(sql): tree.insert("","end",tags=i,values=r) if i & 1: tree.tag_configure(i,background="#CCFFFF") i+=1 import tkinter as tk import tkinter.ttk as ttk import sqlite3 import tkinter.messagebox as msg dbname = "text.db" c = sqlite3.connect(dbname) root = tk.Tk() root.title("text Input business") root.resizable(0,0) root.geometry("860x610") status = tk.Label(root, text=" from : hokazonoya ・・・",borderwidth=2,relief="ridge",foreground="purple") status.pack(side=tk.BOTTOM, fill=tk.X) frame1 = tk.LabelFrame(root,bd=2,relief="ridge",text=" Search user information ",width=250,height=100,foreground="purple") frame1.place(x=630,y=270) label1 = tk.Label(frame1,text=" I D ",width=11,height=2) label1.grid(row=1,column=1,padx=12) entry1= tk.Spinbox(frame1,text="",width=12) entry1.grid(row=1,column=2,ipady=5,pady=10,padx=10) frame12 = tk.LabelFrame(root,bd=2,relief="ridge",text=" name ",width=250,height=300,foreground="purple") frame12.place(x=10,y=0) #あ# labe20 = tk.Label(frame12,text=" あ行 ",width=4,height=2) labe20.grid(row=0,column=0) val = tk.StringVar() box20 = ttk.Combobox(frame12, values = (" "), textvariable=val, state='readonly',width=8,height=2) box20.current(0) #初期値を'(index=0)'に設定 box20.grid(row=0,column=1,padx=6,ipady=3) #か# labe21 = tk.Label(frame12,text=" か行 ",width=4,height=2) labe21.grid(row=0,column=2) val = tk.StringVar() box21 = ttk.Combobox(frame12, values = (" "), textvariable=val, state='readonly',width=8,height=2) box21.current(0) #初期値を'(index=0)'に設定 box21.grid(row=0,column=3,padx=6,ipady=3) #さ# labe22 = tk.Label(frame12,text=" さ行 ",width=4,height=2) labe22.grid(row=1,column=0) val = tk.StringVar() box22 = ttk.Combobox(frame12, values = (" "), textvariable=val, state='readonly',width=8,height=2) box22.current(0) #初期値を'(index=0)'に設定 box22.grid(row=1,column=1,padx=6,ipady=3) #た# labe23 = tk.Label(frame12,text=" た行 ",width=4,height=2) labe23.grid(row=1,column=2) val = tk.StringVar() box23 = ttk.Combobox(frame12, values = (" "), textvariable=val, state='readonly',width=8,height=2) box23.current(0) #初期値を'(index=0)'に設定 box23.grid(row=1,column=3,padx=6,ipady=3) #な# labe24 = tk.Label(frame12,text=" な行 ",width=4,height=2) labe24.grid(row=2,column=0) val = tk.StringVar() box24 = ttk.Combobox(frame12, values = (" "), textvariable=val, state='readonly',width=8,height=2) box24.current(0) #初期値を'(index=0)'に設定 box24.grid(row=2,column=1,padx=6,ipady=3) #は# labe25 = tk.Label(frame12,text=" は行 ",width=4,height=2) labe25.grid(row=2,column=2) val = tk.StringVar() box25 = ttk.Combobox(frame12, values = (" "), textvariable=val, state='readonly',width=8,height=2) box25.current(0) #初期値を'(index=0)'に設定 box25.grid(row=2,column=3,padx=6,ipady=3) #ま# labe26 = tk.Label(frame12,text=" ま行 ",width=4,height=2) labe26.grid(row=3,column=0) val = tk.StringVar() box26 = ttk.Combobox(frame12, values = (" "), textvariable=val, state='readonly',width=8,height=2) box26.current(0) #初期値を'(index=0)'に設定 box26.grid(row=3,column=1,padx=6,ipady=3) #や# labe27 = tk.Label(frame12,text=" や行 ",width=4,height=2) labe27.grid(row=3,column=2) val = tk.StringVar() box27 = ttk.Combobox(frame12, values = (" "), textvariable=val, state='readonly',width=8,height=2) box27.current(0) #初期値を'(index=0)'に設定 box27.grid(row=3,column=3,padx=6,ipady=3) frame3 = tk.LabelFrame(root,bd=2,relief="ridge",text=" day ",width=260,height=100,foreground="purple") frame3.place(x=280,y=0) val = tk.StringVar() box1 = ttk.Combobox(frame3, values = (" ","2015","2016","2017","2018","2019","2020","2021"), textvariable=val, state='readonly',width=7,height=2) box1.current(0) #初期値を'(index=0)'に設定 box1.grid(row=0,column=0,padx=2,ipady=5) label3= tk.Label(frame3,text="年",width=4,height=2) label3.grid(row=0,column=1,padx=2,pady=5) val = tk.StringVar() box2 = ttk.Combobox(frame3, values = (" ","01","02","03","04","05","06","07","08","09","10","11","12"), textvariable=val, state='readonly',width=7,height=2) box2.current(0) #初期値を'(index=0)'に設定 box2.grid(row=0,column=2,padx=2,ipady=5) label4= tk.Label(frame3,text="月",width=3,height=2) label4.grid(row=0,column=3,padx=2,pady=5) val = tk.StringVar() box3 = ttk.Combobox(frame3, values = (" ","01","02","03","04","05","06","07","08","09","10","11","12","13","14","15","16","17","18","19","20","21","22","23","24","25","26","27","28","29","30","31"), textvariable=val, state='readonly',width=7,height=2) box3.current(0) box3.grid(row=0,column=4,padx=2,ipady=5) label5= tk.Label(frame3,text="日",width=3,height=2) label5.grid(row=0,column=5,padx=2,pady=5) frame4 = tk.LabelFrame(root,bd=2,relief="ridge",text=" time ",width=250,height=150,foreground="purple") frame4.place(x=10,y=210) label6 = tk.Label(frame4,text=" 始業時間 ",width=10,height=2,bd=1) label6.grid(row=1,column=1,padx=14,ipadx=10) val = tk.StringVar() box4 = ttk.Combobox(frame4, values = (" ","09:30","10:00","10:30","11:00","11:30","12:00","12:30","13:00","13:30","14:00","14:30","15:00"), textvariable=val, state='readonly',width=12,height=2) box4.current(0) box4.grid(row=1,column=2,padx=10,ipady=5) label7 = tk.Label(frame4,text=" 終業時間 ",width=10,height=2) label7.grid(row=2,column=1,padx=10,pady=7) val = tk.StringVar() box5 = ttk.Combobox(frame4, values = (" ","09:30","10:00","10:30","11:00","11:30","12:00","12:30","13:00","13:30","14:00","14:30","15:00","15:30"), textvariable=val, state='readonly',width=12,height=2) box5.current(0) box5.grid(row=2,column=2,padx=10,ipady=3) frame5 = tk.LabelFrame(root,bd=2,relief="ridge",text=" 休憩時間 ",width=520,height=100,foreground="purple") frame5.place(x=630,y=85) label8 = tk.Label(frame5,text=" 私用休憩 ",width=10,height=2) label8.grid(row=1,column=0,padx=12) entry3 = tk.Entry(frame5,text="",width=8) entry3.grid(row=1,column=1,ipady=3,pady=7,padx=10) label9 = tk.Label(frame5,text=" h ",width=3) label9.grid(row=1,column=2,padx=10) frame6 = tk.LabelFrame(root,bd=2,relief="ridge",text=" 欠席内容入力欄 ",width=300,height=250,foreground="purple") frame6.place(x=280,y=80) label10 = tk.Label(frame6,text=" 欠席内容 ",width=10,height=2) label10.grid(row=0,column=0,ipadx=14,pady=5) entry4 = tk.Entry(frame6,text="",width=25) entry4.grid(row=0,column=1,ipady=20,padx=25) label11 = tk.Label(frame6, text=" 欠席加算 ") label11.grid(row=1,column=0,padx=10,pady=5,ipady=8) val = tk.IntVar() val = tk.StringVar() box6 = ttk.Combobox(frame6, values = (" ","無し","有り"), textvariable=val, state='readonly',width=5,height=2) box6.current(0) box6.grid(row=1,column=1,ipadx=10,ipady=5) frame7 = tk.LabelFrame(root,bd=2,relief="ridge",text="施設外情報入力欄 ",width=350,height=250,foreground="purple") frame7.place(x=280,y=220) label12 = tk.Label(frame7,text=" 施設外入力 ",width=13) label12.grid(row=1,column=1,padx=12,ipady=3)# val = tk.StringVar() query = c.execute("select outside from outside") listitems =query.fetchall() list2 = ttk.Combobox(frame7,width=14,height=2) list2["values"] = listitems list2.grid(row=1,column=2,padx=12,ipady=3) label13 = tk.Label(frame7,text=" 施設外時間 ",width=9,height=2) label13.grid(row=3,column=0,pady=9) entry5 = tk.Entry(frame7,text="",width=5) entry5.grid(row=3,column=1,ipady=3,ipadx=2) label14 = tk.Label(frame7,text=" 時間 ",width=8,height=2) label14.grid(row=3,column=2,pady=7) frame8 = tk.LabelFrame(root,bd=2,relief="ridge",text=" eat ",width=520,height=100,foreground="purple") frame8.place(x=630,y=210) label15 = tk.Label(frame8,text=" 食 事 ",width=10,height=2) label15.grid(row=1,column=1,padx=12) query = c.execute("select meal from meal") listitems =query.fetchall() list3 = ttk.Combobox(frame8,width=12,height=2) list3["values"] = listitems list3.grid(row=1,column=2,padx=10,ipady=5) frame9 = tk.LabelFrame(root,bd=2,relief="ridge",text=" pick up ",width=520,height=100,foreground="purple") frame9.place(x=630,y=150) label16 = tk.Label(frame9,text=" 送 迎 ",width=10,height=2) label16.grid(row=1,column=1,padx=12) val = tk.StringVar() query = c.execute("select pickup from pickup") listitems =query.fetchall() list4 = ttk.Combobox(frame9,width=12,height=2) list4["values"] = listitems list4.grid(row=1,column=2,padx=10,ipady=5) frame10 = tk.LabelFrame(root,bd=2,relief="ridge",text=" end ",width=750,height=80,foreground="purple") frame10.place(x=760,y=0) button1 = tk.Button(frame10,text="保 存",width=10,height=2,bg="ivory2",command=exe_insert) button1.pack(side="right",padx=5,pady=5) frame11 = tk.LabelFrame(root,bd=2,relief="ridge",text=" add to ",width=750,height=80,foreground="purple") frame11.place(x=630,y=0) button2 = tk.Button(frame11,text="追 加",width=10,height=2,bg="ivory2") button2.pack(side="right",padx=5,pady=5) # treeview con = sqlite3.connect("text.db") cur = con.cursor() tree = ttk.Treeview(root) tree.place(x=3,y=350) tree["columns"] = (1,2,3,4,5,6,7,8,9,10,11,12) tree["show"] = "headings" tree.column(1,width=30) tree.column(2,width=80) tree.column(3,width=80) tree.column(4,width=45) tree.column(5,width=45) tree.column(6,width=60) tree.column(7,width=60) tree.column(8,width=60) tree.column(9,width=100) tree.column(10,width=50) tree.column(11,width=210) tree.column(12,width=30) tree.heading(1,text="id") tree.heading(2,text="日時") tree.heading(3,text="利用者") tree.heading(4,text="始業") tree.heading(5,text="終業") tree.heading(6,text="私休憩") tree.heading(7,text="食事") tree.heading(8,text="送迎") tree.heading(9,text="施設外場所") tree.heading(10,text="施外時") tree.heading(11,text="欠席内容") tree.heading(12,text="欠連") sql = """ SELECT 主.id,主.date,属性.[姓]||属性.[名],主.time1,主.time2,主.rest,食事.meal,送迎.pickup,施設外.outside,主.time3,主.absence,主.addition FROM main as 主,user as 属性,meal as 食事,pickup as 送迎,outside as 施設外 WHERE 主.user = 属性.id = 食事.id = 送迎.id = 施設外.id ORDER BY user """ read_tree_view(sql) root.mainloop()
長々と、しかもコードが途中で切れてすみません。
出来上がりは、
以上です!
html learning memo no.5
『form作成』
html learning memo no.5
<!DOCTYPE html> <html lang="ja"> <head> <meta charset="UTF-8"> <title>form</title> </head> <body> <form action="#"> <p> メールアドレス: <input type="email" name="mail"> </p> <p> 郵便番号: <input type="text" name="post_code"> </p> <p> <input type="submit" value="送信"> </p> </form> </body> </html>
上記、入力するとラベルと入力フォームが出来上がりです!