3582285104
Budując strony HTML, ich wygląd powstaje przez zastosowanie kaskadowych arkuszy stylu: CSS. W wersji CSS3 występuje właściwość: transform. Między innymi można użyć transformacji dwu wymiarowych (2D), w szczególności:
• obrotu: rotate(kąt). kąt wyrażony np. w stopniach. 23° zapisujemy rotate(23deg),
• przesunięcie: translate(x,y), x, y wyrażony w pikselach, np. translate(10px,0px)
• skalowanie: scalę(x,y), skalowanie poziome i pionowe wyrażone w wartości ułamka dzie-sięt nego.
Uwaga: Na czerwono
zaznaczone są elementy macierzy, które dla każdej transformacji 2D mają tą samą podaną tu wartość.
Można też użyć dowolnego przekształcał La wyrażonego macierz;).:
|
<*11 |
<*12 |
0 |
<*14 |
|
<*21 |
<*22 |
0 |
<*24 |
|
0 |
0 |
1 |
0 |
|
0 |
0 |
0 |
1 |
matrix («i!, , «i2. «22, «i4<
... . 021 n22 Ił <*24 , .
odpowiada macierzy: n n 1 n (*)
Sama operacja macierzowa:
|
<*11 <*12 0 <*14 |
’ X |
’ x' | ||
|
<*21 <*22 0 <*24 |
y |
2f | ||
|
0 0 10 |
0 |
0 | ||
|
0 0 0 1 |
1 |
1 |
Uwaga: trzeci wiersz i trzecia kolumna są związane z trzecim wymiarem.
Na stronie: http://www.w3.org/TR/css3-transforms/ można znaleźć przepis, jak zamienić te 3 operacje na macierz. Przykładowo, transformacja translate(a,b) jest zapisana jako macierz:
’ 1 O O a '
0 10 b 0 0 10 0 0 0 1
Aby zamienić ciąg transormacji należy każdą z nich zapisać w postaci macierzy 4 x 4, pomnożyć przez siebie, a potem zapisać w postaci matrix(.....), wg wzoru (*).
Wykonaj opowiednie obliczeń Li dla przykładu poniżej, aby elementy <div> pokryły się na stronie.
<!DOCTYPE html>
<html><head><meta charset«"utf-8"xtitle>Nowa MZ</title>
<style type-"text/css">
body font-size:20px; margin:0px 100px;
div position:absolute; top:200px; left:200px; width:100px; height:100px; background-color:rgba(180,220,180,0.2)jborder: lpx dotted red;
|
#el2 transform: matrix( |
U U U L |
uu |
UUUUUU |
UUUUUU | ||
|
UUUUUU |
UUUUUU |
UUUUUU |
); | |||
</style></head> <body><hl>Transformacja</hl> <div id-"ell">el l</div>
<div id*"el2">el 2</div> </body></html>
Wyszukiwarka
Podobne podstrony:
egzamin cz2 ocenione na 4.5 pytanie: Przy zastosowaniu kaskadowego arkuszu stylów(...) odp: ustawion
L5. Kaskadowe arkusze stylów CSS. Struktura pliku stylu. Osadzanie stylów w dokumencie HTML. L6. Skr
Wykład 2_2 - Tl NT Kaskadowe arkusze stylu Tabele, zastosowanie znaczników div Zofia Kruczkiewi
352 Badanie sił przyrody i ocena pożytecznej ich wartości. zyskała pierwsze zastosowanie praktyczne
PEROKSYSOMYI GLIOKSYSOMY POWSTAJĄ PRZEZ PĄCZKOWANIE Z SIATECZKI ŚRÓDPLAZMATYCZNEJ. ICH POJEDYNCZA BŁ
Rodzaje wapna i jego zastosowania Mleko wapienne - zawiesina powstała przez rozcieńczenie ciasta wap
Maciej Szmit dokumentów przedstawionych przez strony), bez ich starannego sprawdzenia216, które zres
chemia mat bud041 Tworzywa porowate powstają przez spienienie polimerów lub żywic przed ich utwardze
Do monosacharydów zalicza się również proste ich pochodne np.: -aminocukry- powstałe przez podstawie
Do monosacharydów zalicza się również proste ich pochodne np.: -aminocukry- powstałe przez podstawie
Geologia wyklad 4 F 06 (W 06) Jeziora przy brzeżne Jeziora przybrzeżne (przymorskie) - powstały prz
złącze spawane ZŁĄCZE SPAWANE Złącze spawane jest połączeniem materiałó.. powstałym przez »ch mtejsc
img039 (np przez zastosowanie aldehydu glutarowego o wzorze: CHO-(CH2)3-CHO), wymuszoną flokulację k
więcej podobnych podstron