ウェブDeBLOG|トライデントコンピュータ専門学校 Webデザイン学科

トライデントコンピュータ専門学校 Webデザイン学科の最新情報を紹介しています。学生へのインタビュー記事から学生作品の解説、Webデザイン・マークアップ・プログラミングの授業風景、プロジェクト発表会、名古屋のWeb制作会社情報、イベント参加レポートやWeb制作の技術解説などWeb制作に関連する記事を掲載しています。トライデントコンピュータ専門学校は、いま話題の名古屋駅からユニモール地下街を歩いて3分です。 

2014.11.01 [土] 実際にformをどうやって使うの?(form関連要素おまけ)

最終更新:2020.11.26Webサイト制作Tips

2014年10月28日にHTML5仕様がW3C勧告(W3C Recommendation)となりました。HTML5の話が聞かれ始めた当初には、勧告されたら全世界大騒ぎになるのかと思っていましたが、意外と普段通りでしたね。

html5logo.jpg

これでHTML5は一段落ですが、引き続きHTML 5.1が2016年の勧告に向けて策定中であったりしますので、まだまだ進化は進みそうです。




さて本題。前回で最後と書きましたが、さらにform関連の要素や属性に関して具体的に使う場合、どのようなHTMLを書くと何が送られるのかなど、もう少しおさらいしたいと思います。


基本はform要素で囲まれた中に書いていきます。form属性を利用するとform要素の外においても関連付けさせることができます。action属性で送信先のURLを指定し、input要素のtype属性がsubmit, imageもしくはbutton要素のtype属性submitで送信することができます。JavaScriptを利用すると他の要素やinput type="button"でも送信できますが、今回は説明しません。

……

form要素、label要素、fieldset要素、legend要素、input要素


fieldset

input type hidden

input type text

input type search

input type tel

input type url

input type email

input type password

input type datatime

input type data

input type month

input type week

input type time

input type datatime-local

input type number

input type range

input type color

  • input type chekubox
  • input type radio

input type file

input type submit ※押すとデータが送信されます。

input type image ※こちらも押すと送信されます。働きはtype="submit"と同じです。

input type reset

input type button


受信するPHPファイルに下記のようなプログラムを記述します。type="file"は送信する画像から受け取るデータが複数あり表示させてあります。


textarea要素、option要素、select要素、output要素、keygen要素、button要素


datalist

output 0 100 + = 60

※output要素は表示させるためですので、値は送信されません。

keygen

button ※これを押すと送信されます。


これで、具体的な利用がイメージできるのではないでしょうか。

関連記事
Comment







(編集・削除用)


管理者にだけ表示を許可
Trackback
https://tridentwebdesign.blog.fc2.com/tb.php/467-dba570ba
検索フォーム
#NoHeartNoSNS

ハートがなけりゃSNSじゃない!

プロフィール

担当:Webデザイン学科

名古屋駅から歩いて6分、トライデントコンピュータ専門学校のWebデザイン学科を紹介します。

トライデントロゴ

質問などはLINEでどうぞ。

Instagram
Webデザイン学科実績
<プレゼン>
WCAN 2016 Springに参加してきました。
WCAN 2015 Winterに参加しました。
建設業入職者増加プロジェクトの発表会に参加
WCAN 2015 Summerに参加してきました。
WCAN 2013 Winterに参加
WCAN(秋)に参加しました。
無事、発表が終わりました【WordFes Nagoya 2013】
WCAN 2013 Summerに参加してきました。
WCAN 2011 Winter LT&LOGO
学生がライトニングトークで話しました。
<進級展>
2019年度 1年生進級制作展終了しました。
1年生進級展2018「線の群生」終了しました。
1年生進級展「WWW(Welcome to Web World)」を開催しました。
1年生進級展「お母さんの2度見展」を開催中です。
「うぇ~~~~~~~ぶ2016」終了しました。ご来場ありがとうございました!
「うぇ〜〜〜〜〜ぶ!!」終了。ご来場ありがとうございました!
<コンテスト>
信州未来アプリコンテスト0 [ゼロ] 2020 NTTドコモ長野支店賞受賞!
信州未来アプリコンテスト0 [ゼロ] 2019 KDDI賞受賞!
第5回 ソレコン☆ポスコン特別賞受賞
「第1回 専門学校 HTML5作品アワード」技術賞を受賞しました!
NCF2017でグランプリを受賞しました!
信州アプリコンテスト0 [ゼロ] KDDI賞受賞!
NCF2014(スマホアプリ開発テーマ2) 準グランプリ獲得!
最優秀賞!HTML5スマートアプリ&クリエイティブコンテスト
NCF2013グランプリ受賞!!!
<Webサイト制作>
ミス・ユニバース・ジャパン岐阜大会公式Webサイトを作成しました。
建設業入職者増加プロジェクト発表会
Webサイト制作発表会2014
99eagle Webサイトリニューアル公開
99eagle Webサイト公開
「Bloom*Block」Webサイト公開
セントレア「日本の四季 キルト展」Webサイト公開
かっぱ商店街サイト制作
ココストア共同企画「アサココ!」公開
<技能五輪全国大会>
第56回技能五輪全国大会(ウェブデザイン職種)敢闘賞受賞!
第53回技能五輪全国大会(ウェブデザイン職種)その3
第52回技能五輪全国大会が開催されました。
銀メダル・銅メダル獲得【第51回技能五輪全国大会】
第49回技能五輪全国大会結果発表 敢闘賞受賞
第48回技能五輪全国大会結果発表(銀賞・敢闘賞受賞)
第47回技能五輪閉会式 & 結果発表
第46回技能五輪
<若年者ものづくり競技大会>
第14回若年者ものづくり競技大会
第11回若年者ものづくり競技大会 2日目&結果
第9回若年者ものづくり競技大会2日目(競技日)
第8回若年者ものづくり競技大会2日目
第7回若年者ものづくり大会
第6回若年者ものづくり大会2日目
第5回若年者ものづくり大会
第4回若年者ものづくり競技大会閉会式
月別アーカイブ
タグリスト 改

トライデントコンピュータ専門学校Webデザイン学科業界研究WCAN技能五輪ウェブデザイン職種ウェブデザイン若年者ものづくり競技大会Webサイト名古屋ポートフォリオ2013映画ECCコンピュータ専門学校学生ブログWebデザインWinterWebサイト制作1年生進級展2009WordPressJavaScript技能五輪全国大会卒業制作展2011礒田優オープンキャンパスアクアリングかっぱ商店街入学式卒展2014CSS石黒雄介a-blogWordpressWeb合同企業展ライトニングトークNagoyaアクセス解析cms矢野りんSummer閉館日瀬川大勝テンプレート作成卒業制作体験入学Autumn若年者ものづくり大会ホームページ・ビルダーCGイラスト学科面白法人カヤックWeb制作会社第48回技能五輪全国大会夏季閉館日佐藤歩学生インタビューHTML52012就職活動東京研修Flash名古屋駅ウェブデザイン技能競技会あいちカレーラーメンコンテストin2015大阪田中睦翔ウェブデザイン技能競技大会HCD2010プレゼンテーション杉本拓也IIJGIOhtml5mini夏休みJapanココストアAdobeCOMMUNICATION学生フォトアルバム専門学校99eagleSpring人間中心設計制作合宿NEXT上村水月UXブログパーツグリッドレイアウトCSS3ウェブデザイン技能検定jQuery北濱大輔2020CentOSWebクリエイター能力認定試験愛知県display:grid成田篤紀GridLayoutgifアニメ水野裕太林田実樹情報デザイン情報デザインフォーラムラーメンエイチームサイバーエージェントBananaAdプロジェクト水野怜美Google企業訪問WebデザインギャラリーWebワークショップセントレア2018トライデント祭りモリサワマールAnalytics名古屋市科学館株式会社スタメン沖縄松本渚SEOサーティファイコミュニケーションデザインワークショップ阿部淳也モンキーワークス産学協同CalendarAWARD和み冬休みiPhoneWebデザイナー結果発表空気人形スマートフォン5T(ファイヴティー)Advent鷹野雅弘茂森仙直写真ゴールデンウィーク長屋めぐみたこ焼きselect要素output要素名商連企業課題うぇーぶ1年生作品展スマホアプリNTTドコモ東海option要素textarea要素fieldset要素legend要素label要素form要素知多みるく愛知県選手団ナゴヤドームinput要素WEBサイト制作者のためのHCDの理解in名古屋戸田芳裕中日ドラゴンズまぼろしcanvasZoom謹賀新年熊谷佳紀幕張メッセForumAppleカメラ初期設定CSSNiteオンライン授業ワークショップトライデント合同企業展Yahoo!Japanイラストマップトライデントグループ制作particle進級制作展笈瀬本通り飯田淳介フロントエンドエンジニアアップルップルマークアップエンジニアウェブDeBLOGRunstantF-siteアンティー・ファクトリー信州アプリコンテスト[ゼロ]アサココ!アプリコンテストディプロスレイアウトFICC名古屋開府400年祭StoreLikeWebアプリメ~テレBoxWordCamp出張講座New豊田市美術館あけましておめでとうYear2017新年久保怜也Markup岩手県真鍋大度塚本碧jbstyleHappy導入授業ES6ES2015会社訪問静岡情報デザイン基礎ドラマPlugin株式会社LIGCMSWebリテラシー堀尾真衣鈴木優太ビジュアルエディタカリキュラムたにぐちまこと桝田草一WordFesポートフォリオサイト2008進級展卒業式学習DTPWORLDウェブアクセシビリティ作品集卒業・修了制作展金シャチ商店街広島弁タロヲ1→10designTHE細川太郎MagnumiPhone4ペルソナ商店街円JOY!mapシナリオビジュアルデベロップメントウェブデザイン部門NamunoplusWEB技能五輪予選英国王のスピーチ松坂屋美術館Untitled!!!!!!!!ablogcmsDTPの勉強部屋北岡弘至スタジオジブリ・レイアウト展トライデントカレッジ卒業制作・研究発表会2011ドラゴンゲートCustomSmiliesKtaistyle絵文字愛知淑徳大学アクセシビリティサーバーIAYORKE.プロトコル分析WEBサイト制作者のためのHCDの理解伊藤頼子柴乃櫂人ぬいぐるみのラパン名古屋メディアボンド笈瀬本通CODEポスターデザイン・コンペティション小林信次HPデザイン8341-3:2010X中部国際空港株式会社JIS増田悟名古屋サイト改善研究会名古屋市中村区中級編FLAVER3.0FLVデザインコンテスト01ブラザー工業株式会社株式会社アクアリングバルサマン石井研二大西健太知多半島田中稚妃呂3GoogleAnalyticsカメラワークLazyウェブリテラシー協会プロジェクションマッピング伊達千代Slimbox2Loadfor笈瀬本通商店街名駅経済新聞名古屋クリエイターフットサル横浜デジタルアーツ名古屋グランパスCODEポスターデザイン・コンペディショングラフィクデザイン中部国際空港チタハン10日本の四季みつけもの愛知県立芸術大学Andrioidキルト展JAPANWORLDCUPWEBサイト制作者のためのHCD(人間中心設計)の理解恵那市岩村カンファレンスUltimate商店サイト制作キルターズフェスティバル2011GA愛知商業高校名チャリCONTESTプチ・フレーズ三蔵丹下紘希GAINAXSUBARUTwitter放課後のプレアデスみの治商店ITCIRCUSNIKEインターネットスキル認定普及協会ライブペイント黒い太陽ウルトラ展国家検定西田幸司旭食品サンプル製作所食品サンプルActionScriptヱヴァンゲリヲン新劇場版:破ヤノベケンジカスタマイズセミナー日本ファルコム□□□switch山村浩二デコクレゲーム音楽CALENDARUNIQLO荒俣宏ファルコム音楽フリー宣言XRAY学科入賞ガンダムWebDirectionEast'08グラフィックデザイン後期Mozoramaモーション演習animationescalatorアニメーション今井佳子アイディグラフィックス電信柱エレミの恋ウサビッチカナバングラフィックス富岡聡コマ撮りアニメソバットシアター学生参加CMS特集2008WinterセキュリティGENOウィルス中村勇吾佐藤可士和SakaeVideopuppetryTEXTUREサムライASIAデッサンDesignCS4NightCollegePHP鳥取砂丘愛知県美術館アンドリュー・ワイエスデザイナーのためのプログラミング入門MAXFLEXFLASH鳥取造形基礎HTML+CSS基礎SIGGRAPHCOMPLETECHILDRENADVENTTokyoLabuatワークスコーポレーション「ヤノベケンジ-ウルトラ」展BlogUTZOOMVIIFANTASYWCAN×CSSNite西村真里子プレゼン演習ActionScript基礎広告批評TAFF'09FINALアートアニメーション武豊町CG・イラストコンテスト第4回アックゼロヨン・アワード慶華飯店新横浜ラーメン博物館横浜中華街SagmeisterデザインAndWasThereThenStefan箱根合宿森川眞行クリ博就職フェスタペルソナ&シナリオ法浅野智おかだよういち3校合同発表会横浜デジタルアーツ専門学校会社見学鎌倉日本電子専門学校Salsaウェブリテラシー協会第一回セミナー新世界道頓堀ナゴヤ武将都市求人大沢たかおポートピア名古屋フナ犬Artlessネスカフェゴールドブレンド名古屋おもてなし武将隊武豊アニメーションフェスティバル浜松W+KTokyo(+CRUZ)IA2010キックオフセミナー夢プロジェクト2009・成果報告会餃子福みつTAFFWCAN46Qubibiペルソナ/シナリオ法情報デザイン教育勉強会カラーストリートビューJAPANインターネットクリエイティブアワードYahoo!AutuminブランディングwonderflKyotodotFesHCDプロセス世界のCMフェスティバルITホワイトボックスナゴヤデザインウィーク2009UNIQLOCKギレン総帥LPO是枝裕和監督人喰いの大鷲トリコPHP勉強会大富豪スコアシート東京ゲームショウ2009Flash-Gamesゆるキャラスーパーエレメンツ山崎デザイン事務所デザインのへそコピーライティング長谷川恭久デュエル・マスターズHelveticaDRAGONヨウイチイラストコンテスト小野裕子#infoeduマークアップ演習マクロマリオネット映画のオープニング閉会式ごはんとFlashCREAM教育勉強会ロゴ公募FITCプロ野球Web制作合宿衣台高校尾鷲高校梅澤朝樹株式会社エイチーム山川綾那ノートPC貸与夏休みの課題AWARDS出身高校D3.jsスクラップブック鈴木雄太スタジオディテイルズSyntaxHighlighterv4.0.1ECMAScriptお母さんの二度見展マイクロソフトWCAN2017SpringProxy服部友厚佐藤洋介ターミナル学校TOCTableWebデザインスペシャルデー期末テスト北川パーヤンWorld)to脆弱性なんと読む?韓国藤井英一JIHYEHEOホ・ジヘWWW(Welcome友章堀川友章関口浩之安藤志維Contentsofフォントおじさんミス・ユニバース・ジャパン岐阜大会堀川志維安藤NCF2017Webプログラミング初級講座appendChild()プログラムクイズCodePenAO入試河地芳明沼田啓助JSBinJSFiddle涼麺jsdo.itCodeplyPlunkerカークスヴィルIA/UXプラクティスWebプログラマー坂本邦夫WebディレクターWeb制作のおしごと懇親会原一浩2016平野秀幸坂本貴史制作実績津田直明駅麺通りクイズ醐りょうインスタグラムいな世驛麺通りInstagram料理HTMLCollectionNodeList美大芸大再進学学園祭プラネタリアン水曜日のカンパネラResurgenceDay:Independenceタカガールサイト日清食品グループ情報系Monaca学生作品集ジムナストコロンイークリエイト冨田伴成MILK池田泰延メンバーズ三瓶ICSマイクロインタラクション株式会社COTSOriginalTshirt.st進級制作フロントエンド2019年令和2年足立丈也、平子卓哉、増田隼也eat信州アプリコンテストゼロ落合祐介杉浦麻紀markerフェンシングclasses株式会社LIGHTzスポーツアナリティクスエペ第3回専門学校HTML5作品アワード企業賞ニシヤマナガヤ未完美術館中村享介海老江優太Frontend名古屋市名東区2022令和3年神谷友理恵松本健太業界研究授業株式会社メイクリー小林健人emrem松井友奈パラサイト2020アカデミー賞vwvh小林隼大福田将也信州未来アプリコンテスト後期集中授業ライフスタイル仙直NextDoor前川元成斉藤洸貴cymaEC事業コーヒー用品メーカー・ブランド牧野史門株式会社サイバーエージェントあけおめ平成31年第56回技能五輪全国大会srcset東京ゲームショウ2018VRカルタ出前授業青山高校新城高校OculusGOsourcepicture沖縄県第56回UIデザインツールPhotoshopCS6株式会社アンティー・ファクトリー祐司髙橋茜音髙橋茜音茂森コンテストソレコン☆ポスコン2019STUDIOLIG日本総合ビジネス専門学校2020新卒線の群生Figma株式会社MTG企業見学CBCTBSわたし、定時に帰ります。新入生オリエンテーション合宿合同制作フジ家55麺屋ココイチさかなや晴れやか嵐が如く麺やOKカレーラーメンNCF2013美術大学芸術大学高橋雅人第51回技能五輪全国大会Webデザイン演習田代豊RhizomatiksプレゼンThree.js木下健太郎inspiredbyあいちトリエンナーレ2013そこにいない。展PARTYPerfumeNTTドコモ東海支社list-style-type備忘録栗山聡一parseFloat()parseInt()Designerconcrete5道家陽介宇野剛志石原愛実ランチ中村健太googleGWDHTML5スマートアプリ&クリエイティブコンテストKDDIモテ声ボーダーlist-itemdisplayジョルテ最優秀賞F81教室トライデント合同企業説明会10日でおぼえるLinuxサーバー入門教室卒業研究制作展就職東京敢闘賞迎春ツインメッセ静岡静岡県ロゴマーク2011年度ドコモNHNStationFuturedocomoメールマガジンOhanaライアン・ウッドワードプラネタリウムマーサ・グレアム5月11日Googleロゴ鈴木ゲーム大賞アマチュア部門東京ゲームショウ神戸神戸国際展示場イマジンカップTeam張山大祐画像をチェックボタンにするJQuery第50回結果Muse2021年佐藤ねじみんなのICTFacebookたこ焼きパーティ長野Illustrator第7回若年者ものづくり競技大会東京ゲームショウ2012尾花大輔Bloom*BlockBloosumTOKYOGAMESVGFacebookページベースキャンプ名古屋SHOWテーブルtableクリスマス東京コスモ熊﨑彩第53回ワクワク建設タウン3DCG松田洋樹FlexibleBoxFlexbox味仙CGスペシャリスト建設経営者倶楽部アクセシビリティからはじめる、WebサイトのUXデザイ木村哲朗夏麺フェア森田霞HighlighterSyntax竹中民男八木智章WebアクセシビリティVelocity.jsScrollMagicScrollmagic岡田陽一Dmm.comうぇ~~~~~~~ぶウェブアートデザイナーワイヤーフレーム仕事UIレスポンシブWebデザイン職業実践専門課程合同制作合宿専門士学位出席率バイドゥ平野健太郎KaizenPlatformアクティビティシナリオ源賢司UXデザイングロースハックグロースハッカーポートフォリオアイデア帳採用担当者の心に響く高校14Crayon2015年度名古屋市営地下鉄青空学区柏木祥太スパルタキャンプ岩出本店特別授業AO山田拓生加藤ひとみ西岡克真Animation丸田屋丸高八鬼山串本熊野古道マカベン名古屋マークアップ勉強会本州最南端那智の大滝アロチ本家和歌山中華そば熊野三山大門坂青山敬司結団式新年のご挨拶NCF2014親孝行麺の匠オリエンタル名古屋駅麺通りCSS3&jQueryで作る新入生WF1でBLOGインターンシップスマートフォンサイトUI図鑑第52回技能五輪全国大会HTMLアイテムカンパニーネイルサロンマウア授業アイチータ紅茶専門店Liyn-antype属性button要素datalist要素keygen要素optgroup要素GATE

メールフォーム

名前:
メールアドレス:
件名:
本文:

東京コスモ
トライデントコンピュータ専門学校
教務課のびのび日記
オフィス川口
Pagetop