CSS3 lietotāja interfeiss
- Detaļas
- Publicēts Trešdiena, 30 Novembris -0001 01:36
- Skatīts: 198
CSS3 User Interface
CSS3 ir jaunas lietotāja interfeisa funkcijas, piemēram, izmēru maiņas elementi, iezīmē, un kārbas izmēriem.
Šajā nodaļā Jūs uzzināsiet par šādiem lietotāja interfeisa īpašības:
mainīt
izklāstīt-ofseta
Browser Support
Tabulā skaitļi precizē pirmo pārlūka versiju, kas pilnībā atbalsta īpašumu.
Numbers seko -webkit- vai -moz- norādīt pirmo versiju, kas strādāja ar prefiksu.
Property | |||||
---|---|---|---|---|---|
resize | Not supported | 4.0 | 5.0 4.0 -moz- |
4.0 | 15.0 |
outline-offset | Not supported | 4.0 | 5.0 4.0 -moz- |
4.0 | 9.5 |
CSS3 mērogošanas
Izmainīsiet
īpašuma nosaka, vai ir vai nav elements ir ar maināmu lietotājs.
Nākamajā piemērā ļauj lietotājam mainīt tikai platumu <div> elementu:
Nākamajā piemērā ļauj lietotājam mainīt tikai augstumu <div> elementu:
Nākamajā piemērā ļauj lietotājam mainīt gan augstumu un platumu <div> elementu:
CSS3 Outline Nobīde
Kontūra-ofseta
īpašums piebilst atstarpi starp izklāstu un malas vai robežas elementa.
Kontūras atšķiras no robežām divos veidos:
- Izklāsts ir līnija novilkta ap elementiem, ārpus pierobežas malas
- Izklāsts nav aizņem vietu
- Kontūra var būt ne-taisnstūra
Nākamajā piemērā izmanto kontūras-kompensēt īpašumus, lai pievienotu 15px atstarpi starp robežu un izklāstu:
Piemērs
border: 1px solid black;
outline: 1px solid red;
outline-offset: 15px;
}
Izmēģiniet to pats »
CSS3 User Interface Properties
Tabulā ir uzskaitīti visi lietotāja interfeisa īpašības:
Property | Description |
---|---|
box-sizing | Allows you to include the padding and border in an element's total width and height |
nav-down | Specifies where to navigate when using the arrow-down navigation key |
nav-index | Specifies the tabbing order for an element |
nav-left | Specifies where to navigate when using the arrow-left navigation key |
nav-right | Specifies where to navigate when using the arrow-right navigation key |
nav-up | Specifies where to navigate when using the arrow-up navigation key |
outline-offset | Adds space between an outline and the edge or border of an element |
resize | Specifies whether or not an element is resizable by the user |