HTML5 మరియు CSS3 యొక్క వయసు లో మార్క్

సుదీర్ఘకాలం HTML ను వ్రాస్తున్న మీలో ఆ మూలకం గుర్తుంచుకోవచ్చు. ఇది తెరపై స్క్రోలింగ్ టెక్స్ట్ యొక్క బ్యానర్ను సృష్టించిన బ్రౌజర్-నిర్దిష్ట మూలకం. ఈ ఎలిమెంట్ HTML స్పెసిఫికేషన్కు జోడించబడలేదు మరియు దాని కోసం మద్దతు బ్రౌజర్లలో విస్తృతంగా మారుతూ ఉంది. సానుకూల మరియు ప్రతికూల రెండు - ఈ మూలకం యొక్క ఉపయోగం గురించి ప్రజలు తరచుగా చాలా బలమైన అభిప్రాయాలను కలిగి ఉన్నారు. కానీ మీరు దాన్ని ప్రేమిస్తారా లేదా అసహ్యించుకున్నానా, అది కనిపించే బాక్స్ సరిహద్దులను కప్పి ఉంచే కంటెంట్ను రూపొందించడానికి ఉద్దేశించినది.

బలమైన బ్రౌజర్ల ద్వారా పూర్తిగా అమలు చేయబడని కారణంగా, ఇది ఒక దృశ్య ప్రభావంగా పరిగణించబడిందని మరియు ఇది నిర్మాణాన్ని నిర్వచిస్తున్న HTML చేత నిర్వచించబడదు. బదులుగా, దృశ్యమాన లేదా ప్రదర్శన ప్రభావాలను CSS చేత నిర్వహించాలి. మరియు CSS3 అంశాలకు మార్క్యూ ప్రభావాన్ని ఎలా జోడించాలో నియంత్రించడానికి మార్క్యూ మాడ్యూల్ను జోడిస్తుంది.

కొత్త CSS3 లక్షణాలు

CSS3 మీ కంటెంట్ మార్క్యూలో ఎలా ప్రదర్శిస్తుందో నియంత్రించడానికి ఐదు కొత్త లక్షణాలను జోడిస్తుంది: ఓవర్ఫ్లో-శైలి, మార్క్యూ తరహా, మార్క్యూ-నాటకం-లెక్కింపు, మార్క్యూ దిశ మరియు మార్క్యూ వేగం.

ఓవర్ఫ్లో-శైలిది ఓవర్ఫ్లో-శైలి ఆస్తి (నేను వ్యాసం CSS ఫ్లోఫ్ లో చర్చించారు ఇది) కంటెంట్ బాక్స్ overflows ఆ విషయాలు కోసం ఇష్టపడే శైలి నిర్వచిస్తుంది. మీరు విలువను సెట్ చేస్తే మార్క్యూ లైన్ లేదా మార్క్యూ-బ్లాక్ మీ కంటెంట్ ఎడమ మరియు కుడి వైపున మరియు వెలుపలికి మారుతుంది (మార్క్యూ లైన్) లేదా అప్ / డౌన్ (మార్క్యూ-బ్లాక్).

మార్క్యూ తరహాకంటెంట్ ఎలా వీక్షించబడుతుందో (మరియు వెలుపల) ఎలా మారుస్తుందో ఈ ఆస్తి వివరిస్తుంది.

ఎంపికలు ఉన్నాయి స్క్రోల్, స్లయిడ్ మరియు ప్రత్యామ్నాయ. స్క్రోల్ పూర్తిగా తెరపైకి కంటెంట్తో మొదలవుతుంది, ఇది పూర్తిగా తెరపైకి వచ్చేవరకు కనిపించే ప్రాంతంపై కదులుతుంది. స్లయిడ్ పూర్తిగా తెరవెనుక కంటెంట్తో మొదలవుతుంది మరియు కంటెంట్ తెరపైకి పూర్తిగా మారిపోయే వరకు అది అంతటా కదులుతుంది మరియు తెరపై స్లయిడ్ చేయడానికి మరింత కంటెంట్ లేవు.

చివరగా, ప్రత్యామ్నాయ పక్క నుండి ప్రక్కన కంటెంట్ బౌన్స్ అవుతుంది, ముందుకు వెనుకకు స్లైడింగ్.

మార్క్యూ-నాటకం-లెక్కింపుఉపయోగించి లోపాలు ఒకటి మార్క్యూ మూలకం మార్క్యూ ఆపి ఎప్పుడూ ఉంది. కానీ శైలి లక్షణంతో మార్క్యూ-నాటకం-లెక్కింపు మీరు నిర్దిష్ట సంఖ్యలో కోసం కంటెంట్ను తిప్పడానికి మార్క్ని సెట్ చేయవచ్చు.

మార్క్యూ దిశమీరు స్క్రీన్పై స్క్రోల్ చేయవలసిన దిశను కూడా ఎంచుకోవచ్చు. విలువలు ఎదురు మరియు రివర్స్ టెక్స్ట్ యొక్క దిశలో ఆధారపడి ఉంటాయి ఓవర్ఫ్లో-శైలి ఉంది మార్క్యూ లైన్ మరియు డౌన్ లేదా డౌన్ ఉన్నప్పుడు ఓవర్ఫ్లో-శైలి ఉంది మార్క్యూ-బ్లాక్.

మార్క్యూ-డైరెక్షన్ వివరాలు

ఓవర్ఫ్లో-శైలి	భాషా దిశ	ఎదురు	రివర్స్
మార్క్యూ లైన్	ltr	వదిలి	కుడి
	RTL	కుడి	వదిలి
మార్క్యూ-బ్లాక్		అప్	డౌన్

మార్క్యూ వేగంఈ ఆస్తి ఎంత వేగంగా తెరపై కంటెంట్ స్క్రోల్లను నిర్ణయిస్తుంది. విలువలు నెమ్మదిగా, సాధారణ, మరియు ఫాస్ట్. అసలు వేగం కంటెంట్ మరియు బ్రౌజర్ ప్రదర్శించడం మీద ఆధారపడి ఉంటుంది, కానీ విలువలు ఉండాలి నెమ్మదిగా కంటే నెమ్మదిగా ఉంటుంది సాధారణ ఇది నెమ్మదిగా ఉంటుంది ఫాస్ట్.

మార్క్వీ ప్రాపర్టీస్ యొక్క బ్రౌజర్ మద్దతు

మీరు CSS మార్క్యూ మూలకాలు పని చేయడానికి విక్రేత పూర్వపదాలను ఉపయోగించాలి. ఇవి క్రింది విధంగా ఉన్నాయి:

CSS3	విక్రేత ప్రిఫిక్స్
ఓవర్ఫ్లో-ఎక్స్: మార్క్యూ-లైన్;	ఓవర్ఫ్లో-ఎక్స్: -వెబ్కిట్-మార్క్యూ;
మార్క్యూ తరహా	-webkit-మార్క్యూ తరహా
మార్క్యూ-నాటకం-లెక్కింపు	-webkit-మార్క్యూ-పునరావృత్తులు
మార్క్యూ-దిశ: ముందుకు | రివర్స్;	-వెబ్కిట్-మార్క్యూ-దిశ: ముందుకు | వెనుకకు;
మార్క్యూ వేగం	-webkit-మార్క్యూ వేగం
సమానమైనది కాదు	-webkit-మార్క్యూ-వృద్ధికి

మార్క్యూలో స్క్రీన్పై కంటెంట్ స్క్రోల్లు వలె దశలను ఎలా పెద్దగా లేదా చిన్నదిగా నిర్వచించాలో చివరి ఆస్తి మిమ్మల్ని అనుమతిస్తుంది.

మీ మార్క్యూ పని చేయడానికి, ముందుగా విక్రేత ముందు విలువలు ఉంచండి మరియు వాటిని CSS3 వివరణ విలువలతో అనుసరించండి. ఉదాహరణకు, ఇక్కడ ఒక మార్క్యూ కోసం CSS ఉంది, ఇది ఎడమవైపు నుండి కుడికి 200x50 బాక్స్ లోపల ఐదుసార్లు స్క్రోల్ చేస్తుంది.

{ వెడల్పు: 200px; ఎత్తు: 50px; తెల్లని స్థలం: nowrap; overflow: hidden; ఓవర్ఫ్లో-x: -webkit-మార్క్యూ; -వెబ్కిట్-మార్క్యూ-దిశ: ముందుకు; -వెబ్కిట్-మార్క్యూ-శైలి: స్క్రోల్; -వెబ్కిట్-మార్క్యూ-స్పీడ్: సాధారణ; -వెబ్కిట్-మార్క్యూ-ఇంక్రిమెంట్: చిన్న; -వెబ్కిట్-మార్క్యూ-పునరావృతం: 5; ఓవర్ఫ్లో-ఎక్స్: మార్క్యూ-లైన్; మార్క్యూ-దిశ: ముందుకు; మార్క్యూ-శైలి: స్క్రోల్; మార్క్యూ-స్పీడ్: సాధారణ; మార్క్యూ-ప్లే-కౌంట్: 5;}