自我扩展‘
type 中date属性
自我
控制编辑区域的 ::-webkit-datetime-edit { padding: 1px; background: url(…/selection.gif); } 控制年月日这个区域的 ::-webkit-datetime-edit-fields-wrapper { background-color: #eee; } 这是控制年月日之间的斜线或短横线的 ::-webkit-datetime-edit-text { color: #4D90FE; padding: 0 .3em; } 控制年文字, 如2017四个字母占据的那片 ::-webkit-datetime-edit-year-field { color: purple; } 控制月份 ::-webkit-datetime-edit-month-field { color: blue; } 控制具体日子 ::-webkit-datetime-edit-day-field { color: green; } 这是控制上下小箭头的 ::-webkit-inner-spin-button { visibility: hidden; } 这是控制下拉小箭头的 ::-webkit-calendar-picker-indicator { border: 1px solid #ccc; border-radius: 2px; box-shadow: inset 0 1px #fff, 0 1px #eee; background-color: #eee; background-image: -webkit-linear-gradient(top, #f0f0f0, #e6e6e6); color: #666; }
先是鼠标箭头 就是 修改鼠标样式
<div style="cursor: pointer;">手形</div> <div style="cursor: move;">移动</div> <div style="cursor: progress;">正在执行</div> <div style="cursor: crosshair;">十字形</div> <div style="cursor: text;">文本编辑I</div> <div style="cursor: help;">帮助</div> <div style="cursor: wait;">等待</div> <div style="cursor: inherit;">继承父元素样式</div> <div style="cursor: auto;">自动(遇到文本变I,遇到链接变手形,遇到可扩展边缘变向各方向拉伸形状……)</div> <div style="cursor: default;">默认(箭头)</div> <div style="cursor: e-resize;">向右变形(东east)</div> <div style="cursor: ne-resize;">向右上变形</div> <div style="cursor: nw-resize;">向左上变形</div> <div style="cursor: n-resize;">向上变形(北north)</div> <div style="cursor: se-resize;">向右下变形</div> <div style="cursor: sw-resize;">向左下变形</div> <div style="cursor: s-resize;">向下变形(南south)</div> <div style="cursor: w-resize;">向左变形(西western)</div>
css appearance属性
浏览器支持
所有主流浏览器都不支持 appearance 属性。
Firefox 支持替代的 -moz-appearance 属性。
Safari 和 Chrome 支持替代的 -webkit-appearance 属性。
实例
使 div 元素看上去像一个按钮:
代码如下:
div { appearance:button; -moz-appearance:button; /* Firefox */ -webkit-appearance:button; /* Safari 和 Chrome */ }
值 | 描述 |
normal | 将元素呈现为常规元素。 |
icon | 将元素呈现为图标(小图片)。 |
window | 将元素呈现为视口。 |
button | 将元素呈现为按钮。 |
menu | 将元素呈现为一套供用户选择的选项。 |
)。 | |
window | 将元素呈现为视口。 |
button | 将元素呈现为按钮。 |
menu | 将元素呈现为一套供用户选择的选项。 |