MindMap Gallery html markup method
Come in and learn how to mark up HTML! The author’s own mind map of learning and summary is shared with everyone! HTML is called Hypertext Markup Language and is a markup language. It includes a series of tags. These tags can unify the document format on the network and connect scattered Internet resources into a logical whole. I hope that beginners on the Internet can have a clear understanding of this. Download and learn now!
Edited at 2019-04-16 00:50:43This is a mind map about bacteria, and its main contents include: overview, morphology, types, structure, reproduction, distribution, application, and expansion. The summary is comprehensive and meticulous, suitable as review materials.
This is a mind map about plant asexual reproduction, and its main contents include: concept, spore reproduction, vegetative reproduction, tissue culture, and buds. The summary is comprehensive and meticulous, suitable as review materials.
This is a mind map about the reproductive development of animals, and its main contents include: insects, frogs, birds, sexual reproduction, and asexual reproduction. The summary is comprehensive and meticulous, suitable as review materials.
This is a mind map about bacteria, and its main contents include: overview, morphology, types, structure, reproduction, distribution, application, and expansion. The summary is comprehensive and meticulous, suitable as review materials.
This is a mind map about plant asexual reproduction, and its main contents include: concept, spore reproduction, vegetative reproduction, tissue culture, and buds. The summary is comprehensive and meticulous, suitable as review materials.
This is a mind map about the reproductive development of animals, and its main contents include: insects, frogs, birds, sexual reproduction, and asexual reproduction. The summary is comprehensive and meticulous, suitable as review materials.
html tag
mark
<h1>-<h6>
Font size from level one to level six
Bold font
There is vertical white space in the vertical direction
Mark content can be displayed on its own line
<p></p>Paragraph element
There is vertical white space in the vertical direction
The marked content can be displayed in its own area
Attributes:
align: value
left
right
center
Sets the horizontal alignment of text
<hr>Horizontal dividing line
Attributes:
size: Set the height of the horizontal dividing line, the value is a number, the unit is px
width: Set the width of the horizontal dividing line, the value is a number, the unit is px or %
color: color
align: alignment value:
left
right
Special symbols:
represents a space < represents the left angle bracket > represents the right angle bracket © Representative circle c ® stands for circle R
Text style tag:
<b>Bold</b> <u>Underline</u> <s>Delete</s> <i>Tilt</i> <sup>Superscript</sup> <sub>Subscript</sub
Preformatted: Preserves the format of the source document (space or newline) <pre></pre>
Attribute: align value:
left(left)
right(right)
center(中)
Block partition elements:
<div></div>
Attribute: align
left(left)
right(right)
center(中)
Row partition elements: <span></span>
Inline elements: the marked content is written out Show in an area
span,b,u,s,i,sup,sub
Block elements: markup content written out alone Occupying an area for display, all have the align attribute.
h1,h2,h3,h4,h5,h6,p,hr,pre,div
<img>
Attributes:
src: write path
.width: Set the width of the image, the value is a number, Unit px
height: Set the height of the image, the value is a number, Unit px
Note: When changing the width and height of the picture, you only need to change For one of the values, the other value will be scaled proportionally.
alt: When the image fails to load, give the user a prompt
Hyperlink <a></a>Attributes:
href: path value: #
Anchor: # value of id
target: Set the method value for opening a new window:
_self: Open in the current window
_blank:Open in new window
Comment: Write comments on the code: <!--Write the content of the comment in the middle-->
sheet:
Rows include several cells, columns cannot include rows
<table> <tr> <td>Cell</td> </tr> </table>
table properties:
1.border: Set the border of the table, the value is a number, no unit
2.width: Set the width of the table, the value is a number, The unit is px
3.height: Set the height of the table, the value is a number, The unit is px
4.bgcolor: Set the background color of the table
5.align: Set the alignment value of the table:
left
center
right
6.cellspacing: Set the spacing between cells, The value is a number in px
7.cellpadding: Set the distance between the cell content and the border line, The value is a number in px
Attributes of tr:
align:left center right
valign: Set the content in the line tag to vertical alignment
Value: top(upper) middle(center) bottom(lower)
bgcolor: Set the background color of the row
Attributes of td:
width: Set the width of the cell, the value is a number, the unit is px
height: Set the height of the cell, the value is a number, the unit is px
bgcolor: Set the background color of the cell
align: Set the horizontal alignment of cells
valign: Set the vertical alignment of cells top middle bottom
colspan: merge across columns, the value is a number, There is no unit, and the value spans several columns.
rowspan: merge across rows, the value is a number, There is no unit, the value spans several rows.
Lists: list types and list items
ordered list
<ol> <li></li> </ol>
Attributes of ol:
type: value:
1
a
A
i
I
start: value is a number, There is no unit, and the number of the defined list starts from
unordered list
<ul> <li></li> </ul>
Attributes of ul:type:value:
disc: solid dot
circle:Period
square: solid square
none:empty
custom list
Mostly used in situations where graphics and text are mixed.
<dl> <dt>List title</dt> <dd>List items</dd> </dl>
form
<form></form>
Input box<input>
Attribute: type
text: input text
password: password box
button: button
submit: submit button
reset: reset button
file: upload file
radio: radio button
checkbox: checkbox
checked: pre-selected
maxlength: Set the maximum length of the input box content
name: defines the name of the control
placeholder: placeholder
value: write the value of the control
Multi-line text fieldMulti-line text field
<textarea></textarea> attributes:
cols: Set the number of columns of a multi-line text field, Values are numbers and have no units
rows: Set the number of rows in the multi-line text field Values are numbers and have no units
style="resize:none" Cancel the stretching effect
drop-down list
<select> <option></option> </select>
Select attributes:
size: value is a number, no unit When the value is equal to 1, it is a drop-down list When the value is greater than 1, it is a rolling list. The list displays items equal to the size of the value
multiple: implement multiple selection, attributes without value
option attributes:
selected: pre-selected, attribute with no value.