Word Body Genus Sex
Font properties |
Describe |
font-family |
Use a specified font name or a type of font family |
font-size |
The size of the font display |
font-style |
Use one of 3 methods to define the displayed font: normal (normal), italic (italic) or oblique (oblique) |
font-weight |
Use bold as the value to make the font bold |
font-variant |
Set up English case conversion |
|
font{font-family: "宋体"; font-size: 12px; font-style: normal; line-height: 20px;font-weight: bold; font-variant: normal; text-transform: capitalize; color: # 666666; text-decoration: underline;} |
文 本 genus 性
Text attribute |
Description |
letter-spacing |
Define an amount of space appended between characters |
Word-spacing |
Define an amount of space appended between words |
text-decoration |
The text modification attribute allows text to be modified by one of 5 attributes |
text-align |
Set the horizontal alignment of text, including left alignment, right alignment, center, and alignment |
text-indent |
The first line of text is indented |
line-height |
The line-height property accepts a value that controls the spacing between text baselines |
text-transform |
Control the case of English text |
|
font{letter-spacing: 2em; text-align: left; text-indent: 10px; vertical-align: middle; word-spacing: 5em; white-space: normal;} |
side frame attribute
Border Frame Property |
Describe |
Border |
Border |
Border-top |
|
border-left |
Left border |
border-right |
Right border |
Border-bottom |
bottom border |
| border-color
| Border color
| border-style
| Border style
| border-width
| Border width
| border-top-color
| Top border color
| border-left-color
| Left border color
| border-right-color
| Right border color
| border-bottom-color
| Bottom border color
| border-top-style
| Top border style
| border-left-style
| Bottom border style
| border-right--style
| Right border style
| border-bottom-style
| Bottom border style
| border-top-width
| Top border width
| border-left-width
| Bottom border width
| border-right-width
| Right border width
| border-bottom-width
| Bottom border width
|
| border{ border-top-width: 1px; border-top-style: dotted; border-top-color: #FF0000;}
Border attribute setting value
Border style attribute value |
Describe |
none |
No borders |
dotted |
The border is composed of points |
dash |
The border is composed of short lines |
solid |
The border is a solid line |
double |
The border is a double solid line |
groove |
The frame has a three-dimensional groove |
ridge |
The border is formed into ridges |
inset |
There is a three-dimensional frame embedded in the frame |
Outset |
A three-dimensional frame is embedded outside the frame |
Ding Bit Genus Sex
Positioning attributes |
Describe |
position |
Absolute (absolute positioning) relative (relative positioning) |
top |
The distance between the layer and the vertical coordinate of the vertex |
left |
The distance between the layer and the abscissa of the vertex |
width |
The width of the layer |
height |
Height of layer |
z-index |
Determines the order and coverage relationship of layers. Elements with higher values will cover elements with lower values |
clip |
Limit the display to only the cropped area. The cropped area is a rectangle. Just set two points. One is the vertex of the upper left corner of the rectangle, which is completed by the settings of top and right. The other is the apex of the lower right foot, which is completed by the settings of bottom and right |
overflow |
When the content in the layer exceeds the range that the layer can accommodate, Visible: the content will be displayed regardless of the size of the layer; Hidden: the content that exceeds the size of the layer will be hidden; scrol: regardless of whether the content exceeds the scope of the layer, select this items will add scroll bars to the layer; auto: only display scroll bars when the content exceeds the scope of the layer |
visibility |
This item is for the setting of nested layers. Nested layers are inserted into other layers and are divided into nested layers (child layers) and nested layers (parent layers). Inherit: The child layer inherits the visibility of the parent layer. If the parent layer is visible, the child layer is also visible; if the parent layer is invisible, the child layer is also invisible. Visible: Whether the parent layer is visible or not, the child layer is visible. Hidden: Whether the parent layer is visible or not, the child layer is hidden. |
District Block Property
Block attributes |
Describe |
width |
Set the width of the object |
height |
Set the height of the object |
float |
Let text wrap around an element |
Clear |
Specify whether to allow surrounding text or objects on a certain side of an element |
padding |
Determines how much space should be inserted between the border and the content. It has four attributes, namely: top (top), right (right), bottom (bottom), and left (left), which are used to set the top, bottom, left, and right padding distances respectively. |
margin |
Determines the spatial distance between the content block and the outer elements. They are: top (top), right (right), bottom (bottom), and left (left) are used to set the top, bottom, left, and right padding distances respectively. |
|
#alignLeft{float:left;margin:0;padding:0;width:100px;height:100px;clear:both} |
Column Table Attribute
List properties |
Describe |
list-style-type |
Set the symbol type of the boot list item |
list-style-image |
Choose an image as a guide symbol for your project li{ list-style-image:url(14-25.gif)} |
list-stle-position |
Determine the degree of indentation of list items |
List symbol type attribute value
List symbol type attribute value |
Describe |
disc |
Add a “●” solid circle in front of the text line |
circle |
Add a “○” hollow circle in front of the text line |
spuare |
Add a “■” solid square in front of the text line |
decimal |
加 Add ordinary Arabic numerals in front of the text line
|
lower-roman
|
加 Add a lowercase Roman numeral in front of the text line
|
加 Added to Rome in front of the text line |
|
Add lowercase English letters in front of the text line |
|
Add uppercase English letters in front of the text line |
|
| Does not display any bullets or numbers
|
#alignLeft li { list-style-image: url(images/arrow1.gif); |
list-style-type: none;list-style-position: outside;}
|
| Description
outside |
||||||||||||||||||||
The list is close to the left border
|
inside |
||||||||||||||||||||
List indentation
|
/*This is how comments are written*/ body { /*Text attribute*/ font-size:12px;/*text size*/ color:#CCCCCC;/*text color*/ font-family:Arial, Helvetica, sans-serif;/*Set font*/ font-weight:bold;/*Bold text*/ text-align:center;/*The horizontal direction inside the DIV tag is centered or left/right*/ text-decoration:underline;/*Underline No underline is none*/ line-height:150%;/*Line heightcan also be pixelspx*/ /*Background attributes*/ /*Background Color*/ background-image:url(images/test.gif);/*background image*/ background-repeat:no-repeat;/*The background image is not tiled*/ background-position:5px 10px;/*The position of the background image, the first is the abscissa, the second is the ordinate*/ /*Padding and border properties*/ height: 100px; width: 100px; margin:10px 0 5px 0;/*Container external margin The order is top right bottom left, when it is 0, no unit is needed*/ margin-top:10px; /*How to write a single item */ padding:10px 0 5px 0;/*Container internal margins, the order is top right bottom left, when it is 0, no unit is needed*/ float:left; /*1. Only use left right and */ when making column structures/*List attributes*/ list-style-type:none;/*Eliminate the small black dots in front of ul unordered list li*/ display:block;/*Displayed in block form, usually used to achieve the mouse-over effect in links*/ display:inline;/*Use it only when the outer margin of the DIV that is moved to the side doubles when float is used. This is for a bug in IE6*/ /*Border attribute*/ border:1px solid #ccc;/*Border attributes of tables, DIV, LI, A and other containers, the dotted line is dashed*/ overflow:hidden;/*Hide the overflow part*/ overflow:auto;/*Automatically determine the height of the container and choose to automatically appear/hide the vertical scroll bar*/ /*Special attributes, do not need to be mastered by force*/ /*Vertical text arrangement:*/writing-mode: tb-rl; /*Predetermined format*/ /*Character spacing*/ letter-spacing:5px; /*word spacing*/ word-spacing:5px; }
|

HTML is the cornerstone of building web page structure. 1. HTML defines the content structure and semantics, and uses, etc. tags. 2. Provide semantic markers, such as, etc., to improve SEO effect. 3. To realize user interaction through tags, pay attention to form verification. 4. Use advanced elements such as, combined with JavaScript to achieve dynamic effects. 5. Common errors include unclosed labels and unquoted attribute values, and verification tools are required. 6. Optimization strategies include reducing HTTP requests, compressing HTML, using semantic tags, etc.

HTML is a language used to build web pages, defining web page structure and content through tags and attributes. 1) HTML organizes document structure through tags, such as,. 2) The browser parses HTML to build the DOM and renders the web page. 3) New features of HTML5, such as, enhance multimedia functions. 4) Common errors include unclosed labels and unquoted attribute values. 5) Optimization suggestions include using semantic tags and reducing file size.

WebdevelopmentreliesonHTML,CSS,andJavaScript:1)HTMLstructurescontent,2)CSSstylesit,and3)JavaScriptaddsinteractivity,formingthebasisofmodernwebexperiences.

The role of HTML is to define the structure and content of a web page through tags and attributes. 1. HTML organizes content through tags such as , making it easy to read and understand. 2. Use semantic tags such as, etc. to enhance accessibility and SEO. 3. Optimizing HTML code can improve web page loading speed and user experience.

HTMLisaspecifictypeofcodefocusedonstructuringwebcontent,while"code"broadlyincludeslanguageslikeJavaScriptandPythonforfunctionality.1)HTMLdefineswebpagestructureusingtags.2)"Code"encompassesawiderrangeoflanguagesforlogicandinteract

HTML, CSS and JavaScript are the three pillars of web development. 1. HTML defines the web page structure and uses tags such as, etc. 2. CSS controls the web page style, using selectors and attributes such as color, font-size, etc. 3. JavaScript realizes dynamic effects and interaction, through event monitoring and DOM operations.

HTML defines the web structure, CSS is responsible for style and layout, and JavaScript gives dynamic interaction. The three perform their duties in web development and jointly build a colorful website.

HTML is suitable for beginners because it is simple and easy to learn and can quickly see results. 1) The learning curve of HTML is smooth and easy to get started. 2) Just master the basic tags to start creating web pages. 3) High flexibility and can be used in combination with CSS and JavaScript. 4) Rich learning resources and modern tools support the learning process.


Hot AI Tools

Undresser.AI Undress
AI-powered app for creating realistic nude photos

AI Clothes Remover
Online AI tool for removing clothes from photos.

Undress AI Tool
Undress images for free

Clothoff.io
AI clothes remover

AI Hentai Generator
Generate AI Hentai for free.

Hot Article

Hot Tools

Dreamweaver Mac version
Visual web development tools

Safe Exam Browser
Safe Exam Browser is a secure browser environment for taking online exams securely. This software turns any computer into a secure workstation. It controls access to any utility and prevents students from using unauthorized resources.

WebStorm Mac version
Useful JavaScript development tools

mPDF
mPDF is a PHP library that can generate PDF files from UTF-8 encoded HTML. The original author, Ian Back, wrote mPDF to output PDF files "on the fly" from his website and handle different languages. It is slower than original scripts like HTML2FPDF and produces larger files when using Unicode fonts, but supports CSS styles etc. and has a lot of enhancements. Supports almost all languages, including RTL (Arabic and Hebrew) and CJK (Chinese, Japanese and Korean). Supports nested block-level elements (such as P, DIV),

DVWA
Damn Vulnerable Web App (DVWA) is a PHP/MySQL web application that is very vulnerable. Its main goals are to be an aid for security professionals to test their skills and tools in a legal environment, to help web developers better understand the process of securing web applications, and to help teachers/students teach/learn in a classroom environment Web application security. The goal of DVWA is to practice some of the most common web vulnerabilities through a simple and straightforward interface, with varying degrees of difficulty. Please note that this software