ටෙක්ස්ටීරියාවක ප්‍රතිනිර්මාණය කළ හැකි දේපල අක්‍රීය කරන්නේ කෙසේද?

2657

නැවත වෙනස් කළ හැකි දේපල අක්‍රීය කිරීමට මට අවශ්‍යය textarea.

දැනට, මට textareaදකුණු පස පහළ කෙළවරේ ක්ලික් කර textareaමූසිකය ඇදගෙන යාමෙන් මට ප්‍රමාණය වෙනස් කළ හැකිය . මෙය අක්‍රිය කරන්නේ කෙසේද?

html css

— user549757
source

4

DJDIsaaks - තව දුරටත්, යම් යම් තත්වයන් තුළ ප්‍රමාණය වෙනස් කිරීමට ඉඩ දීමෙන් පිරිසැලසුම සහ මුද්‍රණ හැකියාව බිඳ දැමිය හැකිය (වර්තමාන මෙහෙවර-තීරණාත්මක ව්‍යාපෘතියක වැදගත් අංගයකි).

— random_user_name

10

සමහර විට ඔබට ප්‍රතිනිර්මාණය කළ නොහැකි පෙළක් අවශ්‍ය වේ. නිදසුනක් ලෙස, මේ අවස්ථාවේ දී, ඔබ (කොන්දේසි සහිතව) පෙළක් ලේබලයක් මෙන් පෙනෙන දෙයක් බවට පරිවර්තනය කරන විට. අහඹු ලෙස පාවෙන උදුරා ගැනීමේ පැත්තක් සහිත ලේබලයක් තිබීම ඇත්තෙන්ම අමුතු දෙයක් ලෙස පෙනේ.

— neminem

2

හොඳ සියල්ලන්ගේ ආදරය සඳහා, කරුණාකර මෙය සත්‍ය පෙළක් මත නොකරන්න, නැතහොත් ඔබ ඔබේ බල පරිශීලකයින් en ත් කරනු ඇත. මූලික බ්‍රව්සරයේ ක්‍රියාකාරිත්වය බිඳ දැමීම න්‍යෂ්ටික විකල්පයක් ලෙස සැලකිය යුතුය.

— සුපර්ලුමිනරි

3540

පහත දැක්වෙන CSS රීතිය මඟින් textareaමූලද්‍රව්‍ය සඳහා ප්‍රමාණය වෙනස් කිරීම අක්‍රීය කරයි :

textarea {
  resize: none;
}

සමහර සඳහා එය අක්රිය කිරීමට (නමුත් සියලු) textareas, එහි වේ විකල්ප කිහිපයක් .

(එනම්, ) ලෙස සකසා textareaඇති nameගුණාංගය සමඟ විශේෂිත අක්‍රීය කිරීමට :foo<textarea name="foo"></textarea>

textarea[name=foo] {
  resize: none;
}

නැතහොත්, idලක්ෂණයක් භාවිතා කිරීම (එනම්, <textarea id="foo"></textarea>):

#foo {
  resize: none;
}

මෙම W3C පිටුව සීමා ගැලපීම් සඳහා ලැයිස්තු හැකි සාරධර්ම: None, දෙකම, තිරස්, සිරස්, සහ උරුම:

textarea {
  resize: vertical; /* user can resize vertically, but width is fixed */
}

දැනට මෙම විශේෂාංගයට සහය දක්වන බ්‍රව්සර් මොනවාදැයි බැලීමට හොඳ අනුකූලතා පිටුවක් සමාලෝචනය කරන්න . ජෝන් හල්කා අදහස් දක්වා ඇති පරිදි , උපරිම පළල, උපරිම උස, අවම පළල සහ අවම උස භාවිතා කරමින් CSS හි මානයන් තවදුරටත් සීමා කළ හැකිය .

දැන ගැනීමට ඉතා වැදගත්:

පිටාර ගලන දේපල දෘශ්‍යමාන හැර වෙනත් දෙයක් මිස මෙම දේපල කිසිවක් නොකරයි, එය බොහෝ මූලද්‍රව්‍යයන්ගේ පෙරනිමිය වේ. එබැවින් සාමාන්‍යයෙන් මෙය භාවිතා කිරීම සඳහා, ඔබට පිටාර ගැලීම වැනි දෙයක් සැකසීමට සිදුවේ: අනුචලනය;

සාරා කෝප්ගේ උපුටා දැක්වීම, http://css-tricks.com/almanac/properties/r/resize/

— ඩෝනට්
source

ෆයර්ෆොක්ස්, ඔපෙරා සහ / හෝ අයිඊ සඳහා විසඳුමක් තිබේද?

— අයිම් විදාස්

6

Ime Šime IE සහ FF3 (සහ ඊට පෙර) ආධාරක ප්‍රතිප්‍රමාණනය එකතු නොකරයි, එබැවින් ඒවා සඳහා විසඳුමක් අවශ්‍ය නොවේ. FF4 සඳහා, මෙම විසඳුම ක්රියා කළ යුතුය.

— ඩෝනට්

24

davidwalsh.name/textarea-resize අනුව - ප්‍රමාණය වෙනස් කිරීම: සිරස් හෝ ප්‍රමාණය වෙනස් කිරීම: එක් මානයකට ප්‍රමාණය වෙනස් කිරීම සීමා කිරීමට තිරස්. නැතහොත් උපරිම පළල, උපරිම උස, අවම පළල සහ අවම උස භාවිතා කරන්න.

— ජෝන් හල්කා

3

Css භාවිතයෙන් මෙය සැකසීම අමුතු දෙයක් ලෙස සලකන්නේ මම පමණක්ද? CSS භාවිතයෙන් මට අක්‍රීය හෝ පරීක්ෂා කළ හෝ වෙනත් දේපල සැකසිය නොහැක්කේ ඇයි ...

— Buksy

6

Uk බුක්සි නිසා "ආබාධිත" යනු දෘශ්‍ය දේපලක් නොව රාජ්‍යයකි. මේ අනුව එය මෝස්තර භාෂාවක් මගින් තීරණය නොකළ යුතු බව තර්කානුකූල ය .

— ක්‍රොල්ටන්

206

CSS හි ...

textarea {
    resize: none;
}

— ජෙෆ් පාකර්
source

105

මට කරුණු දෙකක් හමු විය:

පලමු

textarea{resize: none}

මෙය CSS 3 වන අතර එය තවමත් නිකුත් කර නොමැති අතර එය ෆයර්ෆොක්ස් 4 (සහ පසුව), ක්‍රෝම් සහ සෆාරි සමඟ අනුකූල වේ.

තවත් ආකෘති ලක්ෂණයක් වන්නේ dir ගුණාංගය overflow: autoසැලකිල්ලට ගනිමින් නිවැරදි අනුචලන තීරුවෙන් ඉවත් කිරීමයි .

කේතය සහ විවිධ බ්‍රව්සර්

මූලික HTML

<!DOCTYPE html>
<html>
<head>
</head>
<body>
    <textarea style="overflow:auto;resize:none" rows="13" cols="20"></textarea>
</body>
</html>

සමහර බ්‍රව්සර්

ඉන්ටර්නෙට් එක්ස්ප්ලෝරර් 8

රූප විස්තරය මෙහි ඇතුළත් කරන්න

ෆයර්ෆොක්ස් 17.0.1

රූප විස්තරය මෙහි ඇතුළත් කරන්න

Chrome

රූප විස්තරය මෙහි ඇතුළත් කරන්න

— රමී ජම්ලේ
source

62

CSS 3 යූඅයි මූලද්‍රව්‍ය සඳහා නව දේපලක් ඇති අතර එය ඔබට මෙය කිරීමට ඉඩ සලසයි. දේපල යනු ප්‍රමාණය වෙනස් කිරීමේ දේපලයි . එබැවින් සියලුම පෙළ මූලද්‍රව්‍යවල ප්‍රමාණය වෙනස් කිරීම අක්‍රීය කිරීම සඳහා ඔබ පහත සඳහන් දෑ ඔබේ මෝස්තර පත්‍රයට එක් කරයි:

textarea { resize: none; }

මෙය CSS 3 දේපලකි; බ්‍රව්සර් අනුකූලතාව බැලීමට අනුකූලතා සටහනක් භාවිතා කරන්න .

පුද්ගලිකව, ටෙක්ස්ටාරියා මූලද්‍රව්‍යවල ප්‍රමාණය වෙනස් කිරීම අක්‍රීය කිරීම මට මහත් කරදරයක් වනු ඇත. මෙය නිර්මාණකරු විසින් පරිශීලකයාගේ සේවාදායකයා "බිඳ දැමීමට" උත්සාහ කරන එක් අවස්ථාවකි. ඔබේ සැලසුමට විශාල පෙළක් ලබා ගත නොහැකි නම්, ඔබේ සැලසුම ක්‍රියාත්මක වන ආකාරය නැවත සලකා බැලීමට ඔබට අවශ්‍ය විය හැකිය. textarea { resize: both !important; }ඔබේ මනාපය අභිබවා යාමට ඕනෑම පරිශීලකයෙකුට ඔවුන්ගේ පරිශීලක මෝස්තර පත්‍රයට එකතු කළ හැකිය .

— ජේම්ස් සුමනර්ස්
source

නමුත් පරිශීලකයා තම / ඇයගේ ප්‍රමාණය වෙනස් කර වැඩ නොකරන දෙයක් කිරීමට අවශ්‍ය පරිශීලකයාට වඩා ඔවුන්ගේ පිරිසැලසුම හිතාමතාම බිඳ දමනු ඇතtexarea

— රෙඩ්වුල්ෆ් වැඩසටහන්

25

<textarea style="resize:none" rows="10" placeholder="Enter Text" ></textarea>

— ඉම්ටියාස් අලි බයිගල්
source

21

ඔබට ගැඹුරු සහාය අවශ්‍ය නම්, ඔබට පැරණි පාසල් තාක්ෂණයක් භාවිතා කළ හැකිය:

textarea {
    max-width: /* desired fixed width */ px;
    min-width: /* desired fixed width */ px;
    min-height: /* desired fixed height */ px;
    max-height: /* desired fixed height */ px;
}

— යෙව්ගීනී
source

7

resize:noneකලකිරීමට පත්වන පරිදි පහළ කෙළවරේ හසුරුව දිස්වීම වැළැක්වීමට මෙම විසඳුම සමඟ භාවිතා කරන්න.

— මැක්‍රෝමන්

13

මෙය HTML වලින් පහසුවෙන් කළ හැකිය:

<textarea name="textinput" draggable="false"></textarea>

මෙය මට වැඩ කරයි. පෙරනිමි අගය ගුණාංගය trueසඳහා draggableවේ.

— තුසිතා වික්‍රමසිංහ
source

මෙය HTML 5 ගුණාංගයකි, එබැවින් සහාය දක්වන්නේ නව බ්‍රව්සර් පමණි. 9 සිට IE එයට සහය දක්වන කොතැනක හෝ කියවා ඇත.

— ඇන්ටනි ඩී ඇන්ඩ්‍රියා

4

මෙය බොහෝ බ්‍රව්සර් වල වැඩ කරයි. සෑම නවතම බ්‍රව්සරයකම.

— තුසිතා වික්‍රමසිංහ

එය පෙළ ප්‍රමාණය වෙනස් කිරීම වළක්වන්නේ නැත

— මිෂ්කෝ ව්ලැඩිමීර්

@ ඇන්ටනි ඩී ඇන්ඩ්‍රියා මෙය නවතම ක්‍රෝම් මත ක්‍රියා නොකරයි: jsfiddle.net/ps2v8df9

— අද්වයිට් ජුනාර්කාර්

6

ප්‍රමාණය වෙනස් කිරීමේ දේපල අක්‍රීය කිරීමට, පහත දැක්වෙන CSS දේපල භාවිතා කරන්න:

resize: none;

ඔබට මෙය ඉන්ලයින් විලාසිතාවේ දේපලක් ලෙස යෙදිය හැකිය:
```
<textarea style="resize: none;"></textarea>
```
හෝ <style>...</style>මූලද්‍රව්‍ය ටැග් අතර:
```
textarea {
    resize: none;
}
```

— වෙබෙන්ග්
source

6

ඔබ සරලවම භාවිතා කරන්නේ: resize: none;ඔබේ CSS තුළ.

මෙම ප්රතිප්රමාණ මූලද්රව්යයක් පරිශීලකයා විසින් resizable නැද්ද යන්න දේපල නියම කරනු ලබයි.

සටහන: ප්‍රතිවිකුණුම් දේපල අදාළ වන්නේ ගණනය කළ පිටාර ගැලීමේ අගය “දෘශ්‍යමාන” හැර වෙනත් දෙයකි.

ද ප්රතිප්රමාණ මේ මොහොතේ Internet Explorer හි සහය නොදක්වයි.

ප්‍රමාණය වෙනස් කිරීම සඳහා විවිධ ගුණාංග මෙන්න:

ප්‍රමාණය වෙනස් නොකරන්න:

textarea {
  resize: none;
}

ක්‍රම දෙකම ප්‍රමාණය වෙනස් කරන්න (සිරස් සහ තිරස් අතට):

textarea {
  resize: both;
}

සිරස් අතට ප්‍රමාණය වෙනස් කරන්න:

textarea {
  resize: vertical;
}

තිරස් අතට ප්‍රමාණය වෙනස් කරන්න:

textarea {
  resize: horizontal;
}

ඔබ සතුව තිබේ නම් widthසහ heightඔබේ CSS හෝ HTML හි තිබේ නම්, එය පුළුල් බ්‍රව්සර් ආධාරයෙන් ඔබේ පෙළ ප්‍රමාණය වෙනස් කිරීම වළක්වනු ඇත.

— අලිරේසා
source

3

CSS 3 හට මෙම ගැටළුව විසඳා ගත හැකිය. අවාසනාවට එයට සහය දක්වන්නේ වර්තමානයේ භාවිතා කරන බ්‍රව්සර් වලින් 60% ක් පමණි .

ඉන්ටර්නෙට් එක්ස්ප්ලෝරර් සහ iOS සඳහා ඔබට ප්‍රමාණය වෙනස් කිරීම අක්‍රිය කළ නොහැක, නමුත් textareaඑහි widthසහ එය සැකසීමෙන් ඔබට මානය සීමා කළ හැකිය height.

/* One can also turn on/off specific axis. Defaults to both on. */
textarea { resize:vertical; } /* none|horizontal|vertical|both */

නිරූපණය බලන්න

— ඔරියෝල්
source

3

ඔබට මේ වගේ ටෙක්ස්ටාරියා දේපල අක්‍රීය කළ හැකිය :

textarea {
    resize: none;
}

සිරස් හෝ තිරස් ප්‍රමාණය වෙනස් කිරීම අක්‍රීය කිරීමට , භාවිතා කරන්න

resize: vertical;

හෝ

resize: horizontal;

— පීටර් මෝර්ටෙන්සන්
source

2

ප්‍රමාණයන් ප්‍රමාණය වෙනස් වන ආකාරය පෙන්වීමට මම කුඩා නිරූපණයක් නිර්මාණය කර ඇත්තෙමි. එය ඔබටත් අන් අයටත් උපකාරී වනු ඇතැයි මම බලාපොරොත්තු වෙමි.

.resizeable {
  resize: both;
}

.noResizeable {
  resize: none;
}

.resizeable_V {
  resize: vertical;
}

.resizeable_H {
  resize: horizontal;
}

<textarea class="resizeable" rows="5" cols="20" name="resizeable" title="This is Resizable.">
This is Resizable. Lorem ipsum, or lipsum as it is sometimes known, is dummy text used in laying out print, graphic or web designs. The passage is attributed to an unknown typesetter in the 15th century who is thought to have scrambled parts of Cicero's De Finibus Bonorum et Malorum for use in a type specimen book.
</textarea>

<textarea class="noResizeable" rows="5" title="This will not Resizable. " cols="20" name="resizeable">
This will not Resizable. Lorem ipsum, or lipsum as it is sometimes known, is dummy text used in laying out print, graphic or web designs. The passage is attributed to an unknown typesetter in the 15th century who is thought to have scrambled parts of Cicero's De Finibus Bonorum et Malorum for use in a type specimen book.
</textarea>

<textarea class="resizeable_V" title="This is Vertically Resizable." rows="5" cols="20" name="resizeable">
This is Vertically Resizable. Lorem ipsum, or lipsum as it is sometimes known, is dummy text used in laying out print, graphic or web designs. The passage is attributed to an unknown typesetter in the 15th century who is thought to have scrambled parts of Cicero's De Finibus Bonorum et Malorum for use in a type specimen book.
</textarea>

<textarea class="resizeable_H" title="This is Horizontally Resizable." rows="5" cols="20" name="resizeable">
This is Horizontally Resizable. Lorem ipsum, or lipsum as it is sometimes known, is dummy text used in laying out print, graphic or web designs. The passage is attributed to an unknown typesetter in the 15th century who is thought to have scrambled parts of Cicero's De Finibus Bonorum et Malorum for use in a type specimen book.
</textarea>

ස්නිපටය පුළුල් කරන්න

— අම්බුජ් ඛන්නා
source

1

සමඟ @style, ඔබට එයට අභිරුචි ප්‍රමාණයක් ලබා දිය හැකි අතර ප්‍රමාණය වෙනස් කිරීමේ අංගය අක්‍රීය කරන්න (resize: none;).

@Html.TextAreaFor(model => model.YourProperty, new { @style = "width: 90%; height: 180px; resize: none;" })

— කාලෝස් ද ජේසු බාස්
source

1

හෙලෝ, ඔබගේ පිළිතුරට ස්තූතියි, ඊළඟ වතාවේ කේතය සංයුති කරන්න.

— බැප්ටිස්ට් මිලේ-මතියස්

මෙය asp.net MVC පදනම් කරගත් පිළිතුරකි. ඉතා කදිමයි.

— යෝගි හොස්ටිං

0

ඔබට jQuery සමඟද උත්සාහ කළ හැකිය

$('textarea').css("resize", "none");

— සන්තෝෂ් ඛල්ස්
source

3

ඔබ වැඩි jquery භාවිතා කළ යුතුය . ඔබ එය ප්‍රමාණවත් ලෙස භාවිතා නොකරයි. :)

— පිලිප් සැවික්

1

එය මතකයකි - උදා: "ඔබ එය මුළුමනින්ම අතහැර jQuery උත්සාහ කළ යුතුය." .

— පීටර් මෝර්ටෙන්සන්

0

සියලු ප්‍රමාණයන් සඳහා ප්‍රමාණය වෙනස් කිරීම අක්‍රීය කිරීමට textarea:

textarea {
    resize: none;
}

නිශ්චිත ප්‍රමාණයක් සඳහා ප්‍රමාණය වෙනස් කිරීම අක්‍රීය කිරීම සඳහා textarea, ගුණාංගයක් nameහෝ එකක් එකතු කර idඑය යම් දෙයකට සකසන්න. මෙම අවස්ථාවේ දී, එය නම් කර ඇතnoresize

HTML

<textarea name='noresize' id='noresize'> </textarea>

CSS

/* Using the attribute name */
textarea[name=noresize] {
    resize: none;
}
/* Or using the id */

#noresize {
    resize: none;
}

— අබ්ක්
source

-2

එකතු !importantකිරීමෙන් එය ක්‍රියාත්මක වේ:

width:325px !important; height:120px !important; outline:none !important;

outline සමහර බ්‍රව්සර්වල නිල් පැහැති දළ සටහනක් වළක්වා ගැනීම සඳහා පමණි.

— කෙල්ඩ්ස්
source

6

!importantගුණාංගය අනිසි ලෙස භාවිතා නොකරන්න . CSS resize: none

— රැප්ටර්

1

නැත !importantනපුරු?

— පීටර් මෝර්ටෙන්සන්

වත්මන් ක්‍රෝම් වලදී මෙය තිරස් ප්‍රමාණය වෙනස් කිරීම නවත්වයි, නමුත් මට තවමත් පෙළ ප්‍රමාණය සිරස් අතට වෙනස් කළ හැකිය.

— අද්වයිට් ජුනාර්කාර්