Long description

Set 1 consists of 4 lines of H T M L code. Line 1: Open angle bracket figure close angle bracket at indentation level 0. Line 2: open angle bracket img s r c equals open double quotes 700 dot jpg close double quotes alt equals open double quotes ellipsis close double quotes close angle bracket at indentation level 1. Line 3: Open angle bracket figcaption close angle bracket Emirates Stadiumopen angle bracket forward slash figcaption close angle bracket at indentation level 1. Line 4: open angle bracket forward slash figure close angle bracket at indentation level 0.

Set 2 consists of five lines of JavaScript code. Line 1: figure open curly brace at indentation level 0. Line 2: padding colon 1 e m semicolon at indentation level 1. Line 3: background colon hash FFCC80 semicolon at indentation level 1. Line 4: width colon 200 px semicolon at indentation level 1. Line 5: close curly brace at indentation level 0. Output: An image on a yellow background is placed horizontally and is vertically aligned at 0 degrees.

Set 3 consists of three lines of JavaScript code. Line 1: figure open curly brace at indentation level 0. Line 2: transform colon rotate open parenthesis45deg close parenthesis semicolon at indentation level 1. Line 3: close curly brace at indentation level 0. Output: The image shown in the output of set 2 is shown rotated clockwise at 45 degrees.

Note: Notice that the transform affects all the content within the transformed container.

Set 4 consists of three lines of JavaScript code. Line 1: figure open curly brace at indentation level 0. Line 2: transform: skew open parenthesis minus 20 d e g close parenthesis semicolon at indentation level 1. Line 3: close curly brace at indentation level 0. Output: The image shown in the output of set 2 is shown skewed clockwise at 45 degrees.

Set 5 consists of three lines of JavaScript code. Line 1. figure img open curly brace at indentation level 0. Line 2: transform colon translatex open parenthesis100 p x close parenthesis translatey open parenthesis negative 30 p x close parenthesis semicolon at indentation level 1. translatex open parenthesis100 p x close parenthesis translatey open parenthesis minus 30 p x close parenthesis in line 2 is labeled You can combine transforms. translatey in line 2 is labeled Notice that the y hyphen axis extends downwards. A double-headed arrow placed vertically whose first half is bent to the right is placed at the top right of line 2. The bottom end of the double-headed arrow is labeled y and the top end that is bent to the right is labeled x. Line 3: close curly brace at indentation level 0. Output: The image shown in the output of set 2 is shown shifted toward the top right of the yellow background.

Set 6 consists of four lines of JavaScript code. Line 1: figure open curly brace at indentation level 0. Line 2. transform colon rotate open parenthesis15 d e g close parenthesis semicolon at indentation level 1. Line 3: close curly brace at indentation level 0. Line 4: figure img open curly brace at indentation level 0. Line 5: transform colon rotate open parenthesis45 d e g close parenthesis scale open parenthesis0 point 5 close parenthesis semicolon at indentation level 1. Line 6: close curly brace at indentation level 0. Output: The image shown in the output of set 2 is shown rotated at 45 degrees clockwise and scaled down by 0 point 5, while the yellow background is rotated at 15 degrees in the clockwise direction.