Question

私は<input>と<textarea>の多くのフォームを持っていて、私はそのデータをPHPで保存して取り出すことができます。 これで、入力/テキストエリアフィールドではなく単純な文字列として値を取得する必要がある別のインターフェース（admin）を作成する必要があります。

私はこのような千コード、管理者に

<div><input type='text' <?php echo "value='".$value1."'";?> ></div> 
<div><textarea> <?php echo $value2;?> </textarea></div> 

を持っていたことを簡単にするために、私はそれがこのコードのように表示させたい、

<div><?php echo $value1;?></div> 
<div><?php echo $value2;?></div> 

私は<input>と<textarea>を維持したいです私はすべてをコード化するのが面倒だから、入力/テキストエリアがないように見える必要があります。

とにかく私は入力とtextarea CSSを値を除いてすべてを取り下げて単純なhtmlテキストのように見せかけることができますか？

アウトラインだけでなく、フォーカスカーソル、高さ/幅の制限を取り下げ、編集可能な機能を無効にすることも含まれます。

私はこれが最善の考えではないことを知っていますが、私は管理インターフェース上の100個の入力/テキストエリアすべてを削除する時間がないと思います。

UPDATE： デフォルトでは、「自動高さテキストエリア」のようなスクロールバーであるオーバーレイされたテキストを表示する必要があります。

Answer 1

使用follwing CSS

input, 
 
textarea { 
 
    background: rgba(0, 0, 0, 0); 
 
    border: none; 
 
    outline: 0; 
 
    cursor: text; 
 
} 
 
textarea { 
 
    resize: none; 
 
}

<input type="text" value="xyz" readonly/> 
 
<br> 
 
<textarea readonly>sasf</textarea>

編集：いけないが、ユーザーは任意のテキストを編集しても、CSSのcursor:text;を追加したい場合は

readonly属性を追加した場合は無効になり、カーソル任意のブラウザに表示されます

Answer 2

HTML

<div> 
    <input class="nostyle" type='text' value='<?php echo $value1; ?>' readonly /> 
</div> 
<div> 
    <textarea readonly><?php echo $value2;?></textarea> 
</div> 

CSS

.nostyle{ 
    border:none; 
    box-shadow:none; 
    outline:none; 
    background: #fff; 
    cursor:default; 
    resize:none; 
} 

Answer 3

はinput[type="text"], textarea {all: unset;}