---
# System prepended metadata

title: '田皓洋隋堂筆記:face_with_spiral_eyes:'

---

# 114102田皓洋隋堂筆記 :money_mouth_face:
[老師的筆記](https://hackmd.io/@iamfefe)
## 自我介紹
我是田皓洋，我在資二1班級裡我在班級裡當一個甚麼事情都與我無關的腳色，過得相當輕鬆，沒甚麼事會被找上我。我很愛錢我==視錢如命==:money_mouth_face:跟錢過不去的事一律不做
## 這學年的目標
這學年我的目標是能夠確保我不會被當掉的前提下低空飛過及格門檻
## 全螢幕截圖
 1. F12
 2.  ctrl+shift+P
3. 打full 點紫色的按鈕
## 努力弄得自我介紹
 [自介](https://1141026.wixsite.com/114102)
## HTML練習標題0906
```htmlembedded=
<h1>HTML練習標題0906</h1>
 <h3>練習一</h3> 
 <p>這是內文</p> 
 <hr>水平線</hr>
<h3 style="color: 顏色 !important ">這改文字顏色的</h3> 
<h3 style="color: 顏色 !important ;background-color:blue;>背景色
           <h1 style="background-image: linear-gradient(to top, #fbc2eb 0%, #a6c1ee 100% );color:white !important"> 背景</h1>
```
<h1 style="color: #eb21d1 !important ">HTML練習標題0906</h1>
 <h3>練習一</h3> 
 <p>這是內文</p> 
 <hr>水平線</hr>
 <h3 style="color: 顏色 !important ;background-color:blue;"> 背景</h3>
<h1 style="color: 顏色 !important ;background-color:blue;">色碼</h1>
<h3>#F6F740、#E07BE0、#61E8E1、#DE3C4B、#03045E<h3>
 <h2 style="color: #F6F740 !important ">色碼標題</h2>
 <h2 style="color: #E07BE0 !important ">色碼標題</h2>
 <h2 style="color: #61E8E1 !important ">色碼標題</h2>
 <h2 style="color: #DE3C4B !important ">色碼標題</h2>
 <h2 style="color: #03045E !important ">色碼標題</h2>
 <h1 style="background-image: linear-gradient(to top, #fbc2eb 0%, #a6c1ee 100% );color:white !important"> 背景</h1>   

## 很屌的網站
    https://fanfan.fan/work/kicks/
    https://fanfan.fan/work/kicks/
    
    
<h1>昀澤田園有機風華</h1>
    <h2 style="color: #03045E !important ">工作分配 / 個人貢獻度報告</h2>
    
#### 田皓洋:耍廢、做出沒有美感的簡報、企畫書想鬼點子搞死大家、雞蛋寶介紹文
#### 吳承誼:跟老師討論企劃書修改、魚腥草寶寶介紹文
    
#### 徐敬崴:網站的按鈕連結及美編
    
   <h2 style="color:aqua!important">心得</h2>

#### 從這次的專題課程





![註解 2023-11-09 145218.png](https://hackmd.io/_uploads/HkD1f-97a.png)

![註解 2023-11-09 145252.png](https://hackmd.io/_uploads/H1E0bb9Xa.png)

![註解 2023-11-09 145237.png](https://hackmd.io/_uploads/H16CbW9Xp.png)

![T121BN0IW1.png](https://hackmd.io/_uploads/rkwDZbqXT.png)

```htmlembedded=
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>昀澤田園有機風華</title>
    <link rel="icon" href="魚腥草寶寶大頭照.png" />
    <style>
      /* 這裡是條文字的顏色 */
          body * {
            transition: all 1s ease;
          }
           {
            background-image: linear-gradient(120deg, #84fab0 0%, #8fd3f4 100%);
          }
          h1 {
            color: #FFA200 "
          }

          h2 {
            color: rgb(123, 111, 255) ;
            text-shadow: 0.5px 0.5px 20px blue ;
          }
          h3 {
            color: rgba(150, 250, 11);
          }
          h1:hover {
            color: bisque;
          }
          img:hover {
            margin-left: 50pt;
            border: 10pt dashed red;
            box: text-shadow 1pt 2px rgba(255,255,0);
          }
    </style>
  </head>
  <body>
    <!-- 這裡是標題 -->
    Hello 徐敬崴
    <h1 id="home">我是大標題1</h1>
    <h2>我是大標題2</h2>
    <h3>我是大標題3</h3>
    <h4>我是大標題4</h4>
    <h5>我是大標題5</h5>
    <h6>我是大標題6</h6>
    <h1>昀澤介紹</h1>
    <img src="https://picsum.photos/900/200" alt="" />

    <p>
      <b>Lorem ipsum</b> <br />dolor sit amet consectetur adipisicing elit.
      Totam voluptates consequatur suscipit voluptate perspiciatis pariatur?
      Unde iusto repellat optio perferendis fugit quis quia, numquam quod quo
      perspiciatis iste beatae eius. Sunt reiciendis nostrum maxime rerum
      doloribus odio excepturi maiores, ratione veniam aliquid, repellendus
      enim? Saepe reprehenderit, praesentium molestias nesciunt quos deleniti
      rem fuga velit perferendis fugit ducimus quaerat a ea. Ad voluptates unde
      eos velit quisquam, officia exercitationem voluptatibus est laborum illo
      explicabo totam perspiciatis! Omnis temporibus officia mollitia illum
      similique. Commodi amet totam debitis, a perferendis voluptatum veritatis
      dolor?
    </p>
    <p>
      Lorem ipsum dolor sit amet consectetur adipisicing elit. Totam voluptates
      consequatur suscipit voluptate perspiciatis pariatur? Unde iusto repellat
      optio perferendis fugit quis quia, numquam quod quo perspiciatis iste
      beatae eius. Sunt reiciendis nostrum maxime rerum doloribus odio excepturi
      maiores, ratione veniam aliquid, repellendus enim? Saepe reprehenderit,
      praesentium molestias nesciunt quos deleniti rem fuga velit perferendis
      fugit ducimus quaerat a ea. Ad voluptates unde eos velit quisquam, officia
      exercitationem voluptatibus est laborum illo explicabo totam perspiciatis!
      Omnis temporibus officia mollitia illum similique. Commodi amet totam
      debitis, a perferendis voluptatum veritatis dolor?
    </p>
    <p>
      Lorem ipsum dolor sit amet consectetur adipisicing elit. Totam voluptates
      consequatur suscipit voluptate perspiciatis pariatur? Unde iusto repellat
      optio perferendis fugit quis quia, numquam quod quo perspiciatis iste
      beatae eius. Sunt reiciendis nostrum maxime rerum doloribus odio excepturi
      maiores, ratione veniam aliquid, repellendus enim? Saepe reprehenderit,
      praesentium molestias nesciunt quos deleniti rem fuga velit perferendis
      fugit <i>ducimus quaerat</i> a ea. Ad voluptates unde eos velit quisquam,
      officia exercitationem voluptatibus est laborum illo explicabo totam
      perspiciatis! Omnis temporibus officia mollitia illum similique. Commodi
      amet totam debitis, a perferendis voluptatum veritatis dolor?
    </p>
    <p>
      Lorem ipsum dolor sit amet consectetur adipisicing elit. Totam voluptates
      consequatur suscipit voluptate perspiciatis pariatur? Unde iusto repellat
      optio perferendis fugit quis quia, numquam quod quo perspiciatis iste
      beatae eius. Sunt reiciendis nostrum maxime rerum doloribus odio excepturi
      maiores, ratione veniam aliquid, repellendus enim? Saepe reprehenderit,
      praesentium molestias nesciunt quos deleniti rem fuga velit perferendis
      fugit ducimus quaerat a ea. Ad voluptates unde eos velit quisquam, officia
      exercitationem voluptatibus est laborum illo explicabo totam perspiciatis!
      Omnis temporibus officia mollitia illum similique. Commodi amet totam
      debitis, a perferendis voluptatum veritatis dolor?
    </p>
    <h3>特色產品</h3>
    <ul>
      <li>魚腥草</li>
      <li>雞蛋</li>
      <li>蔥油餅</li>
    </ul>
    <h3>寄送方式</h3>
    <ol>
      <li>郵寄</li>
      <li>冷凍貨運</li>
      <li>自取</li>
    </ol>
    <!-- 這裡是最後面 -->
    <b>Design by Fefe</b>
    <a href="https://tw.yahoo.com/" target="_blank">連結到Yahoo </a>
    <a href="mailto:114103@clvsc.tyc.edu.tw">寫信給Nasa</a>
    <a href="#home">回首頁</a>
  </body>
</html>

```



<h1>專題比賽</h1>
<h2>雲創杯智慧創新應用競賽<h2>  
    
<h3>剛開始做專題的時候，因為是第一次做專題我也不知道該做什麼好，老師給了我們一個很好的合作對象，讓我們去解決合作對象遇到的困境和該怎麼幫她，在剛上課沒多久我們就想出了很多我覺得做不太到的東西，但是在我們投雲創杯入圍之後，我們想出的(Vtuber魚腥草寶寶、雞蛋寶)、行銷影片、商業分析、我們所想出的東西很快速的在大家的努力之下在短短的1~2周內完成了很多很多的東西，雲創杯現場很多學校專題都做得很厲害，他們做了非常非常的好感覺投入非常非常大量的時間，他們做出來的作品讓我的眼睛一亮，還有一組穿西裝穿皮鞋感覺非常有架式，我甚至在聽他們跟評審介紹作品時覺得他們感覺名次會很前面，結果和我想的布一樣</h3>

![![20231114_142735](https://hackmd.io/_uploads/r1gWyOWFa.jpg)
][reference]
    
<h1> 0111學習進度</h1>
<h2 style="color: #F47BB0 !important">上方按鈕導覽列</h2>

```htmlembedded=
<ul class="navbar-nav mr-auto">
            <li class="nav-item active">
              <a class="nav-link gogo" href="#FFF">主頁 <span class="sr-only">(current)</span></a>
            </li>
            <li class="nav-item">
              <a class="nav-link gogo" href="#UUU">影音資訊</a>
            </li>
            <li class="nav-item">
              <a class="nav-link gogo" href="#J">吉祥物</a>
            </li>
            <li class="nav-item dropdown">
              <a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">商品資訊</a>
              <div class="dropdown-menu" aria-labelledby="navbarDropdown">
                <div class="dropdown-divider"></div>
                <a class="dropdown-item gogo" href="#XDXD">(╯°□°）╯︵ ┻━┻</a>
              </div>
            </li>
            <li class="nav-item">
              <a class="nav-link gogo" href="#ABC">關於我們</a>
            </li>
          </ul>
```
<h2 style="color: #F47BB0 !important">主頁五張相片循環</h2>

```htmlembedded=
<div class="carousel-inner">
              <div class="carousel-item active">
                <img class="d-block w-100" src="images/51272_0 (2).jpg" alt="First slide">
                <div class="carousel-caption d-none d-md-block">
                </div>
              </div>
              <div class="carousel-item">
                <img class="d-block w-100" src="images/51236_0.jpg" alt="Second slide">
                <div class="carousel-caption d-none d-md-block">
                </div>
              </div>
              <div class="carousel-item">
                <img class="d-block w-100" src="images/51234_0.jpg" alt="Third slide">
                <div class="carousel-caption d-none d-md-block">
                </div>
              </div>
              <div class="carousel-item">
                <img class="d-block w-100" src="images/51204_0.jpg" alt="Third slide">
                <div class="carousel-caption d-none d-md-block">
                </div>
              </div>
              <div class="carousel-item">
                <img class="d-block w-100" src="images/51222_0.jpg" alt="Third slide">
                <div class="carousel-caption d-none d-md-block">
                </div>
              </div>
            </div>
```

<h2 style="color: #F47BB0 !important">影音資訊(插入超連結連至影片)</h2>

```htmlembedded=
<div class="container">
        <div class="col-lg-4">
          <ul class="list-unstyled">
            <li class="media">
              <img class="mr-3" src="images/thumbnail_1280X720.jpg" width="166.6" height="125" alt="Generic placeholder image">
              <div class="media-body">
                <h5 class="mt-0 mb-1"></h5>
                這是我們的介紹影片
            </li>
            
            <li class="media">
              <img class="mr-3" src="images/thumbnail_1280X720 (2).jpg" width="166.6" height="125" alt="Generic placeholder image">
              <div class="media-body">
                <h5 class="mt-0 mb-1"></h5>
                這是雞蛋寶的介紹影片
              </div>
            </li>
          </ul>
        </div>
      </div>
    </div>
```