黃昀婕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是自訂變數,定義一個動畫的名義

留言

這個網誌中的熱門文章

word file processing in python(python處理word檔案)