CSS強大的功能,可以讓你實作出任何想要的外觀樣式,以下的記事本樣式即是一例。

你可以透過很多方式實作此種類型的樣式,這個案例由於要讓使用者可以輸入文字,其中採用了 li 標籤進行內行的實作,同時設定了contenteditable屬性,如此一來此記事本內容即可編輯。
記事本的外觀則配置陰影以呈現立體效果,並設定圓角樣式。

你可以透過很多方式實作此種類型的樣式,這個案例由於要讓使用者可以輸入文字,其中採用了 li 標籤進行內行的實作,同時設定了contenteditable屬性,如此一來此記事本內容即可編輯。
記事本的外觀則配置陰影以呈現立體效果,並設定圓角樣式。
ul {
list-style: none;
background-color: lightyellow;
box-shadow: 4px 4px 4px lightgray;
width: 600px;
border-radius: 1%;
border: 1px solid black;
height: 600px;
padding: 40px 40px 4px 80px;
}
li {
border-bottom: 1px dotted gray;
font-size: 18px;
}
沒有留言:
張貼留言