spine unity runtime simple basic use guide

2023-01-23   ES  

Chinese recognition statement: <meda charset = “utf-8”> HTML displayed in Chinese requires this sentence.
CSS rules consist of two main parts: selector, and one or more declarations:

Selector is usually the HTML element you need to change the style.

Each statement consists of a attribute and a value.

Property is the style attribute you want to set. Each attribute has a value. The attributes and values are separated by the colon.
The commonly used HTML elements are:
<Title> </Title> (Title)
<p> </p> (paragraph)
<body> </body> (main part)
<br/> It is the empty element (<br/> label definition definition).
<a href=”default.htm, </a> (link element)
When the CSS is chaotic, use <style> </style>
Now officially start CSS learning
1.ID and class selector
ID selector use standard:
<style>
#para1
// Define a name calledpara1
ID type
{
    text-align:center;
    color:red;
</style>
<p id=”para1″>Hello World!</p>
Class selector use standard
(1)
<style>
.center                 // Define a name calledcenter
Class
{
    text-align:center;
}
</style>
<h1 class = “center”> Title centered </h1>
<p class = “center”> The paragraph is centered. </p>
(2)
<style>
p.center     
// Define a name calledcenter
exclusive to the Class of P element
{
    text-align:center;
}
</style>
<p class=”center”>This paragraph will be center-aligned.</p>
2.CSS style table insertion

Insert style tables: There are three ways to insert style tables:

  • (1) External style table   
  • <head>
    <link rel=”stylesheet” type=”text/css” href=”mystyle.css”>//mystyle.css is an external style
    </head>
     // First define onemystyle.css style tables are stored.
  • (2) Internal style table
  • <head>
    <style>
    hr {color:sienna;}
    p {margin-left:20px;}
    body {background-image:url(“images/back40.gif”);}
    </style>
    </head>
  • // Internal insertion<style></style>CSS style editing in it can define multiple element styles.
  • (3) Inner United style
  • <p style=”color:sienna;margin-left:20px”>This is a paragraph.</p>
  • // Style settings in separate elements

(4) Multiple styles will be stacked into one

style table allows style information in multiple ways. The style can be stipulated in a single HTML element, in the head element of the HTML page, or in an external CSS file. You can even quote multiple external style tables inside the same HTML document.

layer stack sequence

When the same HTML element is defined by more than one style, which one will it use?

Generally speaking, all styles will be stacked in a new virtual style table according to the following rules, where the number 4 has the highest priority.

  1. Browser default settings
  2. outer style table
  3. Internal style table (located inside the <head> label)
  4. Inner couplet style (within HTML elements)
Therefore, the inner joint style (within HTML elements) has the highest priority right, which means that it will give priority to the following style declaration: the style statement in the label, the style statement in the external style table, or the browser in the browser Style declaration (default value).
3.
css background
CSS attribute definition background effect:
  • background-color  // Background Color
  • background-image  // Background Picture
  • background-repeat  // Background style (horizontal or vertical, or not flat)
  • background-attachment// Background Attachment:Define the background picture with the rolling shaft movement method
  • background-position// Background Picture location
(1) Background color

In

CSS, the color value is usually defined in the following ways:

  • Sixteen Entry -Ru: “# FF0000”
  • RGB -Such as: “RGB (255,0,0)”
  • color name -such as: “red”
Definition method: Background-COLOR:# B0C4DE;
background-color:rgb(255,0,0)
;
background-color:red
;
(2) Background picture definition:
background-image:url(‘paper.gif’);
(3) Background style:
background-image:url(‘gradient2.png’);
 background-repeat:repeat-x;    //
Generally use Background-Repeat: Repeat-X; Make the picture horizontally flat; no-Repeat
(4) Background Attachment
Value: scroll | Fixed | Inherit
scroll: With the rolling shaft background picture of the page, it will move
FIXED: With the rolling shaft background picture of the page, it will not move
Inherit: Inheritance
Initial value: Scroll
Inheritance: No
Applicable to: all elements
Background: Background .Aattachment: Attachment.
(5) Background location
background-position:right top;//
Represents the picture in the upper right part
Summary
When used in use, you can perform abbreviations: Background: #ffffFFFF URL (‘IMG_TREE.PNG’) No-Repeat Right Top;’IMG_TREE.PNG ‘; not flat; the picture location is on the right. Essence Essence Essence
4.
CSS text format
attribute Description
color Set text color
direction Set text direction.
letter-spacing Set the character spacing
line-height Setting height
text-align Text in alignment elements
text-decoration Add modification to text
text-indent In the first line of the Chinese text in Chinese
text-shadow Set text shadow
text-transform Letter in the control element
unicode-bidi Settings or whether the text is rewritten
vertical-align Set the vertical alignment of the element
white-space Set the blank processing method in the element
word-spacing Set the word spacing
(1)
color
Definition method: consistent with the background color.
(2)
direction: Text direction
ltr default. The direction of the text is from left to right.
rtl The direction of text from right to left.

The

inherit regulations should inherit the value of the Direction property from the parent element.
(3)
letter-spacing: Text character spacing
Definition: Letter-spacing: 2px;
normal default. There is no extra space between characters.
length Define the fixed space between characters (allowed negative values).

The

inherit regulations should inherit the value of the Letter-Spacing property from the parent element.
(4)
line-height
Definition method: line-height: 200%; (%)
                  line-height: 10px;(length)
line-height: 2; (number)
normal default. Set reasonable line spacing.
number Set the number, this number will be multiplied with the current font size to set the line spacing.
length Set a fixed spacing.
% Percent pitch based on the current font size.

The

inherit regulations should inherit the value of the LINE-Height attribute from the parent element.
(5)
text-align
Definition: Text-Align: Right
left Set the text to the left. The default value: determined by the browser.
right Set the text to the right.
center Set the text into the middle.
justify to achieve the effect of alignment at both ends.

The

inherit regulations should inherit the value of the text-align attribute from the parent element.
(6)
text-decoration
Definition method: text-decoration: overline; color definition: text-decoration-color: red (red (red (red (red (red (red (red (red
but:
Almost all mainstream browsers do not support the Text-DECORATION-COLOR property.
Note:Firefox supports another attribute that can replace the attribute, that is, -moz-graw-decoration-color property.
none default. Define the standard text.
underline Define a line under the text.
overline Define a line on the text.
line-through Define a line through the text.
blink Define the flickering text.

The

inherit regulations should inherit the value of the Text-DECORATION attribute from the parent element.
(7)
text-indent
Definition method: XT-indent: 50px;
length Define the fixed indentation. Default value: 0.
% Define the percentage of the width of the parent element.

The

inherit regulations should inherit the value of the Text-indent property from the parent element.
(8)
text-shadow
Definition method: Text-shadow: 2px 2px 8px#ff0000;
h-shadow must. The position of the horizontal shadow. Make negative values.
v-shadow must. The position of vertical shadow. Make negative values.
blur Optional. Vague distance.
color Optional. The color of the shadow.
(9)
text-transform
Definition method: Text-Transform: Uppercase;
none default. Definition text with standards with lowercase letters and uppercase letters.
capitalize Each word in the text starts with capital letters.
uppercase Definition only has uppercase letters.
lowercase Define the non -uppercase letters, only lowercase letters.
inherit The regulations should inherit the value of the Text-Transform attribute from the parent element.
(10)
unicode-bidi
Definition method:unicode-bidi: normal|embed|bidi-override|intitial|inherit;
normal default. No additional embedded level.
embed Create an additional embedded level.
bidi-override Create an additional embedded level. Re -sort depending on the Direction property.
initial Set this attribute to its default value. Seeinitial
inherit
Inherit the attribute from the parent element. Seeinherit
 
(11)
vertical-align
Definition method: vertical-align: text-top;
baseline default. The elements are placed on the baseline of the parent element.
sub Vertical settlement of alignment text.
super Vertical alignment of alignment text
top Align the top of the element with the top of the highest element in the row
text-top Align the top of the element with the top of the parent element font
middle Place this element in the middle of the parent element.
bottom Align the top of the element with the minimum element in the row.
text-bottom Align the bottom end of the element with the bottom end of the parent element font.
length  
% Use the percentage value of the “LINE-Height” property to arrange this element. Make negative value.

The

inherit regulations should inherit the value of the Vertical-Align property from the parent element.
(12)
white-space
Definition method: White-Space: Nowrap
value Description
normal default. Blank will be ignored by the browser.
pre blank will be retained by the browser. Its behavior is similar to the <pre> label in HTML.
nowrap The text will not be changed, and the text will continue on the same line until the <br> label is encountered.
pre-wrap Keep the blank sequence, but it is changed normally.
pre-line merged blank sequence, but retain the exchange symbol.
inherit The regulations should inherit the value of the White-Space attribute from the parent element.
(13)
word-spacing
Definition method: word-spacing: 30px
normal default. Define the standard space between words.
length Define the fixed space between words.
inherit The regulations should inherit the value of the Word-Spacing attribute from the parent element.
This blog is my JS learning notes -CSS to sort out these first, and will continue to update in the future.

source

Related Posts

reactnative Routing: React-navigation 6.x Basic use of Copyer

[bzoj2732] [hnoi2012] Archery (two points+semi -plane interchange) CLOVE

Android Studio Common plug -in and dependent ABNER

How to operate the SQLite3 database through the command line

spine unity runtime simple basic use guide

Random Posts

[Questions] Luogu2278: [HNOI2003] operating system ModestCoder

spark-dataframe data Insert mysql performance optimization IT

Android ———- strong reference, soft reference, weak reference, virtual quotation

Ubuntu Android Studio can’t connect to the real machine

SpringBoot the order of the default access path of static files such as HTML and other static files