cssAudio - Activefile-genericCSS - ActiveGeneric - ActiveHTML - ActiveImage - ActiveJS - ActiveSVG - ActiveText - Activefile-genericVideo - ActiveLovehtmlicon-new-collectionicon-personicon-teamlog-outoctocatpop-outspinnerstartv

Pen Settings

CSS Base

Vendor Prefixing

Add External Stylesheets/Pens

Any URL's added here will be added as <link>s in order, and before the CSS in the editor. If you link to another Pen, it will include the CSS from that Pen. If the preprocessor matches, it will attempt to combine them before processing.

Quick-add: + add another resource

Add External Scripts/Pens

Any URL's added here will be added as <script>s in order, and run before the JavaScript in the editor. You can use the URL of any other Pen and it will include the JavaScript from that Pen.

Quick-add: + add another resource

Code Indentation

     

Save Automatically?

If active, Pens will autosave every 30 seconds after being saved once.

Auto-Updating Preview

If enabled, the preview panel updates automatically as you code. If disabled, use the "Run" button to update.

            
              <html>
<head>
<meta charset="UTF-8">
<link rel="shortcut icon" href="20160101.png"/>
<meta name="viewport" content="initial-scale=1,maximum-scale=1">
<meta name="description" content="這是一個介紹中正高中許以誠(Yicheng Hsu)的專屬網頁。您在尋找關於許以誠的資料嗎?">
<meta name="keywords" content="許以誠,刺刺星,刺星網,饅頭哥哥,電腦哥哥,以誠,徐以誠,許已成,ethan,hsu,yicheng,中正高中,正德國中,張龍,龍龍資訊站,vm3u3t/6">

<title>關於許以誠|About Yicheng Hsu</title>
<style type="text/css">
<!--
body {
	color: #333;
	background-color: #202020;
	margin-top: 0px;
	word-wrap:break-word;
	word-break: keep-all;
	font-family:"微軟正黑體";
	cursor:default;
}
::selection {
	background: #000;
	color: #FFF;
}
.left {
	color: #E65100;
	font-weight: bold;
}
a:link {
	color: #03638B;
	text-decoration: none;
}
a:visited {
	text-decoration: none;
	color: #03638B;
}
a:hover {
	text-decoration: none;
	color: #033756;
}
a:active {
	text-decoration: none;
}
#pic{
	position:fixed;
	bottom:0px;
	left:0px;
	z-index:990;
	text-align:left;
}
.thumbnail{
	border: 2px solid;
	border-color: #709F00;
	border-radius: 10px 0px 0px 0px;
	padding-left: 5px;
	padding-right: 5px;
	padding-bottom: 0px;
	width: 150px;
	float: left;
	margin-right: 20px;
	text-align: center;
}	
#main{
	padding-bottom:20px;
	width: 800px;
	background-color: #FFF;
	margin:0 auto;
}

table {
	width:750px;
}


@media screen and (max-width: 750px) {
    body {
		font-size:14px;
	}
	#main{
	width: 100%;
	}
	table{
		width:100%;
	}
	td{
		width:auto;
	}
}

.des{
	color: #D77B02;
	font-size: 10pt;
	font-weight: bold;
}

.kk{
	font-family:"Lucida Grande", "Lucida Sans Unicode";
}

.dif-table {
	background-color: #FFEB3B;
}

.done {
	text-decoration: line-through;
	color: #94AD03;
	opacity: .5;
}

.go-top-button {
	height:56px;
	width:60px;
	bottom:20px;
	right:20px;
	position: fixed;
}
-->
</style>
<script src="https://code.jquery.com/jquery-2.1.4.min.js"></script>
<script>
$(function(){	
	$(".goTop").click(function(){
		$("html,body").animate({scrollTop:0},1000);
		//$("html,body").animate({scrollTop:0},900,"easeOutBounce");
		return false;
	});
});
</script>
</head>

<body>


<div id="main">
<div style="background:rgba(255,98,166,1.00); color:#000; text-align:center">
	<span>本頁面將在 2016 年 9 月前完成全面更新,加入智慧顯示功能,屆時歡迎再度瀏覽。</span><br>
    <span onClick="$('#p_addxstarline').slideDown()" style="color:#FFF">更新時提醒我</span>
	<span id="p_addxstarline" style="display:none"><br><a href="https://line.me/ti/p/%40hzi5224b">加入刺刺星 LINE 官方帳號接收即時更新提醒</a></span>   
</div>
<div style="background:#444444; color:#FFF; padding: 50px 0; text-align:center">
<img src="20150217.png" width="180" alt=""/>
<p style="color: #FFF; font-size: 42px; line-height:0px; font-weight: bold;">許以誠</p>
<p style="color: #585858; font-size: 14pt; line-height:0px; color: rgba(255,255,255,0.3); text-transform:uppercase">Yicheng Hsu</p>
</div>
<div style="background:#689F38; color:#FFF; text-align:center; padding:5px 0;">
更新日期|2015-06-13
</div>
   <table border="0" align="center" class="m">
    <tr>
      <td height="82" align="left" class="left">英文姓名</td>
      <td><blockquote>
      <div style="float:left; padding-right:10px;">
      <p>Yicheng Hsu / Ethan Hsu</p>
      <p class="kk">[ˈɪθən ˈʃi]</p>
      </div>
      
      <div style="float:left;">  
       <iframe width="150px" height="100" scrolling="no" frameborder="no" src="https://w.soundcloud.com/player/?url=http%3A%2F%2Fapi.soundcloud.com%2Ftracks%2F86699079&amp;auto_play=false&amp;show_artwork=false&amp;color=ff9900"></iframe>
      </div>
      </td>
      </blockquote>
    </tr>
    <tr class="dif-table">
      <td align="left" class="left">性別</td>
      <td colspan="2"><blockquote>
        <p>男</p>
      </blockquote></td>
    </tr>
    <tr>
      <td align="left" class="left">身高/體重</td>
      <td colspan="2"><blockquote>
        <p>185 cm/72 kg</p>
      </blockquote></td>
    </tr>
    <tr class="dif-table">
      <td align="left" class="left">生日</td>
      <td colspan="2"><blockquote>
        <p>1996年08月22日</p>
      </blockquote></td>
    </tr>
    <tr>
      <td align="left" class="left">星座</td>
      <td colspan="2"><blockquote>
        <p>獅子座 (Leo)</p>
      </blockquote></td>
    </tr>
    <tr class="dif-table">
      <td align="left" class="left">語言</td>
      <td colspan="2"><blockquote>
        <p>中文/Chinese、英文/English、臺語/Taiwanese、緬甸話/Burmese</p>
        <p>文言文/Old-Chinese、注音符號、KK音標</p>
        <p>C語言/C Langusge、C++</p>
        <p>Java Script、Visual Basic、HTML、CSS、維基語/Wiki        </p>
        <p>五線譜、簡譜、火星文</p>
      </blockquote></td>
    </tr>
    <tr>
      <td height="365" align="left" class="left">興趣</td>
      <td colspan="2"><blockquote>
<p>網頁設計,軟體應用,作業系統,影音剪輯,影片調光,音樂製作,節目製作,</p>
<p>新聞製作,八卦狗仔,文書處理,動畫設計,資料彙整,照片攝影,相片編修,</p>
<p>中英快打,文字校對,英文教學,資訊教學,專題報導,程式寫作,數位建檔,</p>
<p>兒童心理,表情誇飾,音樂感覺,節拍節奏,文字設計,圖示繪製,效果模仿,</p>
<p>廣告宣傳,空間規劃,室內設計,弱勢關懷,話題辯論,魔術表演,電腦裝修,</p>
<p>詞曲創作,客戶服務,腳本撰寫,話題句點,邏輯推理,語言學習,英語應用,</p>
<p>創意構思,音效控制,DJ廣播,心理觀察,律法研究,簡化用字,節奏節拍,</p>
<p>形象管理,品牌經營,兒童語言,置入性學科教學方法,置入行銷,伏筆埋設,</p>
<p>廢物利用,數據分析,網路生態,資訊管理,資料搜索,資訊溯源,行銷策略,</p>
<p>趨勢追蹤,獨立思考,換位思考,活動企劃,客群鎖定,社群經營,旁白配音,</p>
<p>簡報設計,OS優化,網輿追蹤,僵局緩和,使用體驗,中英互譯,Search Engine Optimization</p>
      </blockquote></td>
    </tr>
    <tr class="dif-table">
      <td height="88" align="left" class="left">作品風格</td>
      <td colspan="2"><blockquote>
        <p>希望、正面、創新、具有留存價值、不會因時間久而退流行</p>
        <p>資訊技術結合文化創意</p>
        <p>會在作品發布後,不停的重複看,以便找出待改善處</p>

      </blockquote></td>
    </tr>
    
    <tr class="dif-table">
      <td height="222" align="left" class="left">特點</td>
      <td colspan="2"><blockquote>
        <p>對於玩線上遊戲不感興趣(改善:試著規劃一些時間在熱門遊戲上。)</p>
        <p>喜歡挑戰與其他人不同的頻率、思考邏輯、想法(改善:傾聽。)</p>
        <p>對於作品細節吹毛求疵      (改善:寬容。)</p>
        <p>講話少經修飾,易不經意重傷他人(改善:說話前思考一下。)</p>
        <p>對燃燒之菸草氣味過敏      (改善:以衣袖遮口鼻。)</p>
        <p>物質需求過低、太省吃儉用、花父母的錢有罪惡感(改善:自己打工。)</p>
        <p>不敢說髒話        (改善:以其他正面語詞與人交際。)</p>
        <p>好奇心維持在 12 歲小孩(改善:模仿大人的舉止讓自己更成熟。)</p>
        <p>不愛看醫生(改善:沒關係,把資源留給比我更需要的人。)</p>
        <p>從小什麼都要自己學,因為沒多餘的錢可以請老師教。</p>
        <p>貪心想一次做很多事(改善:試著把事讓給別人做。)</p>
        <p>說話太小聲(改善:嘗試為影片配上旁白,訓練說話聲量。)</p>
        <p>對他人的感謝常不好意思說出口(改善:以寫卡片方式取代)</p>
        <p>音樂播放中的耳機常捨不得摘下。</p>
        <p>對曾經幫助過自己的人,很難忘記恩情。</p>
        <p>不顧一切的幫助一個人,卻常常忘了自己。</p>
        <p>對作品產生難以忘懷的情感,就像自己的孩子一樣。</p>
        <p>我,只是幸運被送到這個世界玩一百年,既然只有一百年,何不勇敢玩到自己的目標呢?</p>
        <p>當廢物以龐大的數量聚集起來,總有一天會有用途的(如廣告LINE友、空罐。)</p>
        <p>製作時不喜歡套用預設的範本,對使用如 iMovie 快速製作出的作品感到不以為然。</p>
        <p>喜歡在作品設下彩蛋。</p>
        <p>對話時可直接回答最後真正要問的問題。</p>
      </blockquote></td>
    </tr>
    <tr>
      <td height="41" align="left" class="left">欣賞的人</td>
      <td colspan="2"><blockquote>不做作的人、心地善良的人、謙虛的人、
      值得學習效法的人、批評我的人、英文好的人、有想法的人</blockquote></td>
    </tr>
    <tr class="dif-table">
      <td height="165" align="left" class="left">討厭的人</td>
      <td colspan="2">
      <ul>
      <li>負面影響到別人的人</li>
      <li>讓狗隨地大便又不清理的人</li>
      <li>打斷別人專心做事的人</li>
      <li>在公共場合抽煙讓人聞到、又不去戒菸的人(0800-63-63-63)</li>
      <li>在圖書館聊天聲音大到吵到旁邊人的人</li>
      <li>以年紀區分地位的人</li>
      <li>指使人做事卻不說原因的人</li>
      <!--<li>散布未經查證的訊息的人</li>-->
      <li>毀損書籍的人</li>
      <li>不斷把「念書」掛在嘴邊的人</li>
      <li>自己做不到卻還要求別人做到的人</li>
      <li>自打嘴巴的人</li>
      <li>有嚴重刻板印象又不改的人</li>
      <li>只會用打罵的不講理方式來教小孩的家長</li>
      <li>講話一定要別人看他才會感到受尊重的人。</li>
	  <li>用錢堆積出來榮耀的人</li>
	  <li>假認真讀書的人</li>
      <li>浪費資源的人</li>
      <li>說「小孩不懂」、看不起小孩的人</li>
      </ul>
      </td>
    </tr>
    <tr>
      <td align="left" class="left">感謝的人</td>
      <td colspan="2"><blockquote>
        <p>陳麗玲老師、黃麗蓉老師、王怡楷老師、聖約翰科技大學柚子姐姐、陳美珠老師、李巧玲、林菩映、陳奕勝、吳灃晉、陳玲老師、蘇睦淳老師、陳雅萍老師、闕宏宇老師、吳常青老師、李建基老師、李憶慈老師、周中慧老師、翡翠、Jessamine Hu、
        洪政雄、</p>
      </blockquote></td>
    </tr>
    <tr class="dif-table">
      <td align="left" class="left">居住地</td>
      <td colspan="2"><blockquote>
        <p>新北市 New Taipei City</p>
      </blockquote></td>
    </tr>
    <tr>
      <td align="left" class="left">社群</td>
      <td colspan="2"><blockquote>
        <p><a href="https://bit.ly/ethan-googleplus" target="_blank">Google+</a></p>
      </blockquote></td>
    </tr>
    <tr class="dif-table">
      <td align="left" class="left">維基百科作品</td>
      <td colspan="2">

      <ul>
      <li><a href="http://zh.wikipedia.org/wiki/%E6%96%B0%E5%8C%97%E5%B8%82%E7%AB%8B%E6%AD%A3%E5%BE%B7%E5%9C%8B%E6%B0%91%E4%B8%AD%E5%AD%B8" title="新北市立正德國民中學" target="_blank">新北市立正德國民中學</a></li>
      <li><a href="http://zh.wikipedia.org/wiki/%E6%AD%A3%E5%BE%B7" title="正德" target="_blank">正德</a></li>
      <li><a href="http://zh.wikipedia.org/wiki/%E6%96%B0%E5%8C%97%E5%B8%82%E7%AB%8B%E4%B8%89%E6%B0%91%E9%AB%98%E7%B4%9A%E4%B8%AD%E5%AD%B8" title="新北市立三民高級中學" target="_blank">新北市立三民高級中學</a></li>
      <li><a href="http://zh.wikipedia.org/wiki/%E6%96%B0%E5%8C%97%E5%B8%82%E6%B7%A1%E6%B0%B4%E5%8D%80%E6%96%87%E5%8C%96%E5%9C%8B%E6%B0%91%E5%B0%8F%E5%AD%B8" title="新北市淡水區文化國民小學" target="_blank">新北市淡水區文化國民小學</a></li>
      <li><a href="http://zh.wikipedia.org/wiki/%E8%92%99%E7%89%B9%E9%9B%B7%E7%81%A3%E6%B0%B4%E6%97%8F%E9%A4%A8" title="蒙特雷灣水族館" target="_blank">蒙特雷灣水族館</a></li>
      <li><a href="http://zh.wikipedia.org/wiki/%E5%BC%B5%E9%BE%8D" title="張龍" target="_blank">張龍</a></li>
      <li><a href="http://zh.wikipedia.org/wiki/%E8%B6%85%E7%B4%9A%E5%81%B6%E5%83%8F" title="超級偶像" target="_blank">超級偶像</a></li>
      <li><a href="http://zh.wikipedia.org/wiki/%E5%BC%B5%E9%BE%8D_(%E6%AD%8C%E6%89%8B)" title="張龍 (歌手)" target="_blank">張龍 (歌手)</a></li>
      <li><a href="http://zh.wikipedia.org/wiki/%E8%87%BA%E5%8C%97%E5%B8%82%E7%AB%8B%E4%B8%AD%E6%AD%A3%E9%AB%98%E7%B4%9A%E4%B8%AD%E5%AD%B8" title="臺北市立中正高級中學">臺北市立中正高級中學</a></li>
      </ul>

      </td>
    </tr>
    <tr>
      <td height="152" align="left" class="left">學歷</td>
      <td colspan="2">
      <blockquote>
      <p>國小 - 新北市淡水區文化國民小學</p>
      <p>國中 - 新北市立正德國民中學</p>
      <p>高中 - 臺北市立中正高級中學</p>
      <p>大學 - Tamkang University Department of Information Management</p>
      </blockquote>      </td>
    </tr>
    <tr class="dif-table">
      <td align="left" class="left">        E-mail</td>
      <td colspan="2"><blockquote>
        <p><span class="ㄇ"><a href="mailto:ethan@xstar.me" target="_blank">ethan@xstar.me</a></span></p>
      </blockquote></td>
    </tr>
    <tr>
      <td align="left" class="left">LINE ID</td>
      <td colspan="2"><blockquote>
        <p>ethanhsu.5<a href="http://line.me/ti/p/UkQvs-NaZ8" target="_blank"><img src="http://media.line.me/img/button/zh-hant/20x20.png" width="20" style="margin-left:5px; vertical-align:middle;"></a></p>
      </blockquote></td>
    </tr>
    <tr class="dif-table">
      <td align="left" class="left">回饋</td>
      <td colspan="2"><blockquote>
        <p><span class="ㄇ">對於許以誠的作為有不滿意的地方嗎?<a href="https://docs.google.com/forms/d/1C-7c_zP7a6zMuvlyPUDBTSbcP604rgrrck4OFvPVVF4/viewform" target="_blank">點此</a>不記名免責大聲說</span></p>
      </blockquote></td>
    </tr>
    
    <tr>
      <td align="left" class="left">作品</td>
      <td colspan="2"><blockquote>
        <p><a href="/">刺刺星</a></p>
      </blockquote></td>
    </tr>
    
    <tr class="dif-table">
      <td height="56" align="left" class="left">運動</td>
      <td colspan="2">
      <blockquote>
      桌球、羽球、排球、撞球、念旁白、走路
      </blockquote>


      </td>
    </tr>
    <tr>
      <td height="163" align="left" class="left">待實現夢想</td>
      <td colspan="2">

<ul style="list-style-type:none;">
<li><input type="checkbox" disabled>本介紹頁面修正、更新</li>
<li><input type="checkbox" disabled>SQL 應用</li>
<li><input type="checkbox" disabled>API 應用</li>
	<li><input type="checkbox" disabled>學號查詢系統</li>
    <li><input type="checkbox" disabled>輿論系統</li>
    <li><input type="checkbox" disabled>幫助你出一張全創作專輯</li>
	<li class="done"><input type="checkbox" checked="CHECKED" disabled>用數位音樂製作一首歌</li>
    <li><input type="checkbox" disabled>語氣心情辨識系統&reg;</li>
    <li><input type="checkbox" disabled>客製化智慧遺書系統&reg;</li>
    <li><input type="checkbox" disabled>拍攝《獅子的眼淚》</li>
    <li><input type="checkbox" disabled>刺刺星旗下網站全面Mobile-friendly化</li>
    <li class="done"><input type="checkbox" checked="CHECKED" disabled>自己賺到 NT$10,000.00</li>
    <li class="done"><input type="checkbox" checked="CHECKED" disabled>做一首自己的歌</li>
    <li class="done"><input type="checkbox" checked="CHECKED" disabled>上到學習寫程式的課</li>
    <li><input type="checkbox" disabled>做一個線上遊戲,成名後,免費發點數給朋友</li>
    <li class="done"><input type="checkbox" checked="CHECKED" disabled>自己架一個網站</li>
	<li class="done"><input type="checkbox" checked="CHECKED" disabled>拍一部電影</li>    
    <li class="done"><input type="checkbox" checked="CHECKED" disabled>英文不要再全班倒數幾名</li>
    <li><input type="checkbox" disabled>變壞</li>
</ul>

      </td>
    </tr>
</table>
      <p align="center">
      <img src="../pic/my_sign.png" height="50" border="0"/>
      </p>
</div>

<div class="go-top-button">
<a href="#" class="goTop"><img src="http://long.xstar.me/pic/up-triangle.png" width="100%"></a>
</div>


<p align="center">
<!-- FC2計數器 開始 -->
<script language="javascript" type="text/javascript" src="http://counter1.fc2.com/counter.php?id=89331941"></script><noscript><img src="http://counter1.fc2.com/counter_img.php?id=89331941" /></noscript>
<!-- FC2計數器 結束 -->
<br>
<!-- FC2計數器 開始 -->
<script language="javascript" type="text/javascript" src="http://counter1.fc2.com/views.php?id=89331941"></script><noscript><img src="http://counter1.fc2.com/counter_now.php?id=89331941" /></noscript>
<!-- FC2計數器 結束 -->
<div hidden="true">
<script src="http://s1.twcount.com/stat.aspx?id=10139088&logo=1" language="javascript" charset="big5"></script>
</div>
</p>

<iframe style=" display:none" name="201505" id="201505"></iframe>
<form action="https://docs.google.com/forms/d/1akQ9kxISyXy0alZ5aCWUp5DV56zH3agbQHrkYZcOaVI/formResponse" method="POST" name="record" id="ss-form" target="201505" onsubmit="" style="display:none">
<input type="text" name="entry.1233971526" value="/ethan" class="ss-q-short" id="entry_1233971526" dir="auto" aria-label="進入網頁  " title="" >

<input type="text" name="entry.1985710326" value="Mozilla/5.0 (compatible; Googlebot/2.1; +https://www.google.com/bot.html)-------66.249.79.184-" id="entry_1985710326">

<textarea name="entry.1450033841" rows="8" cols="0" class="ss-q-long" id="entry_1450033841" dir="auto" aria-label="來自">
</textarea>
</form>
<script type="text/javascript">
document.record.submit();
</script>


</body>

</html>
            
          
!
999px
Loading ..................

Console