Summary of commonly used tags in html-HTML Tutorial-php.cn

Summary of commonly used tags in html

Table of contents

html tag<

Normal scroll

...Sliding

...Default scroll

...scroll back and forth

...scroll down

... scroll left

...number of scrolls

...Set width...Set height

...Set background color

...Set scroll speed

...Set scroll time

...Stop scrolling when the mouse passes over it

...< ;/marquee>Start scrolling when the mouse leaves

Back to top

Font effect

...
Title word

(MAX)

...
Title word (minimum)

...Bold font

...Bold font(emphasis) (Same effect as above)

...italics
...italics(emphasis)

...Italics(means definition)
...Bottom line

... Bottom line ( means insert text )

~~...~~Horizontal line

~~...~~ Strikethrough

~~...~~ Keyboard text... Type font

Fixed width font
(
in the file Center space, line wrapping, and positioning functions are valid
)

...</plaintext>Fixed-width font(does not implement mark symbols) &lt ; listing >... ;...Minimal font font-size:100 px'>... Unlimited increase Back to top Zone break mark <hr>Horizontal line<hr size= '9'> Horizontal line (<a href="#_labelTop"></a>Set size<img class="anchorclass" alt="Summary of commonly used tags in html" >) <h2></h2> <hr width='80%'>Horizontal line(Set width) <hr color='ff0000'>horizontal line(set color) (line break ) ...waters(without line breaks) ...waters(paragraph ) <center>...</center>Centered <a href="#_labelTop">Back to top</a><img class="anchorclass" alt="Summary of commonly used tags in html" > <h2><!>Link format </h2> <base href=Address>(Default link path) <a href=Address></a>External link <a href=addresstarget='_blank'></a>External link(Open a new window) <a href=Addresstarget='_top'></a>External link(Full window link) <a href = =Target = ' page box name' & gt; & lt;/a & gt; Top<!>stickers/music <a href="#_labelTop"></a><img src=<img class="anchorclass"/ alt="Summary of commonly used tags in html" >picture address<h2>>stickers <img src =image address</h2>width="180">set image width <img src=image addressheight="30"& gt ;Set image height<img src=Picture addressalt="Prompt text">Set picture prompt text <img src=Picture address border=" 1">Set picture border <bgsound src=MIDMusic file address>Background music setting <a href="#_labelTop">Back to top</a> <img class="anchorclass" alt="Summary of commonly used tags in html" > <h2><!>Table syntax</h2> <table aling=left>...</table>Table position,left < table aling=center>...</table>Table position,centered <table background=image path>...</table> The URL= of the background image is the path URL <table border=border size>...</table>Set the table border size(Use Number) <table bgcolor=color code>...</table>Set the background color of the table <table borderclor=color code >...</table>Set the color of the table border <table borderclordark=Color code>...</table>Set the table The color of the dark border <table borderclorlight=Color code>...</table>Set the color of the light border of the table <table cellpadding=parameter >... ... /table>Specify the number of columns in the table<table frame=parameter>...</table> Set the display method of the table outline<table width=width>...</table>Specify the width of the table(use numbers) <table height=height >...</table>Specify the height of the table(use numbers) <td colspan=parameter>...</ td>Specify the number of columns in the cell merge column(use numbers) <td rowspan=parameter>...</td>Specify storage The number of columns in the merged column(Use numbers) <a href="#_labelTop">Back to top</a><img class="anchorclass" alt="Summary of commonly used tags in html" > <h2>Split window</h2> <frameset cols="20%,*"&g t; Split left and right,Split the left frame to 20%The size of the right frame will be automatically adjusted<frameset rows="20%,*">Split up and down ,Split the upper frame to 20%The browser will automatically adjust the size of the lower frame <frameset cols="20%,*">Split the left and right frames <frameset cols="20%,*,20%">Split the left, middle and right frames into three frames <Split into the upper and lower frames <frameset rows="20%,*,20%">Split the upper, middle and lower frames Attributes: cols Vertical cutting window (such as splitting two windows left and right) accepts integer values, Percentage, * (* represents the remaining space occupied). The number of values represents the number of divided parts, and must be separated by commas. Example: cols="30,*,50%" can be cut into three windows. The first part is 30pixels (pixels) for absolute division, and the second part is when the allocation is completed The remaining space after the first and third views, the third part accounts for 50% of the entire window, which is a relative division. rows is horizontal cutting, separating the upper and lower windows. The value settings are the same as above. Try not to put the above two attributes in the same <frameset> tag, because Wangjing (netscape) does not support it, try to use multiple splits. frameborder Set the border of the frame. The values are 0without a border and 1with a border. border Set the frame border thickness framespacing Represents the distance between frames to keep the space frame Element (single label) Grammar format: <frame name="" src="url" scrolling="yes/no" noresize> Attributes: name Frame name, specify the frame to connect to the target window. src The url address to be displayed in the frame. Each frame should correspond to a html document. scrolling Whether to display scroll bars, yes/no, auto is automatic. noresize Set to prevent users from changing the size of this frame, noframe element Specify when a page using a frame is opened in a browser that does not support frames Displayed information Grammar format: <noframe> ...... </noframe> <a href="#_labelTop">Back to top </a><img class="anchorclass" alt="Summary of commonly used tags in html" > <h2> Form <form></form> </h2> Grammar format: <form action="url" method="get/post"> .... <input type=submit><input type=reset> action is Specify the location of the program that processes the form, so that the information filled in the form can be sent to cgi for processing. You can set this parameter to action="mailto:lwr8494@163.com" This form The information filled in will be sent to this email address. method refers to the way of transmitting information to cgi and other network programs. Optional post method, get method, post method allows sending large amounts of information. The get method only accepts information below 1k. The application form is postThe search engine is get <! - - ... - -> Notes A HREF TARGET A HREF> Specify hyperlink <A NAME=The name of the anchor> The name of the connected point <ADDRESS>....</ADDRESS> Used to display the email address Bold font <BASE TARGET> Specify the split window of the hyperlink <BASEFONT SIZE> Change the default font size <BGSOUND SRC> Add background music <BIG> Show large fonts <BLINK> Flashing text <BODY TEXT LINK VLIN K> Set text color <BODY> Show this article Line break <CAPTION ALIGN> Set the table title position <CAPTION>... </CAPTION> Add a title to the table <CENTER> Align to the center <CITE>...<CITE> Text for citations <CODE>...</CODE> Used to list a piece of program code <COMMENT>...</COMMENT> Add comments <DD&gt ; Item explanation of setting definition list<DFN>...</DFN> Display"Definition"Text <DIR& gt;. ..</DIR> List text label <DL>...</DL> Set the label of the definition list <DT> Set the label of the definition list Item For emphasis Specify the font used arbitrarily Set the font size <FORM ACTION> Set the processing method of the mobile form <FORM METHOD> Set the data transmission method of the mobile form <FRame MARGINHEIGHT> Setting window <FRame MARGINWIDTH> Set the left and right boundaries of the window <FRame NAME> Name the split window <FRame NORESI ZE> Lock split window The size of <FRame SCROLLING> Set the scroll of the split window <FRame SRC> Add the HTML file to the window <FRameSET COLS> Split the window into left and right sub-windows <FRameSET ROWS> Split the window into upper and lower sub-windows <FRameSET>...</FRameSET> Divide the split window <H1>~<H6> Set text size <HEAD> Mark file information <HR> Add dividing lines <HTML> The beginning and end of the file italics <IMG ALIGN> Adjust the position of the graphic image <IMG ALT> Annotate your graphic images <IMG DYNSRC LOOP> Add a video <IMG HEIGHT WIDTH> Insert image and preset graphic size Insert pictures and preset the left and right borders of the graphics <IMG LOWSRC> Preload picture function <IMG SRC BORDER> Set picture borders < IMG SRC&gt ; Insert pictures <IMG VSPACE> Insert pictures and preset the upper and lower borders of the graphics <INPUT TYPE NAME value> Add input fields to the form &lt ;ISINDEX> Definition query form <KBD>...</KBD> Indicates that the user enters text <LI TYPE>...</LI> List items(can specify symbols) <MARQUEE> Marquee effect <MENU>...</MENU> Article text label <meta NAME="REFRESH" CONTENT URL> Automatically update file content <MULTIPLE> A list bar that can select multiple items at the same time <NOFRame> Definition not The text that appears in the split window <OL>...</OL> Numbered list <OPTION> Define the items in the list column in the form &lt ;P ALIGN> Set the alignment direction Segmentation <PERSON>...</PERSON> Display person name <PRE> Use the original arrangement <SAMP>...</SAMP> Use the original arrangement <select >...</select > In the form Define the list column Show small font <STRIKE> The text is underlined Used to strengthen the tone &lt ;SUB> Subscripts Superscripts <TABLE BORDER=n> Adjust the width line height of the table < TABLE CELLPADDING> Adjust the border of the data field <TABLE CELLSPACING> Adjust the width of the table line <TABLE HEIGHT> Adjust the height of the table <TABLE WIDTH& gt; Adjust table The width of <TABLE>...</TABLE> Generate table labels <TD ALIGN> Adjust the left and right alignment of table fields <TD BGCOLOR> Set the background color of table fields T & lt; TD COLSPAN ROWSPAN & GT; & & lt; td nowrap & gt; Set the table field without change. <TD WIDTH> Adjust the table field width <TD>...</TD> Define the data fields of the table <TEXTAREA NAME ROWS COLS &gt ; How many columns of text input fields to add to the form <TEXTAREA WRAP> Determine whether the text input field will wrap automatically or not <TH>...</TH> Define the table The header field <TITLE> Document title <TR>...</TR> The definition table is beautiful in one line <TT> Typewriter Font Underlined text <UL TYPE>...</UL> Unnumbered list(can specify symbols) <var>...</var> Used to display variables BlockQuotc Text indent Back to top There are three ways ; <a href="#_labelTop">1</a>, <img class="anchorclass" alt="Summary of commonly used tags in html" >16<h2>Base color code</h2> Syntax: #RRGGBB Example: red (RRR,GGG , BBB) Example: red 3,Use color directly English name Example: red Back to top <body&g t;. ....</body> attributes can be divided into three types: 1, background attributes include: bgcolor, background 2, text attributes: includes: <a href="#_labelTop">text, link, alink, vlink, </a><img class="anchorclass" alt="Summary of commonly used tags in html" > <h2>3, Blank attribute: </h2> which is divided into: leftmargin, topmargin .bgcolorBackground Color Grammar format: <body bgcolor="#ff0000"> .backgroundBackground pattern. Grammar format: <body background="url"> .textText color (non-connected text color) .linkConnected text color (connectable text) Color) .alinkActive link text color (the color of the linkable text that is being clicked) .vlinkVisited link text color) (the color of the linkable text that has been clicked to visit) ) Grammar format: <body text="color" link="color" alink="color" vlink="color"> .leftmargin The white space on the left side of the page M p.topMargin grammar format: & lt; body leftmargin = "value" topmargin = "value" & gt; <img class="anchorclass" alt="Summary of commonly used tags in html" > Note: <h3>value is the The length value is a number </h3> align attribute Syntax: <h2 align="?">text</h2> There are three attributes: leftleft,centercenter,rightright 〈p〉 is a paragraph mark, The above attributes can be used to set the entire paragraph 〈br> is a line break mark is a non-line break mark and can be placed on both sides of the text Example: <body> <h3>Jiangnan meets the Year of Li Gui</h3> King Qi A common sight in the house p> </body> Pre-formatting: <pre class="brush:php;toolbar:false">......</pre> Browsing has the same effect as writing Back to top List <a href="#_labelTop"></a><img class="anchorclass" alt="Summary of commonly used tags in html" > <h2> 1</h2>Unordered list, also known as symbol list <img class="anchorclass" alt="Summary of commonly used tags in html" > <h3> Grammar format: <ul type=" "> The attribute of type</h3> can be selected as straightdiscsolid dot, clrclehollow dot, squaresolid box<li>Text</li> <li>Text</li> 2Ordered list<img class="anchorclass" alt="Summary of commonly used tags in html" > <h3>Grammar format:</h3> <ol type="?" start"?"> <li>Text</li> <li>Text </li> </ol> The value of type is a numbered character. The optional 1...,a ...,A...,i... ,I... start is the starting value. Example: If start is 3, then it will start from 3 Start and it must be a number. 3Definition list<img class="anchorclass" alt="Summary of commonly used tags in html" > <h3><dl>Definition list mark</h3> <dt>mark Define entry <dd> Mark definition content Grammar format: <dl> <dt>Text </dt> <dd>Text content </dd> " title="?">....</a> Attribute: href The connection target value can be url The address can also be the connection anchor &lt ;a href="url">...</a> or <a href="anchor">...</a> Back to topname Connection name Syntax format: <a name="Anchor name">...</a> Example: <a href="#_labelTop"><a name="abcdcf">...</a> </a><img class="anchorclass" alt="Summary of commonly used tags in html" > <h2>The connection to the anchor point should be: </h2><a name=" #abcdef">....</a> Back to toptargetTarget window syntax format : <a href="url"target= "_blank|_self|_farent|_top|windowname">....</a> -blankOpen a new window _self<a href="#_labelTop">The current window is open</a><img class="anchorclass" alt="Summary of commonly used tags in html" > <h2>Two at a time Applies only in the frame leaf </h2>_parentThe parent window (upper level) of the current window opens _topOpens the highest level window windowameThe named window Or open the connection in the frame titleConnection prompt <a href="http://www.crazytribe.net" title="Open the homepage of Crazy Tribe">Crazy Tribe</a&gt " height="?" border="?" align="?"> border attribute defines the width of the picture border, the default value is <a href="#_labelTop"></a>0 <img class="anchorclass" alt="Summary of commonly used tags in html" > <h2> align attribute sets the position of the text next to the picture </h2> Grammar format: <img src="" align""> Optional values are: topAlign the top of the picture and text middle Pictures Align the image and text in the center bottomAlign the bottom edge of the image and text (default) leftThe image is aligned to the left, the text is wrapped around the image rightThe image is aligned to the right, and the text is aligned along the Picture wrapping absmiddleThe picture is aligned to the absolute center of the current text line absbottomThe picture is aligned to the absolute bottom of the current text line Typesetting of text No Line break whitespace mark Back to top fontElement Syntax format: Font name" size="<a href="#_labelTop"></a>Font Size<img class="anchorclass"/ alt="Summary of commonly used tags in html" >" color="<h2>Font color"> The optional font size values are 1——7, the default is 3 Example: 〈 font face=" boldface" size="4" color="#ff00ff">.... horizontal line<hr> grammar Format: <hr width="width" align="alignment defaults to centercenter" size="horizontal line thickness defaults to 2" color="color" noshade> noshadeNo shadow, both solid lines layer〈p>two elements is a block-level element, similar to the paragraph element . The difference is that two elements will not produce two <p&gt ;The blank line between elements, is an inline element, which can define the attributes of some text in the paragraph Grammar format: ... alignSet the horizontal alignment of elements in the layer stuleSet the attributes of the element application csscanonical Compatibility is a little better than , it is best to use <a href="#_labelTop">Back to top</a><img class="anchorclass" alt="Summary of commonly used tags in html" > <h2> table syntax format ：</h2> <table width="" bgcolor="" background="" border="" cellspacing="" cellpadding=""> <tr>...<td>... .</td>.... pacing The margin size of the cells in the table, the default value is two pixelscellpaddingThe spacing size between cells in the table, the default value is two pixelstr Element Grammar format: <tr align="" bgcolor="">....</tr> align Optional values for attribute alignment are as follows: <img class="anchorclass" alt="Summary of commonly used tags in html" >left,center,tight, <h3>defaults to left </h3> bgcolorSpecifies the background color of the row td element Grammar format: <td width="width" height="height<img class="anchorclass"/ alt="Summary of commonly used tags in html" >" align="<h3>horizontal alignment" valign="vertical alignment</h3>" bgcolor="" background ="" rowspan="The row span of the cell" colapan="The column span of the cell">...</td> align attribute Optional values are: left, center, right valign Optional values for the attribute are: top, middle, bottom rowspan and colapan across rows and columns The quantity, the default is 1 Back to top<h2>input element syntax format: </h2> <input type=""> typeThe optional values of the attribute are: text Single-line text box Attributes: name Name of the text box value Initial value of the text box size Length of the text box maxlength Maximum length of the input string radio Radio button Attributes: name Radio button name value Internal value checked Default selected checkbox check Box Attributes: name checkbox name value internal value checked default selected reset Reset button submit OK button Attributes: name Button name value Text displayed on the button password Password box Properties and text box properties Identical file File field Attributes: nameFile field name size The length of the file field maxlength The number of characters accepted by the file field Upper limit hidden hidden domain Attributes: name hidden domain name value default value image Picture domain Attributes: The button to be represented by name can be submit, reset, or other . src url address List box<select&gt ; Grammar format: <select> .... <option>....</option> ... .. </select> Back to top<a href="#_labelTop"></a><img class="anchorclass" alt="Summary of commonly used tags in html" > <h2>select element </h2> Syntax format: <select name="" size="" multiple> </select> name Specify the name of the list box size Specify the number of list items displayed in the list box. If this parameter is specified, the select element is a list, otherwise It is a drop-down list box<a href="http://www.php.cn/code/4996.html" target="_blank"> </a> multiple If this parameter is specified, it means that the list box can select multiple items, otherwise only one item can be selected <img class="anchorclass" alt="Summary of commonly used tags in html" > <h3>optionAttribute </h3> Syntax format: <option value="" selected></option> value The value of the list item selected If this parameter is set, this will be selected by default One item <a href="#_labelTop">Back to top</a><img class="anchorclass" alt="Summary of commonly used tags in html" > <h2>Multi-line text box<textarea> </h2> <textarea name="" cols="" rows="" wrap="off /physical/virtual" > Height of text box wrapThe optional values for the wrapping method of the text box are: offDo not save the line wrapping information physicalForce the browser to send information to the webserver The text in the multi-line text box must be sent line by line, virtual to send a continuous string of words unless the user presses Enter. Back to top css Cascading Style Sheets Methods to introduce cascading style sheets include: <a href="#_labelTop">External style sheet</a><img class="anchorclass" alt="Summary of commonly used tags in html" > <h2> Example: <head> </h2> <link rel="stylesheet" href="/css/default.css"> </head><img class="anchorclass" alt="Summary of commonly used tags in html" > <h3><body> </h3> .... </body> </html> Attribute: rel is used to describe <link> Element is here The task to be accomplished is to connect a standalone css file. The href attribute gives the url address of the css file to be connected. font105{font:10.5pt;color:blue} --> </style> </head> <body>....&lt ;/body> </html> Element default Format: Imported style sheet 〈html> <head> <style type="text/css"> <! -- @import url(css/home.css); --><img class="anchorclass" alt="Summary of commonly used tags in html" > <h3></style></h3> <body> .... <img class="anchorclass" alt="Summary of commonly used tags in html" ></body> <h3> </html></h3> css’s priority The closer the style definition is to the target, the higher the priority. High priority styles will inherit the lower priority. Non-overlapping definitions of priority styles but overriding overlapping definitions If 4 types of style sheets define different styles for the same element, then their priority order from high to low is, element default, inline style sheet, imported style sheet, external style sheet. <img class="anchorclass" alt="Summary of commonly used tags in html" > <h3>css structure</h3> Example: td{font-size:10.5pt;color:#666666} c The ss style consists of two basic parts, selector <td> and declaration {font-size:10.5pt;color:#666666} The declaration also consists of two parts: Attributes font size , color and value 10.5pt, #666666 <img class="anchorclass" alt="Summary of commonly used tags in html" > <h3> selectors are divided into 6 types</h3> 1 element selectors When on the page When multiple elements have the same style, you can define multiple elements together and separate them with commas. For example: td,p,li,input,select{font-size:12px;} 2class( Class ) selector Example: 〈head> <title>....</title> <style type="text/ css">  </style> </head> <body bgcolor="#ffffff"> Scholar-official Jinggangshan District Official Nine Link Leaving Plan </body> Another way is to limit the page elements to which it can be applied Example: 〈head> <title>....</title> <style type="text/css">  </style> </head> <body bgcolor="# ffffff"> Scholar-official Jinggangshan District Official <h1 class="red">Nine Links Leaving Plan </h1> </body> 3 id selector is similar to class selection, just add '.'Change Into '#' Example: <body> <head> <style type="text/css"> <! -- #select{font-size:18px;color:#0000ff} --> </style> </head> <body> <table width="250" border="1" height="50"> <tr> T & lt; td align = "center" id = "select" & gt; id select rune & lt;/td & gt; & lt;/tr & gt; & & lt;/table & gt; </body> Replaced with id="" to facilitate the call of page script language association selector<body><head&gt ; <style type="text/css">  <tr> <td align="center">Associative selector </td> </table> Associative selector </body> </html> We set the style of the text contained in the element <td> . The style will take effect only when both conditions are met, Pseudo-class selector can only be used in css selectors, but cannot be used in html selectors in code Example: 〈 html&gt ; <head> <style type="text/css">  &lt ;/style> </head> <body> <a href="#">association selector </a> <a href="#">association selector </a> <a href="#">Association Selector </a> a > Otherwise it will cause the connection on the page to Color chaos <h3>Pseudo-element selector</h3> is similar to the definition of pseudo-class selector. Currently, there are two supported by most browsers: first-line pseudo-element (first-line) and first-character pseudo-element (first -letter) is used to achieve the effect of capitalizing the first line and sinking the first line Example: the first line <html> <head> <style> <!- -p:first-line{color:red;font-size:20pt}--> </style> </hesd> <body> <p&gt ;dfgsadfgsdfgsdfgsdfgsdfgsdfgsdfgsdfgsdfgsdf... </body> </html> The length changes with the size of the browser window First word <html&g t; <head> <style>  </style> </hem t; Both of the above can only be applied On block elements Back to top cssRules<a href="#_labelTop" style="text-align: right;"></a><img class="anchorclass" alt="Summary of commonly used tags in html" > 1.<h2>InheritExample: </h2><html>< head>< style type="text/css">  </style> </hem ; cssrules </td> </table> </body> </html> is the most advanced <td>two sub-level css are used on an attribute element, the same coverage, different inheritance, 2.combination Example:td{font-size:12pt}p1{font-size:12pt}After combinationtd,.p1{font-size:12pt} 3.Layering After defining it in the style, define it in the table attribute <html> <head> <style type="text/css"> </style> </hesd> <body> <table width="300" border="1" height= "150"> <tr> <td align="center" style="color:#0000ff" class="red">The local magistrate</td> </tr> </table> </body> </html> cssunit divided into four categories: 1 Unit of length The value can be an integer, a decimal, a positive number, a negative number, 0, followed by the unit (don’t use negative values lightly)Conversion relationship: 1in(inch)=6pc(pie 1in(inch)=72pt(pound)1in(inch)=2.54(cm) 1cm(cm)=10mm(mm) 1cm(cm )=0.3937( inch) 1pt(pound)=1/72in(inch)=0.2478mm(mm) 1pc(pie )=1/6in (inch)=The size of China’s new No. 4 typeface 2 Percent unit 3 Color unit 4 urlUnit <a href="#_labelTop" style="text-align: right;">Back to top</a> <img class="anchorclass" alt="Summary of commonly used tags in html" > <h2>p Attributes </h2> color: #999999 Text color font-family: Song style font font-size: 10pt Text size font-style:itelic Text italic font-variant:small-caps small font <a href="http://www.php.cn/wiki/865.html" target="_blank">letter-spacing</a> : 1pt text spacing line-height : 200% set line height font-weight:bold text bold <a href="http://www.php.cn/wiki/869.html" target="_blank">vertical-align</a>:sub subscript vertical-align:super superscript <a href="http://www.php.cn/wiki/859.html" target="_blank">text-decoration</a>:line-through add?hexcept line text-decoration:overline Add top line text-decoration:underline Add underline text-decoration:none ?hExcept connect underline <a href="http://www.php.cn/wiki/863.html" target="_blank">text-transform</a> : capitalize Capitalize the first word text-transform : uppercase English capital text-transform : lowercase English writing text-align:right Text*right aligned text-align:left Text* Left alignment text-align:center Text-center alignment These are some simple text effects that can be applied to css pages. <a href="#_labelTop">Back to top</a><img class="anchorclass" alt="Summary of commonly used tags in html" > <h2> Background </h2> TEXTAREA STYLE="border:1px dashed pink"> solid line <TEXTAREA STYLE="border:1px solid pink"> </li></ul>The above is the detailed content of Summary of commonly used tags in html. For more information, please follow other related articles on the PHP Chinese website! </div> </div> <div style="height: 25px;"> <div class="wzconBq" style="display: inline-flex;"> Related labels： <div class="wzcbqd"> <a onclick="hits_log(2,'www',this);" href-data="https://www.php.cn/search?word=html" target="_blank">html</a> <a onclick="hits_log(2,'www',this);" href-data="https://www.php.cn/search?word=commonlyused" target="_blank">Commonly used</a> <a onclick="hits_log(2,'www',this);" href-data="https://www.php.cn/search?word=summarize" target="_blank">Summarize</a> <a onclick="hits_log(2,'www',this);" href-data="https://www.php.cn/search?word=label" target="_blank">Label</a> <a onclick="hits_log(2,'www',this);" href-data="https://www.php.cn/search?word=summary" target="_blank">Summary</a> </div> </div> <div style="display: inline-flex;float: right; color:#333333;">source：php.cn</div> </div> <div class="wzconOtherwz"> <a href="https://www.php.cn/faq/367595.html" title="Summary and sharing of common global attributes"> Previous article：Summary and sharing of common global attributes </a> <a href="https://www.php.cn/faq/367598.html" title="Complete explanation of html tags"> Next article：Complete explanation of html tags </a> </div> <div class="wzconShengming"> <div class="bzsmdiv">Statement of this Website</div> <div>The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn</div> </div> <ins class="adsbygoogle" style="display:block" data-ad-format="autorelaxed" data-ad-client="ca-pub-5902227090019525" data-ad-slot="2507867629"></ins> <script> (adsbygoogle = window.adsbygoogle || []).push({}); </script> <div class="wzconZzwz"> <div class="wzconZzwztitle">Latest Articles by Author</div> <ul> <li> <div class="wzczzwzli"> <a target="_blank" href="https://www.php.cn/faq/375959.html">How to add elements to php array</a> </div> <div>2023-03-14 15:58:02</div> </li> <li> <div class="wzczzwzli"> <a target="_blank" href="https://www.php.cn/faq/377752.html">Example showing JS implementing a simple multiple-choice assessment system</a> </div> <div>1970-01-01 08:00:00</div> </li> <li> <div class="wzczzwzli"> <a target="_blank" href="https://www.php.cn/faq/376780.html">PHP solution to restrict multiple submissions of the same IP</a> </div> <div>2023-03-15 07:38:01</div> </li> <li> <div class="wzczzwzli"> <a target="_blank" href="https://www.php.cn/faq/362217.html">Using regular expressions to implement form validation in HTML</a> </div> <div>1970-01-01 08:00:00</div> </li> <li> <div class="wzczzwzli"> <a target="_blank" href="https://www.php.cn/faq/379000.html">Detailed explanation of this pointing issue in JavaScript strict mode</a> </div> <div>1970-01-01 08:00:00</div> </li> <li> <div class="wzczzwzli"> <a target="_blank" href="https://www.php.cn/faq/377851.html">Example code for building a tree menu (including multi-level menu) in Java</a> </div> <div>1970-01-01 08:00:00</div> </li> <li> <div class="wzczzwzli"> <a target="_blank" href="https://www.php.cn/faq/376633.html">Detailed explanation of examples of CSS3 implementing smooth transition when hover leaves</a> </div> <div>1970-01-01 08:00:00</div> </li> <li> <div class="wzczzwzli"> <a target="_blank" href="https://www.php.cn/faq/370599.html">Swiper carousel image source code sharing analysis</a> </div> <div>1970-01-01 08:00:00</div> </li> <li> <div class="wzczzwzli"> <a target="_blank" href="https://www.php.cn/faq/378766.html">Summarize and organize VsCode plug-ins</a> </div> <div>1970-01-01 08:00:00</div> </li> <li> <div class="wzczzwzli"> <a target="_blank" href="https://www.php.cn/faq/373935.html">HttpUtils request tool class code</a> </div> <div>1970-01-01 08:00:00</div> </li> </ul> </div> <div class="wzconZzwz"> <div class="wzconZzwztitle">Latest Issues</div> <div class="wdsyContent"> <div class="wdsyConDiv flexRow wdsyConDiv1"> <div class="wdcdContent flexColumn"> <a href="https://www.php.cn/wenda/176403.html" target="_blank" title="PX automatic conversion to REM error" class="wdcdcTitle">PX automatic conversion to REM error</a> <a href="https://www.php.cn/wenda/176403.html" class="wdcdcCons"> <style>html {   font-size: calc(100vw / 3.75);      }...</a> <div class="wdcdcInfo flexRow"> <div class="wdcdcileft"> From 2024-04-16 09:34:16 </div> <div class="wdcdciright flexRow"> <div class="wdcdcirdz flexRow ira"> 0 </div> <div class="wdcdcirpl flexRow ira">0</div> <div class="wdcdcirwatch flexRow ira">4687</div> </div> </div> </div> </div> <div class="wdsyConLine wdsyConLine2"></div> <div class="wdsyConDiv flexRow wdsyConDiv1"> <div class="wdcdContent flexColumn"> <a href="https://www.php.cn/wenda/176396.html" target="_blank" title="The page suddenly cannot pull css or bootstrap" class="wdcdcTitle">The page suddenly cannot pull css or bootstrap</a> <a href="https://www.php.cn/wenda/176396.html" class="wdcdcCons">So I'm developing a page, I did part of it yesterday and it worked great, and today I cont...</a> <div class="wdcdcInfo flexRow"> <div class="wdcdcileft"> From 2024-04-06 21:58:04 </div> <div class="wdcdciright flexRow"> <div class="wdcdcirdz flexRow ira"> 0 </div> <div class="wdcdcirpl flexRow ira">1</div> <div class="wdcdcirwatch flexRow ira">800</div> </div> </div> </div> </div> <div class="wdsyConLine wdsyConLine2"></div> <div class="wdsyConDiv flexRow wdsyConDiv1"> <div class="wdcdContent flexColumn"> <a href="https://www.php.cn/wenda/176386.html" target="_blank" title="How to solve the mysterious white space at the bottom of the page in CSS" class="wdcdcTitle">How to solve the mysterious white space at the bottom of the page in CSS</a> <a href="https://www.php.cn/wenda/176386.html" class="wdcdcCons">I'm trying to build a simple webpage using Bootstrap and D3, but I don't know how to get r...</a> <div class="wdcdcInfo flexRow"> <div class="wdcdcileft"> From 2024-04-06 20:22:15 </div> <div class="wdcdciright flexRow"> <div class="wdcdcirdz flexRow ira"> 0 </div> <div class="wdcdcirpl flexRow ira">1</div> <div class="wdcdcirwatch flexRow ira">454</div> </div> </div> </div> </div> <div class="wdsyConLine wdsyConLine2"></div> <div class="wdsyConDiv flexRow wdsyConDiv1"> <div class="wdcdContent flexColumn"> <a href="https://www.php.cn/wenda/176383.html" target="_blank" title="How to use laravel components with livewire lazy placeholder" class="wdcdcTitle">How to use laravel components with livewire lazy placeholder</a> <a href="https://www.php.cn/wenda/176383.html" class="wdcdcCons">I want to add the skeleton of my laravel component inside a livewire3 placeholder What I h...</a> <div class="wdcdcInfo flexRow"> <div class="wdcdcileft"> From 2024-04-06 20:02:10 </div> <div class="wdcdciright flexRow"> <div class="wdcdcirdz flexRow ira"> 0 </div> <div class="wdcdcirpl flexRow ira">2</div> <div class="wdcdcirwatch flexRow ira">543</div> </div> </div> </div> </div> <div class="wdsyConLine wdsyConLine2"></div> <div class="wdsyConDiv flexRow wdsyConDiv1"> <div class="wdcdContent flexColumn"> <a href="https://www.php.cn/wenda/176364.html" target="_blank" title="Top-level method to replace a string with HTML code (generated from an array)" class="wdcdcTitle">Top-level method to replace a string with HTML code (generated from an array)</a> <a href="https://www.php.cn/wenda/176364.html" class="wdcdcCons">Given a string like this...$htmlPattern="Usernameis:#name#andusercompanyis#company#&q...</a> <div class="wdcdcInfo flexRow"> <div class="wdcdcileft"> From 2024-04-06 17:40:41 </div> <div class="wdcdciright flexRow"> <div class="wdcdcirdz flexRow ira"> 0 </div> <div class="wdcdcirpl flexRow ira">2</div> <div class="wdcdcirwatch flexRow ira">410</div> </div> </div> </div> </div> <div class="wdsyConLine wdsyConLine2"></div> </div> </div> <div class="wzconZt" > <div class="wzczt-title"> <div>Related Topics</div> <a href="https://www.php.cn/faq/zt" target="_blank">More> </a> </div> <div class="wzcttlist"> <ul> <li class="ul-li"> <a target="_blank" href="https://www.php.cn/faq/htmlbq"><img src="https://img.php.cn/upload/subject/202407/22/2024072214431586789.jpg?x-oss-process=image/resize,m_fill,h_145,w_220" alt="html copyright symbol" /> </a> <a target="_blank" href="https://www.php.cn/faq/htmlbq" class="title-a-spanl" title="html copyright symbol">html copyright symbol </a> </li> <li class="ul-li"> <a target="_blank" href="https://www.php.cn/faq/htmlzxbjq"><img src="https://img.php.cn/upload/subject/202407/22/2024072214403473154.jpg?x-oss-process=image/resize,m_fill,h_145,w_220" alt="html online editor" /> </a> <a target="_blank" href="https://www.php.cn/faq/htmlzxbjq" class="title-a-spanl" title="html online editor">html online editor </a> </li> <li class="ul-li"> <a target="_blank" href="https://www.php.cn/faq/htmlwyzz"><img src="https://img.php.cn/upload/subject/202407/22/2024072214275948120.jpg?x-oss-process=image/resize,m_fill,h_145,w_220" alt="html web page production" /> </a> <a target="_blank" href="https://www.php.cn/faq/htmlwyzz" class="title-a-spanl" title="html web page production">html web page production </a> </li> <li class="ul-li"> <a target="_blank" href="https://www.php.cn/faq/htmlkg"><img src="https://img.php.cn/upload/subject/202407/22/2024072214273274014.jpg?x-oss-process=image/resize,m_fill,h_145,w_220" alt="html space" /> </a> <a target="_blank" href="https://www.php.cn/faq/htmlkg" class="title-a-spanl" title="html space">html space </a> </li> <li class="ul-li"> <a target="_blank" href="https://www.php.cn/faq/htmlssm"><img src="https://img.php.cn/upload/subject/202407/22/2024072214210727109.jpg?x-oss-process=image/resize,m_fill,h_145,w_220" alt="what is html" /> </a> <a target="_blank" href="https://www.php.cn/faq/htmlssm" class="title-a-spanl" title="what is html">what is html </a> </li> <li class="ul-li"> <a target="_blank" href="https://www.php.cn/faq/htmlztdxzmsz"><img src="https://img.php.cn/upload/subject/202407/22/2024072214205132478.jpg?x-oss-process=image/resize,m_fill,h_145,w_220" alt="How to set html font size" /> </a> <a target="_blank" href="https://www.php.cn/faq/htmlztdxzmsz" class="title-a-spanl" title="How to set html font size">How to set html font size </a> </li> <li class="ul-li"> <a target="_blank" href="https://www.php.cn/faq/htmlztxt"><img src="https://img.php.cn/upload/subject/202407/22/2024072214125629445.jpg?x-oss-process=image/resize,m_fill,h_145,w_220" alt="html to txt" /> </a> <a target="_blank" href="https://www.php.cn/faq/htmlztxt" class="title-a-spanl" title="html to txt">html to txt </a> </li> <li class="ul-li"> <a target="_blank" href="https://www.php.cn/faq/htmlwbkdmzmx"><img src="https://img.php.cn/upload/subject/202407/22/2024072214120496282.jpg?x-oss-process=image/resize,m_fill,h_145,w_220" alt="How to write html text box code" /> </a> <a target="_blank" href="https://www.php.cn/faq/htmlwbkdmzmx" class="title-a-spanl" title="How to write html text box code">How to write html text box code </a> </li> </ul> </div> </div> </div> </div> <div class="phpwzright"> <ins class="adsbygoogle" style="display:block" data-ad-client="ca-pub-5902227090019525" data-ad-slot="3653428331" data-ad-format="auto" data-full-width-responsive="true"></ins> <script> (adsbygoogle = window.adsbygoogle || []).push({}); </script> <div class="wzrOne"> <div class="wzroTitle">Popular Recommendations</div> <div class="wzroList"> <ul> <li> <div class="wzczzwzli"> <a style="height: auto;" title="What does url mean?" href="https://www.php.cn/faq/418772.html">What does url mean?</a> </div> </li> <li> <div class="wzczzwzli"> <a style="height: auto;" title="What does DOM mean?" href="https://www.php.cn/faq/414303.html">What does DOM mean?</a> </div> </li> <li> <div class="wzczzwzli"> <a style="height: auto;" title="How to change image size" href="https://www.php.cn/faq/414252.html">How to change image size</a> </div> </li> <li> <div class="wzczzwzli"> <a style="height: auto;" title="How to make font bold in HTML" href="https://www.php.cn/faq/414520.html">How to make font bold in HTML</a> </div> </li> <li> <div class="wzczzwzli"> <a style="height: auto;" title="How to set the size of html images" href="https://www.php.cn/faq/475145.html">How to set the size of html images</a> </div> </li> </ul> </div> </div> <script src="https://sw.php.cn/hezuo/cac1399ab368127f9b113b14eb3316d0.js" type="text/javascript"></script> <div class="wzrThree"> <div class="wzrthree-title"> <div>Popular Tutorials</div> <a target="_blank" href="https://www.php.cn/course.html">More> </a> </div> <div class="wzrthreelist swiper2"> <div class="wzrthreeTab swiper-wrapper"> <div class="check tabdiv swiper-slide" data-id="one">Related Tutorials <div></div></div> <div class="tabdiv swiper-slide" data-id="two">Popular Recommendations<div></div></div> <div class="tabdiv swiper-slide" data-id="three">Latest courses<div></div></div> </div> <ul class="one"> <li> <a target="_blank" href="https://www.php.cn/course/812.html" title="The latest ThinkPHP 5.1 world premiere video tutorial (60 days to become a PHP expert online training course)" class="wzrthreelaimg"> <img src="https://img.php.cn/upload/course/000/000/041/620debc3eab3f377.jpg" alt="The latest ThinkPHP 5.1 world premiere video tutorial (60 days to become a PHP expert online training course)"/> </a> <div class="wzrthree-right"> <a target="_blank" title="The latest ThinkPHP 5.1 world premiere video tutorial (60 days to become a PHP expert online training course)" href="https://www.php.cn/course/812.html">The latest ThinkPHP 5.1 world premiere video tutorial (60 days to become a PHP expert online training course)</a> <div class="wzrthreerb"> <div>1426952 </div> <div class="courseICollection" data-id="812"> </div> </div> </div> </li> <li> <a target="_blank" href="https://www.php.cn/course/74.html" title="PHP introductory tutorial one: Learn PHP in one week" class="wzrthreelaimg"> <img src="https://img.php.cn/upload/course/000/000/068/6253d1e28ef5c345.png" alt="PHP introductory tutorial one: Learn PHP in one week"/> </a> <div class="wzrthree-right"> <a target="_blank" title="PHP introductory tutorial one: Learn PHP in one week" href="https://www.php.cn/course/74.html">PHP introductory tutorial one: Learn PHP in one week</a> <div class="wzrthreerb"> <div>4276855 </div> <div class="courseICollection" data-id="74"> </div> </div> </div> </li> <li> <a target="_blank" href="https://www.php.cn/course/286.html" title="JAVA Beginner's Video Tutorial" class="wzrthreelaimg"> <img src="https://img.php.cn/upload/course/000/000/068/62590a2bacfd9379.png" alt="JAVA Beginner's Video Tutorial"/> </a> <div class="wzrthree-right"> <a target="_blank" title="JAVA Beginner's Video Tutorial" href="https://www.php.cn/course/286.html">JAVA Beginner's Video Tutorial</a> <div class="wzrthreerb"> <div>2573995 </div> <div class="courseICollection" data-id="286"> </div> </div> </div> </li> <li> <a target="_blank" href="https://www.php.cn/course/504.html" title="Little Turtle's zero-based introduction to learning Python video tutorial" class="wzrthreelaimg"> <img src="https://img.php.cn/upload/course/000/000/068/62590a67ce3a6655.png" alt="Little Turtle's zero-based introduction to learning Python video tutorial"/> </a> <div class="wzrthree-right"> <a target="_blank" title="Little Turtle's zero-based introduction to learning Python video tutorial" href="https://www.php.cn/course/504.html">Little Turtle's zero-based introduction to learning Python video tutorial</a> <div class="wzrthreerb"> <div>509866 </div> <div class="courseICollection" data-id="504"> </div> </div> </div> </li> <li> <a target="_blank" href="https://www.php.cn/course/2.html" title="PHP zero-based introductory tutorial" class="wzrthreelaimg"> <img src="https://img.php.cn/upload/course/000/000/068/6253de27bc161468.png" alt="PHP zero-based introductory tutorial"/> </a> <div class="wzrthree-right"> <a target="_blank" title="PHP zero-based introductory tutorial" href="https://www.php.cn/course/2.html">PHP zero-based introductory tutorial</a> <div class="wzrthreerb"> <div>866573 </div> <div class="courseICollection" data-id="2"> </div> </div> </div> </li> </ul> <ul class="two" style="display: none;"> <li> <a target="_blank" href="https://www.php.cn/course/812.html" title="The latest ThinkPHP 5.1 world premiere video tutorial (60 days to become a PHP expert online training course)" class="wzrthreelaimg"> <img src="https://img.php.cn/upload/course/000/000/041/620debc3eab3f377.jpg" alt="The latest ThinkPHP 5.1 world premiere video tutorial (60 days to become a PHP expert online training course)"/> </a> <div class="wzrthree-right"> <a target="_blank" title="The latest ThinkPHP 5.1 world premiere video tutorial (60 days to become a PHP expert online training course)" href="https://www.php.cn/course/812.html">The latest ThinkPHP 5.1 world premiere video tutorial (60 days to become a PHP expert online training course)</a> <div class="wzrthreerb"> <div >1426952 times of learning</div> <div class="courseICollection" data-id="812"> </div> </div> </div> </li> <li> <a target="_blank" href="https://www.php.cn/course/286.html" title="JAVA Beginner's Video Tutorial" class="wzrthreelaimg"> <img src="https://img.php.cn/upload/course/000/000/068/62590a2bacfd9379.png" alt="JAVA Beginner's Video Tutorial"/> </a> <div class="wzrthree-right"> <a target="_blank" title="JAVA Beginner's Video Tutorial" href="https://www.php.cn/course/286.html">JAVA Beginner's Video Tutorial</a> <div class="wzrthreerb"> <div >2573995 times of learning</div> <div class="courseICollection" data-id="286"> </div> </div> </div> </li> <li> <a target="_blank" href="https://www.php.cn/course/504.html" title="Little Turtle's zero-based introduction to learning Python video tutorial" class="wzrthreelaimg"> <img src="https://img.php.cn/upload/course/000/000/068/62590a67ce3a6655.png" alt="Little Turtle's zero-based introduction to learning Python video tutorial"/> </a> <div class="wzrthree-right"> <a target="_blank" title="Little Turtle's zero-based introduction to learning Python video tutorial" href="https://www.php.cn/course/504.html">Little Turtle's zero-based introduction to learning Python video tutorial</a> <div class="wzrthreerb"> <div >509866 times of learning</div> <div class="courseICollection" data-id="504"> </div> </div> </div> </li> <li> <a target="_blank" href="https://www.php.cn/course/901.html" title="Quick introduction to web front-end development" class="wzrthreelaimg"> <img src="https://img.php.cn/upload/course/000/000/067/64be28a53a4f6310.png" alt="Quick introduction to web front-end development"/> </a> <div class="wzrthree-right"> <a target="_blank" title="Quick introduction to web front-end development" href="https://www.php.cn/course/901.html">Quick introduction to web front-end development</a> <div class="wzrthreerb"> <div >216215 times of learning</div> <div class="courseICollection" data-id="901"> </div> </div> </div> </li> <li> <a target="_blank" href="https://www.php.cn/course/234.html" title="Master PS video tutorials from scratch" class="wzrthreelaimg"> <img src="https://img.php.cn/upload/course/000/000/068/62611f57ed0d4840.jpg" alt="Master PS video tutorials from scratch"/> </a> <div class="wzrthree-right"> <a target="_blank" title="Master PS video tutorials from scratch" href="https://www.php.cn/course/234.html">Master PS video tutorials from scratch</a> <div class="wzrthreerb"> <div >898239 times of learning</div> <div class="courseICollection" data-id="234"> </div> </div> </div> </li> </ul> <ul class="three" style="display: none;"> <li> <a target="_blank" href="https://www.php.cn/course/1648.html" title="[Web front-end] Node.js quick start" class="wzrthreelaimg"> <img src="https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png" alt="[Web front-end] Node.js quick start"/> </a> <div class="wzrthree-right"> <a target="_blank" title="[Web front-end] Node.js quick start" href="https://www.php.cn/course/1648.html">[Web front-end] Node.js quick start</a> <div class="wzrthreerb"> <div >8162 times of learning</div> <div class="courseICollection" data-id="1648"> </div> </div> </div> </li> <li> <a target="_blank" href="https://www.php.cn/course/1647.html" title="Complete collection of foreign web development full-stack courses" class="wzrthreelaimg"> <img src="https://img.php.cn/upload/course/000/000/067/6628cc96e310c937.png" alt="Complete collection of foreign web development full-stack courses"/> </a> <div class="wzrthree-right"> <a target="_blank" title="Complete collection of foreign web development full-stack courses" href="https://www.php.cn/course/1647.html">Complete collection of foreign web development full-stack courses</a> <div class="wzrthreerb"> <div >6467 times of learning</div> <div class="courseICollection" data-id="1647"> </div> </div> </div> </li> <li> <a target="_blank" href="https://www.php.cn/course/1646.html" title="Go language practical GraphQL" class="wzrthreelaimg"> <img src="https://img.php.cn/upload/course/000/000/067/662221173504a436.png" alt="Go language practical GraphQL"/> </a> <div class="wzrthree-right"> <a target="_blank" title="Go language practical GraphQL" href="https://www.php.cn/course/1646.html">Go language practical GraphQL</a> <div class="wzrthreerb"> <div >5379 times of learning</div> <div class="courseICollection" data-id="1646"> </div> </div> </div> </li> <li> <a target="_blank" href="https://www.php.cn/course/1645.html" title="550W fan master learns JavaScript from scratch step by step" class="wzrthreelaimg"> <img src="https://img.php.cn/upload/course/000/000/067/662077e163124646.png" alt="550W fan master learns JavaScript from scratch step by step"/> </a> <div class="wzrthree-right"> <a target="_blank" title="550W fan master learns JavaScript from scratch step by step" href="https://www.php.cn/course/1645.html">550W fan master learns JavaScript from scratch step by step</a> <div class="wzrthreerb"> <div >737 times of learning</div> <div class="courseICollection" data-id="1645"> </div> </div> </div> </li> <li> <a target="_blank" href="https://www.php.cn/course/1644.html" title="Python master Mosh, a beginner with zero basic knowledge can get started in 6 hours" class="wzrthreelaimg"> <img src="https://img.php.cn/upload/course/000/000/067/6616418ca80b8916.png" alt="Python master Mosh, a beginner with zero basic knowledge can get started in 6 hours"/> </a> <div class="wzrthree-right"> <a target="_blank" title="Python master Mosh, a beginner with zero basic knowledge can get started in 6 hours" href="https://www.php.cn/course/1644.html">Python master Mosh, a beginner with zero basic knowledge can get started in 6 hours</a> <div class="wzrthreerb"> <div >27339 times of learning</div> <div class="courseICollection" data-id="1644"> </div> </div> </div> </li> </ul> </div> <script> var mySwiper = new Swiper('.swiper2', { autoplay: false,//可选选项，自动滑动 slidesPerView : 'auto', }) $('.wzrthreeTab>div').click(function(e){ $('.wzrthreeTab>div').removeClass('check') $(this).addClass('check') $('.wzrthreelist>ul').css('display','none') $('.'+e.currentTarget.dataset.id).show() }) </script> </div> <div class="wzrFour"> <div class="wzrfour-title"> <div>Latest Downloads</div> <a href="https://www.php.cn/xiazai">More> </a> </div> <script> $(document).ready(function(){ var sjyx_banSwiper = new Swiper(".sjyx_banSwiperwz",{ speed:1000, autoplay:{ delay:3500, disableOnInteraction: false, }, pagination:{ el:'.sjyx_banSwiperwz .swiper-pagination', clickable :false, }, loop:true }) }) </script> <div class="wzrfourList swiper3"> <div class="wzrfourlTab swiper-wrapper"> <div class="check swiper-slide" data-id="onef">Web Effects <div></div></div> <div class="swiper-slide" data-id="twof">Website Source Code<div></div></div> <div class="swiper-slide" data-id="threef">Website Materials<div></div></div> <div class="swiper-slide" data-id="fourf">Front End Template<div></div></div> </div> <ul class="onef"> <li> <div class="wzrfourli"> <a target="_blank" title="jQuery enterprise message form contact code" href="https://www.php.cn/toolset/js-special-effects/8071">[form button] jQuery enterprise message form contact code</a> </div> </li> <li> <div class="wzrfourli"> <a target="_blank" title="HTML5 MP3 music box playback effects" href="https://www.php.cn/toolset/js-special-effects/8070">[Player special effects] HTML5 MP3 music box playback effects</a> </div> </li> <li> <div class="wzrfourli"> <a target="_blank" title="HTML5 cool particle animation navigation menu special effects" href="https://www.php.cn/toolset/js-special-effects/8069">[Menu navigation] HTML5 cool particle animation navigation menu special effects</a> </div> </li> <li> <div class="wzrfourli"> <a target="_blank" title="jQuery visual form drag and drop editing code" href="https://www.php.cn/toolset/js-special-effects/8068">[form button] jQuery visual form drag and drop editing code</a> </div> </li> <li> <div class="wzrfourli"> <a target="_blank" title="VUE.JS imitation Kugou music player code" href="https://www.php.cn/toolset/js-special-effects/8067">[Player special effects] VUE.JS imitation Kugou music player code</a> </div> </li> <li> <div class="wzrfourli"> <a target="_blank" title="Classic html5 pushing box game" href="https://www.php.cn/toolset/js-special-effects/8066">[html5 special effects] Classic html5 pushing box game</a> </div> </li> <li> <div class="wzrfourli"> <a target="_blank" title="jQuery scrolling to add or reduce image effects" href="https://www.php.cn/toolset/js-special-effects/8065">[Picture special effects] jQuery scrolling to add or reduce image effects</a> </div> </li> <li> <div class="wzrfourli"> <a target="_blank" title="CSS3 personal album cover hover zoom effect" href="https://www.php.cn/toolset/js-special-effects/8064">[Photo album effects] CSS3 personal album cover hover zoom effect</a> </div> </li> </ul> <ul class="twof" style="display:none"> <li> <div class="wzrfourli"> <a href="https://www.php.cn/toolset/website-source-code/8328" title="Home Decor Cleaning and Repair Service Company Website Template" target="_blank">[Front-end template] Home Decor Cleaning and Repair Service Company Website Template</a> </div> </li> <li> <div class="wzrfourli"> <a href="https://www.php.cn/toolset/website-source-code/8327" title="Fresh color personal resume guide page template" target="_blank">[Front-end template] Fresh color personal resume guide page template</a> </div> </li> <li> <div class="wzrfourli"> <a href="https://www.php.cn/toolset/website-source-code/8326" title="Designer Creative Job Resume Web Template" target="_blank">[Front-end template] Designer Creative Job Resume Web Template</a> </div> </li> <li> <div class="wzrfourli"> <a href="https://www.php.cn/toolset/website-source-code/8325" title="Modern engineering construction company website template" target="_blank">[Front-end template] Modern engineering construction company website template</a> </div> </li> <li> <div class="wzrfourli"> <a href="https://www.php.cn/toolset/website-source-code/8324" title="Responsive HTML5 template for educational service institutions" target="_blank">[Front-end template] Responsive HTML5 template for educational service institutions</a> </div> </li> <li> <div class="wzrfourli"> <a href="https://www.php.cn/toolset/website-source-code/8323" title="Online e-book store mall website template" target="_blank">[Front-end template] Online e-book store mall website template</a> </div> </li> <li> <div class="wzrfourli"> <a href="https://www.php.cn/toolset/website-source-code/8322" title="IT technology solves Internet company website template" target="_blank">[Front-end template] IT technology solves Internet company website template</a> </div> </li> <li> <div class="wzrfourli"> <a href="https://www.php.cn/toolset/website-source-code/8321" title="Purple style foreign exchange trading service website template" target="_blank">[Front-end template] Purple style foreign exchange trading service website template</a> </div> </li> </ul> <ul class="threef" style="display:none"> <li> <div class="wzrfourli"> <a href="https://www.php.cn/toolset/website-materials/3078" target="_blank" title="Cute summer elements vector material (EPS PNG)">[PNG material] Cute summer elements vector material (EPS PNG)</a> </div> </li> <li> <div class="wzrfourli"> <a href="https://www.php.cn/toolset/website-materials/3077" target="_blank" title="Four red 2023 graduation badges vector material (AI EPS PNG)">[PNG material] Four red 2023 graduation badges vector material (AI EPS PNG)</a> </div> </li> <li> <div class="wzrfourli"> <a href="https://www.php.cn/toolset/website-materials/3076" target="_blank" title="Singing bird and cart filled with flowers design spring banner vector material (AI EPS)">[banner picture] Singing bird and cart filled with flowers design spring banner vector material (AI EPS)</a> </div> </li> <li> <div class="wzrfourli"> <a href="https://www.php.cn/toolset/website-materials/3075" target="_blank" title="Golden graduation cap vector material (EPS PNG)">[PNG material] Golden graduation cap vector material (EPS PNG)</a> </div> </li> <li> <div class="wzrfourli"> <a href="https://www.php.cn/toolset/website-materials/3074" target="_blank" title="Black and white style mountain icon vector material (EPS PNG)">[PNG material] Black and white style mountain icon vector material (EPS PNG)</a> </div> </li> <li> <div class="wzrfourli"> <a href="https://www.php.cn/toolset/website-materials/3073" target="_blank" title="Superhero silhouette vector material (EPS PNG) with different color cloaks and different poses">[PNG material] Superhero silhouette vector material (EPS PNG) with different color cloaks and different poses</a> </div> </li> <li> <div class="wzrfourli"> <a href="https://www.php.cn/toolset/website-materials/3072" target="_blank" title="Flat style Arbor Day banner vector material (AI+EPS)">[banner picture] Flat style Arbor Day banner vector material (AI+EPS)</a> </div> </li> <li> <div class="wzrfourli"> <a href="https://www.php.cn/toolset/website-materials/3071" target="_blank" title="Nine comic-style exploding chat bubbles vector material (EPS+PNG)">[PNG material] Nine comic-style exploding chat bubbles vector material (EPS+PNG)</a> </div> </li> </ul> <ul class="fourf" style="display:none"> <li> <div class="wzrfourli"> <a href="https://www.php.cn/toolset/website-source-code/8328" target="_blank" title="Home Decor Cleaning and Repair Service Company Website Template">[Front-end template] Home Decor Cleaning and Repair Service Company Website Template</a> </div> </li> <li> <div class="wzrfourli"> <a href="https://www.php.cn/toolset/website-source-code/8327" target="_blank" title="Fresh color personal resume guide page template">[Front-end template] Fresh color personal resume guide page template</a> </div> </li> <li> <div class="wzrfourli"> <a href="https://www.php.cn/toolset/website-source-code/8326" target="_blank" title="Designer Creative Job Resume Web Template">[Front-end template] Designer Creative Job Resume Web Template</a> </div> </li> <li> <div class="wzrfourli"> <a href="https://www.php.cn/toolset/website-source-code/8325" target="_blank" title="Modern engineering construction company website template">[Front-end template] Modern engineering construction company website template</a> </div> </li> <li> <div class="wzrfourli"> <a href="https://www.php.cn/toolset/website-source-code/8324" target="_blank" title="Responsive HTML5 template for educational service institutions">[Front-end template] Responsive HTML5 template for educational service institutions</a> </div> </li> <li> <div class="wzrfourli"> <a href="https://www.php.cn/toolset/website-source-code/8323" target="_blank" title="Online e-book store mall website template">[Front-end template] Online e-book store mall website template</a> </div> </li> <li> <div class="wzrfourli"> <a href="https://www.php.cn/toolset/website-source-code/8322" target="_blank" title="IT technology solves Internet company website template">[Front-end template] IT technology solves Internet company website template</a> </div> </li> <li> <div class="wzrfourli"> <a href="https://www.php.cn/toolset/website-source-code/8321" target="_blank" title="Purple style foreign exchange trading service website template">[Front-end template] Purple style foreign exchange trading service website template</a> </div> </li> </ul> </div> <script> var mySwiper = new Swiper('.swiper3', { autoplay: false,//可选选项，自动滑动 slidesPerView : 'auto', }) $('.wzrfourlTab>div').click(function(e){ $('.wzrfourlTab>div').removeClass('check') $(this).addClass('check') $('.wzrfourList>ul').css('display','none') $('.'+e.currentTarget.dataset.id).show() }) </script> </div> </div> </div> <footer> <div class="footer"> <div class="footertop"> <img src="/static/imghw/logo.png" alt=""> Public welfare online PHP training，Help PHP learners grow quickly！ </div> <div class="footermid"> <a href="https://www.php.cn/about/us.html">About us</a> <a href="https://www.php.cn/about/disclaimer.html">Disclaimer</a> <a href="https://www.php.cn/update/article_0_1.html">Sitemap</a> </div> <div class="footerbottom"> © php.cn All rights reserved </div> </div> </footer> <input type="hidden" id="verifycode" value="/captcha.html"> <script>layui.use(['element', 'carousel'], function () {var element = layui.element;$ = layui.jquery;var carousel = layui.carousel;carousel.render({elem: '#test1', width: '100%', height: '330px', arrow: 'always'});$.getScript('/static/js/jquery.lazyload.min.js', function () {$("img").lazyload({placeholder: "/static/images/load.jpg", effect: "fadeIn", threshold: 200, skip_invisible: false});});});</script> <script src="/static/js/common_new.js"></script> <script type="text/javascript" src="/static/js/jquery.cookie.js?1736341413"></script> <script src="https://vdse.bdstatic.com//search-video.v1.min.js"></script> <link rel='stylesheet' id='_main-css' href='/static/css/viewer.min.css?2' type='text/css' media='all'/> <script type='text/javascript' src='/static/js/viewer.min.js?1'></script> <script type='text/javascript' src='/static/js/jquery-viewer.min.js'></script> <script type="text/javascript" src="/static/js/global.min.js?5.5.53"></script>  <script> var _paq = window._paq = window._paq || []; /* tracker methods like "setCustomDimension" should be called before "trackPageView" */ _paq.push(['trackPageView']); _paq.push(['enableLinkTracking']); (function() { var u="https://tongji.php.cn/"; _paq.push(['setTrackerUrl', u+'matomo.php']); _paq.push(['setSiteId', '9']); var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0]; g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s); })(); </script>  </body> </html>

Summary of commonly used tags in html

html tag<

...

(MAX)

...