digital:css:tips
差分
このページの2つのバージョン間の差分を表示します。
両方とも前のリビジョン前のリビジョン次のリビジョン | 前のリビジョン最新のリビジョン両方とも次のリビジョン | ||
digital:css:tips [2018/12/28 13:41] – [応用] paya | digital:css:tips [2018/12/28 13:51] – [応用] paya | ||
---|---|---|---|
行 80: | 行 80: | ||
.dotteButton01 { | .dotteButton01 { | ||
background: | background: | ||
- | background-image: | + | background-image: |
- | background-position: | + | background-position: |
- | background-size: | + | background-size: |
- | border: 2px inset rgba(108, 69, 138, 0.6); | + | border: 2px inset rgba(108, 69, 138, 0.3); |
border-radius: | border-radius: | ||
line-height: | line-height: | ||
padding: 0.4em 1.5em; | padding: 0.4em 1.5em; | ||
color: white; | color: white; | ||
- | font-size: | + | font-size: |
font-weight: | font-weight: | ||
+ | text-decoration: | ||
position: relative; | position: relative; | ||
- | transition-duration: | + | top: 0; |
- | box-shadow: | + | left: 0; |
+ | transition-property: | ||
+ | transition-duration: | ||
+ | box-shadow: | ||
+ | text-shadow: | ||
} | } | ||
.dotteButton01: | .dotteButton01: | ||
+ | background-image: | ||
top: 2px; | top: 2px; | ||
left: 1px; | left: 1px; | ||
text-decoration: | text-decoration: | ||
- | opacity: 0.7; | ||
box-shadow: | box-shadow: | ||
+ | transition-duration: | ||
} | } | ||
</ | </ | ||
行 105: | 行 111: | ||
<style type=" | <style type=" | ||
# | # | ||
- | display: inline-block; | ||
background: | background: | ||
background-image: | background-image: | ||
行 115: | 行 120: | ||
padding: 0.4em 1.5em; | padding: 0.4em 1.5em; | ||
color: white; | color: white; | ||
- | font-size: | + | font-size: |
font-weight: | font-weight: | ||
text-decoration: | text-decoration: | ||
行 122: | 行 127: | ||
left: 0; | left: 0; | ||
transition-property: | transition-property: | ||
- | transition-duration: | + | transition-duration: |
box-shadow: | box-shadow: | ||
text-shadow: | text-shadow: | ||
} | } | ||
# | # | ||
- | background-image: | + | background-image: |
top: 2px; | top: 2px; | ||
left: 1px; | left: 1px; | ||
text-decoration: | text-decoration: | ||
box-shadow: | box-shadow: | ||
+ | transition-duration: | ||
} | } | ||
</ | </ |
digital/css/tips.txt · 最終更新: 2018/12/28 13:55 by paya