發表文章

目前顯示的是 9月, 2024的文章

使用VS CODE編制網頁

圖片
\ 介紹純文字編輯器EDITOR與瀏覽器BROWSER 介紹哈佛大學資訊科學課程CS505 上課內容HTML, CSS, JAVASCRIPT, PYTHON是哈佛大學CS50的主要內容 CSS是階層樣式表(Cascading Style Sheet)三種使用方式:線內(in-line)、內部(internal)、外部(external) CSS是階層樣式表三種使用方式:線內(in-line)、內部(internal)、外部(external) CSS三種使用方式: 線內(in-line): 在標記指令內STYLE="..." 內部(internal): 用STYLE/STYLE定義區塊 外部(external): 另外.CSS檔案,讀取指令LINK REL HREF= CSS內部(internal)法用STYLE/STYLE定義區塊 CSS內部(internal)就是使用網頁內STYLE/STYLE然後有三種設定方式:元素標記、類別CLASS、ID識別 JAVASCRIPT使用方式分:線內(in-line)、內部(internal)、外部(external),前者類似CSS內部法,而以SCRIPT/SCRIPT定義區塊 JAVASCRIPT三種使用方式: 線內(in-line): 只能使用於內建函數(方法) 內部(internal): 用SCRIPT/SCRIPT定義區塊 外部(external):另外.JS檔案,讀取指令SCRIPT SRC=/SCRIPT 程式語言最重要的三個結構: 函數function 、迴圈、判斷。 Paragraph, Click按下, ONCLICK按下滑鼠事件event 自己的名字按下執行
介紹純文字編輯器EDITOR與瀏覽器BROWSER 介紹哈佛大學資訊科學課程CS505 上課內容HTML, CSS, JAVASCRIPT, PYTHON是哈佛大學CS50的主要內容 CSS是階層樣式表(Cascading Style Sheet)三種使用方式:線內(in-line)、內部(internal)、外部(external) CSS是階層樣式表三種使用方式:線內(in-line)、內部(internal)、外部(external) CSS三種使用方式: 線內(in-line): 在標記指令內STYLE="..." 內部(internal): 用STYLE/STYLE定義區塊 外部(external): 另外.CSS檔案,讀取指令LINK REL HREF= CSS內部(internal)法用STYLE/STYLE定義區塊 CSS內部(internal)就是使用網頁內STYLE/STYLE然後有三種設定方式:元素標記、類別CLASS、ID識別 JAVASCRIPT使用方式分:線內(in-line)、內部(internal)、外部(external),前者類似CSS內部法,而以SCRIPT/SCRIPT定義區塊 JAVASCRIPT三種使用方式: 線內(in-line): 只能使用於內建函數(方法) 內部(internal): 用SCRIPT/SCRIPT定義區塊 外部(external):另外.JS檔案,讀取指令SCRIPT SRC=/SCRIPT 程式語言最重要的三個結構: 函數function 、迴圈、判斷。 Paragraph, Click按下, ONCLICK按下滑鼠事件event 吳孟儒按下執行

吳孟儒JavaScript控制網頁HTML文件Document

介紹純文字編輯器EDITOR與瀏覽器BROWSER 介紹哈佛大學資訊科學課程CS505 上課內容HTML, CSS, JAVASCRIPT, PYTHON是哈佛大學CS50的主要內容 CSS是階層樣式表(Cascading Style Sheet)三種使用方式:線內(in-line)、內部(internal)、外部(external) CSS三種使用方式:線內(in-line)、內部(internal)、外部(external) CSS內部(internal)法用STYLE/STYLE定義區塊 CSS內部(internal)就是使用網頁內STYLE/STYLE然後有三種設定方式:元素標記、類別CLASS、ID識別 JAVASCRIPT使用方式分:內部(internal)、外部(external),前者類似CSS內部法,而以SCRIPT/SCRIPT定義區塊 程式語言最重要的三個結構:函數、迴圈、判斷。 P代表PARAGRAPH段落,BUTTON按鍵,CLICK按下 ONCLICK命令,按下就執行後面的函數 JavaScript DOM=document,用JavaScript控制網頁文件 請吳孟儒按下 內建 W3SCHOOLS動畫 以下SCRIP(腳本)的開始是程式設計還是網頁

吳孟儒CSS類別CLASS名稱ID

2024上程式設計2nd課程 WIKIPEDIA科目CSS 哈佛大學CS50課程 CS50(電腦科學50)是哈佛大學、耶魯大學和牛津大學教授的線上電腦科學入門課程。2016 年,CS50向高中生開放成為進階先修課程。校園實體上課(on-campus)是哈佛大學最大的班級,有800名學生、102名教職員工以及多達 2,200名常出席的規黑客馬拉松參與者。[1][2] 此課程材料可在edX平台上免費線上獲取,並提供一系列收費證書。截至 2022 年,這個名為 CS50x 的線上版本教授C、 Python 、SQL、 HTML 、 CSS 和 JavaScript 語言。它還教授基本的電腦科學概念,包括陣列和資料結構以及Flask Web 框架。[3]課程的 2021 年迭代引入了三個關於電腦安全、人工智慧和技術倫理的新的附加講座。[4] 首席導師是哈佛大學教授大衛·馬蘭。[5] Doug Lloyd 和 Brian Yu [6]也是 CS50 課程的前成員及其講師。[7] Facebook共同創辦人馬克‧祖克柏和微軟前執行長史蒂夫‧鮑爾默曾做過客座講座。[8][9] CS50 課程於 1989 年首次在校園內出現。 還有幾個後續項目,重點關注網路程式設計、人工智慧、遊戲開發和行動應用程式。 格式 講座會被錄製並上傳到多種服務,包括iTunes U、EdX和YouTube。教授和志願學生也錄製了額外的影片「演練」。課程問題稱為問題集,簡稱為“psets”,有PDF和HTML格式。學生可以上傳問題集答案,有些問題會自動評分。學生還可以使用特殊的軟體來檢查他們在雲端的程式碼。 2016年,CS50成為第一個為學生提供完全在虛擬實境中觀看所有講座的可能性的大學課程。[ 10 ] 2022 年,課程從 CS50 IDE轉移到基於GitHub程式碼空間的VS Code網路版本,現在課程提供4K HDR和 SDR 版本。[ 11 ] 後續課程 CS50 提供多種後續課程,包括: CS50 Web 程式設計電腦科學 - 更深入了解HTML、CSS和JavaScript,以及包含Django和React在內的框架。[ 12 ] CS50 的Python人工智慧簡介- 涵蓋搜尋演算法、機器學習和人工智慧。[ 13 ] CS50 的遊戲開發簡介 - 教授U...

吳孟儒text editor文字編輯器CSS動畫animation

<style> .abc{ margin: 50px; width: 200px; height: 100px; background-color: yellow; border: 1px solid black; transform: scale(2,3); } H2{background-color:gray; color:yellow; text-align: center; } h1{ border: 20px solid darkgreen; height:60px; background-color: orange; color: white; animation: mymove 5s infinite; text-align: center; border-radius: 50px; }/*註解給人看電腦跳過radius半徑,diameter直徑*/ @keyframes mymove { 50% {transform: rotate(-10deg);} } </style> <h1>德明科大吳孟儒程式設計</h1> <p style="font-size: 20px; text-height: 1.5;">第一堂課要了解文字編輯器(text editor)、程式解譯器(interpreter)、程式編輯器(compiler)與程式整合開發環境(IDE, Integrated Development Environment)。</p> <p style="font-size: 20px; text-height: 1.5;">課程評分是「自己動手做的程度、品質、了解程度、自我發揮的創意。「動手做」絕對重要!有做,就及格,可以做得慢、可以補教、可以請同學或老師帶你一步一步地做。</p> <h2>CSS=Cascading Style Sheet</h2> frame框架,寬度width <h2>第一次上課影片</h2> <iframe width="560" heig...

吳孟儒text editor文字編輯器CSS動畫animation

 <style>  h2 {color: yellow; text-align: center; background: blue; font-weight:bold; font-style: italic ; } h1{   border: 10px solid purple;   border-radius: 30px;/*diameter直徑,radius半徑*/   background-color: orange;   color: white;   animation: my 5s infinite;   text-align: center; } /*註解border邊界, animation動畫, align排列*/ @keyframes my{   50% {transform: rotate(-10deg);} } </style> <h1>德明科大吳孟儒程式設計</h1> <p style="font-size: 20px; text-height: 1.5;">第一堂課要了解文字編輯器(text editor)、程式解譯器(interpreter)、程式編輯器(compiler)與程式整合開發環境(IDE, Integrated Development Environment)。</p> <p style="font-size: 20px; text-height: 1.5;">課程評分是「自己動手做的程度、品質、了解程度、自我發揮的創意。「動手做」絕對重要!有做,就及格,可以做得慢、可以補教、可以請同學或老師帶你一步一步地做。</p> <h2>以上畫面的程式碼</h2> <H2>HEADER因為HTML允許大小寫</H2> <H2>今天重點CSS動畫</H2> CSS=Cascading Style Sheet階層式樣式表 cascade連續的、階層的瀑布 my是自訂變數,定義一個動畫的名稱。