如何使Bootstrap只读输入字段看起来像普通文本？ [英] How to make Bootstrap readonly input field look like normal text?

问题描述

我的html页面中有一个如下字段：

I have a field in my html page like this:

<input type="text" class="form-control" readonly>

我希望它看起来像< p> 标记。请帮我CSS向导。

I would like it to look like normal text between <p> tags. Please help me CSS wizards.

推荐答案

您可以尝试

CSS

input[readonly]{
  background-color:transparent;
  border: 0;
  font-size: 1em;
}

如果您想与一堂课一起使用，可以尝试这个

if you want to use with a class you can try this one

HTML

<input type="text" class="form-control classname" value="Demo" readonly />

CSS

input[readonly].classname{
  background-color:transparent;
  border: 0;
  font-size: 1em;
}

如果您想使< input> 看起来像内联文本（调整输入元素的大小），请检查此小提琴 https：// jsfiddle .net / Tanbi / xyL6fphm / ，请不要忘记调用jquery js库

if you want to make the <input> look like inline text (resizing the input element) please check this fiddle https://jsfiddle.net/Tanbi/xyL6fphm/ and please dont forget calling jquery js library

这篇关于如何使Bootstrap只读输入字段看起来像普通文本？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！