Section I.
XHTML Specification
* Documentation aspects
-You must define a document type (DTD) and a name control
* Labeling aspects
-all labels are lowercase, closed, properly nested, ID cannot be duplicated
-Tag attribute the drug has a value, the attribute value must be printed number and cannot be empty
-image must be added with ALT attribute
-table labels are not allowed to use the Height property, you can use the Width property
-No Use<Embed><iframe>Label, non-standard
-Connection is not allowed using the target property
* Content Model:
-body, form, blockquote can only contain block elements
-inline elements such as text, images, joins, etc. are not allowed directly in the body and must be contained by a block element such as P or div
-Inner chain elements cannot contain block elements
* Other Content
1: The text in the note cannot contain--
2: All special symbols need to be expressed in code
Section II
< block elements >
-block elements are typically container elements of other elements, and fast elements generally start from the new line, which can hold text, inline elements, and other blocky elements, and can be sized with the width and Height properties
, the common block element is the paragraph table "p"
* Special case
-form tags can only hold block elements
* Questions
-table whether a tag belongs to a block element
Common block elements
-div,p,table,h1~h6,ul,ol,li,dl,dt,dd,center,form
< inline elements >
-inline elements are both non-blocky elements, inline elements can only hold text or other inline elements, do not have exclusive lines, and the width and Height properties do not work on them and can accommodate inline elements and text elements
XHTML Total 91 Tags
Summary of issues:
1> how to make a block element do not monopolize a row, so that it can be a row
Method One: Add the Float property, such as
<div style= "width:200px; height:200px; background:red; Float:left "></div>
<div style= "width:200px; height:200px; Background:blue; Float:left "></div>
<a href= "#" style= "width:200px; height:200px; Background:yellow; Float:left "> Information Co., Ltd. </a>
Method Two:
2> How to make the width and Heigth properties work with inline elements
Method One: Add the Float property, such as
<div style= "width:200px; height:200px; background:red; Float:left "></div>
<div style= "width:200px; height:200px; Background:blue; Float:left "></div>
<a href= "#" style= "width:200px; height:200px; Background:yellow; Float:left "> Information Co., Ltd. </a>
Method Two: Add Display:block style, display modify inline element as block element
Like what<a href= "#" style= "width:200px; height:200px; background:yellow; float:left; Display:block" >x</a>
Section III
<Box Model>
* Box Model four elements
-(content) content (border) border (padding) margin margin (margin)
Two boxes up and down spacing to the top and bottom spacing
<Divstyle= "width:200px; height:200px; background: #E16B11; margin-button:10px;" ></Div>
<Divstyle= "width:200px; height:200px; background: #13AB86; margin-top:20px;" ></Div>
==>20px
Two boxes left and right spacing between left and right
<Divstyle= "width:200px; height:200px; background: #E16B11; margin-right:10px;float:left" ></Div>
<Divstyle= "width:200px; height:200px; background: #13AB86; margin-left:20px;float:left" ></Div>
==>30px
XHTML+CSS Study Notes
