address下拉行数不变

html-css06

address下拉行数不变,第1张

你可以使用CSS来控制下拉菜单中行数不变。首先,在你的样式表中增加一行代码“#select-box-id{ size:n;}”,其中n表示下拉菜单中的行数。接下来,你可以使用JavaScript或jQuery来控制这个行数,例如:“$('#select-box-id').attr('size', n)”

楼主你好!一般textarea 5行写法就是上面写的那个默认状态下:<textarea cols=5></textarea>

但楼主说要用css实现,其实也可以,方法代码如下:

<style type="text/css">

.areaclass{width:200pxheight:75pxline-height:15px}

</style>

<textarea class="areaclass">

内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容

</textarea>

如果内容超过了五行的话,就会显示下拉滚动条!

html参考代码,加注释的部分就是实现多行文本省略的必要属性。

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Document</title>

</head>

<style>

    .comment_inner{

    width: 200px

    word-break: break-all

    text-overflow: ellipsis

    display: -webkit-box /** 将对象作为伸缩盒子模型显示 **/

    -webkit-box-orient: vertical /** 设置或检索伸缩盒对象的子元素的排列方式 **/

    -webkit-line-clamp: 3 /** 显示的行数 **/

    overflow: hidden  /** 隐藏超出的内容 **/

    }   

</style>

<body>

    

     

<div>

   <p class="comment_inner">

word-break 属性规定自动换行的处理方法。normal(使用浏览器默认的换行规则。),break-all(允许在单词内换行。),keep-all(只能在半角空格或连字符处换行。)

   </p>

</div> 

    

</body>

</html>