Home > Developer > Web Develop
21st Lesson:
Inline elements, also known as inline elements, are primarily to control the words within a line:
Such as: span, not the exclusive row, cannot set the width height, the vertical direction cannot set the margin and the pading value, but can set in the horizontal direction oh. (because it only works within a single line)
Block elements: Common such as: Div.
Lesson 22nd: Inline and blocky transformation
Changed from inline to blocky;
{background: bule; width: 200px; height: 200px; /* the following line can be changed from inline to block; */ Display: block; }Changed from block to inline:
{ width: 200px; height: 200px; background: Orange; display: inline;}23rd Lesson: CSS Controls paragraph text:
P Tag: denotes a passage;
{background: Gray; text-indent: 20px; /* paragraph indent */ text-align: Center; }</style><body> <p id = "P1" > I am Shing;</p></body>Others, you can refer to the manual of CSS.
24th Lesson: Text control in the paragraph;
Font-style, Font-weight, Font-size, Line-eight, et;
The 25th lesson: the precise control of the text;
The choice of font, such as black, Ya Black, new song, Ah, The Times, with font-family control;
The 26th lesson background and picture;
{background-image: url (1,jpg); background-repeat: no-repeat; background-position:}</stype>27th Lesson: Large picture as background;
28th Lesson CSS Selector;
The description of the CSS can be described by ID, or it can be controlled with a class, or it can be controlled by a div;
Common are: ID selector, class selector, tag selector, derivative selector;
29th lesson: CSS Priority;
I summed up a principle: the more accurate the control, the higher its priority;
The 30th lesson: CSS Way;
The first kind: <style> </style>
The second kind: specially writes a CSS file, uses the <link > to introduce;
The Third Kind: can import other CSS file;
The fourth kind: can write the style directly in the label;
Every 31 lessons: initialization of CSS;
The same elements, such as Li, are displayed slightly differently under different browsers, because each browser has a slightly different default value for each element, and in order to prevent this, we force all elements to have the same attribute value through CSS, which is the initialization of CSS;
32nd Lesson: HTML Learning Mind Mapping;
33rd lesson: H tag and P tag;
H1-6 Series is the title, the word is getting smaller;
P denotes paragraph;
34th lesson: IMG Image tag;
This introduced: , it is a single closed tag;
Lesson 35th: Is the image inline or blocky?
The answer is: The image is a special inline element, called the replacement element, can be set wide and high, usually in the initialization of CSS will be the IMG element into block.
36th Lesson: There are sequence lists and unordered lists;
Unordered lists such as:
<ul> <li> Spring </li> <li> Summer </li></ul>
There are sequence tables:
<ol> <li> Spring </li> <li> Summer </li></ol>
The 37th lesson: neat Forms;
It is labeled <table>; labeled <tr> add rows, with <td> add columns;
Alternatively, you can merge rows and columns with the keyword: colspan and rowspan;
The rest of the control is given to CSS to achieve it;
38th lesson: Hyperlink tags;
The label for the link is:<a>, which can be said:
<a href = "url" > content displayed </a>
Note the question: How can you make it pop out a new page? <a href = "url" target = "_blank (it represents the default of its own page" > what is displayed </a>
If the title is added, the mouse will be displayed after placing it;
39th lesson: Anchor Point;
such as: <a name = P1> </a>, its role is to give a larger page positioning;
40th Lesson: CSS A-tag pseudo-class
CSS allows us to set the properties of each CSS for the 4 states of the a tag, namely its pseudo-class, four states: A:link, a:visited, A:hover, a:active, note: they are sequential;
41st Lesson: Character entities;
In the development of HTML, some characters are not suitable to speak directly, is afraid of the symbol in the HTML conflict Ah, such as: <, >, "and so on; General & + entity name +; entities have a lot of oh;
第42-47 Lesson: Home Layout Combat
48th Lesson: Use row height, set the vertical center of text;
The 49th lesson: IE Bug and compatibility test, solve some small compatibility problems;
The 50th lesson: color has the expression;
1, the color is represented by a number, 2: The color is composed of 3 primary colors, RGB; 3:3 Primary colors vary between "0-255";
All in all: the material is a combination of 3 primary colors, 1, with 16 binary combinations, from [00–FF], such as: #0F15D2; 2, with 10 binary combinations, such as: rgb (102,45,201), 3, with the common color provided by HTML, such as Organge, pink, purple, Red
51st Lesson: The Representation of dimensions:
1: Can be expressed in pixels, 2, can be expressed as a percentage, the percentage of the parent element, 3, can be expressed in EM, it is relative size, refers to the font-size of its parent represents an EM unit;
52nd lesson: CSS Draw rounded corners;
Use CSS Border-radius to control the radius of the fillet;
The 53rd lesson: check positioning and absolute positioning;
Relative positioning refers to: relative to the normal position, offset some elements; position:relative; Top: * *; Left: * *;
Absolute positioning is relative to the parent element, and with absolute positioning, the parent element is required to have a property of position, otherwise it will be based on the parent's parent, or go up again until there is a Posiiton attribute;
54th Lesson: overflow overflow treatment;
With overflow label to deal with, can visible, can hidden, can scroll;
55th lesson; forms;
When the user registers, the online registration and so on occasions, needs the user's information to submit;
56th lesson: framework set;
Use Fromset to deal with;
Simple learning of HTML and CSS
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
