Follow the husband to learn HTML essay CSS (*^__^*)

Source: Internet
Author: User

Control text display Word count, over specified text length x display ...

White-space:nowrap; //rules cannot be changed.

Overflow:hidden;

Text-overflow:ellipsis; //out of length, "..." Display

width:320px;

Set div inside Div Center display (Display:flex in this method is higher, so IE9 is not compatible)

Parent Div Plus CSS Properties

Display:flex;
Justify-content:center;
Align-items:center;

Input box initial prompt text

placeholder= "mobile phone number/email/username"/

The margin of the child layer is merged with that of the parent class: http://blog.csdn.net/hnxieyi/article/details/52818236

You can avoid the consolidation of margin in the following ways

Use float to locate (conditional requirements, wide application range)
Add overflow attributes that are not visiable for the parent element (very wide, recommended)
Add border to an element (not normally used)
Use absolute positioning (narrower range of application)
Parent element Add Padding-top attribute (change size, not recommended)


But goose when I use Margin-top to find a problem: In the previous layer has a clear attribute when the Margin-top does not work, should still be the issue of margin merger, but the specific reason I did not analyze clearly, only provide a few solutions, for your reference:

Add a layer to the middle <div style= "Clear:both" ></div>
Set the margin-bottom of the previous layer to replace the margin-top of the next layer
Use the wrapping layer, and set the upper and lower layers are used float:left;
Use absolute positioning
All plus border.

The parent layer walks down the sub-layer to use Find ();

The Childern () //children () method returns all the immediate child elements of the selected element.

Animate uses

Div,animate ({"": "", "": ""},1200)

where {} can be a style for performing animations e.g height, left ....

"1200" is milliseconds or "fast" "normal" "slow" is the execution speed of the animation

JS Post-addition element binding event can be used by the following method

$ (document). On ("click", '. Addspan ', function () {
$ (this). Remove ();

});

Or we can pass in before adding elements. Writes the bound event to the HTML of the added element

e.g

var Elespan = "<onclick= ' Labelclick (this) '>" +sign+ "</  span>";   Use this as the parameter of the Bind event if (Spanlength = = 0) {            $ (". Selected"). empty ();                                    $ (". Selected"). Append (Elespan);             < 3 {                $ (". Selected"). Append (Elespan);                } else{                    alert ("Add up to three Oh ~");                    } function Labelclick (ele) {        $ (ele). Remove ();    

jquery Method:

Removeclass (); //delete class

AddClass (); //Additive class

Empty (); //Remove all content from the selected element, including all text and child nodes.

Remove (); //Remove the selected element, including all text and child nodes.

Val (); //Returns or sets the value of the selected element. The value of the element is set through the Value property. This method is mostly used for input elements. Value is the JS attribute

Text (); //Returns or sets all text values in the selected element

Index (); //The position of the same fellow is from 0, cannot be found for-1

For a special format we can use table

Row Spacing setting for table

BORDER-SPACING:2PX 15px; //Landscape 2px; Portrait 15px

Remove adjacent duplicate borders

Margin:0 0-1px-1px; (adjusts according to the border width)

Position   Absolute  relative difference

Absolute: The layer that is positioned for absolute is always relative to its nearest definition as the parent of absolute or relative, and the parent layer is not necessarily its immediate parent layer.
If absolute or relative are not defined in their parent layer, they are positioned relative to the body.

The relative:relative positioned layer is always relative to its nearest parent element, regardless of its parent element's positioning method

Background positioning

120px 12px Horizontal 120px, vertical direction 12x;

Follow the husband to learn HTML essay CSS (*^__^*)

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.