【伪Textatea的构建（div+table），以及相应的滚动条问题与safari上的优化】的更多相关文章

伪Textatea的构建（div+table），以及相应的滚动条问题与safari上的优化

在页面中创建一个不可编辑的文本块,并且文本块的篇幅较大,第一反应是创建一个textarea,并将它的disabled="disabled",并设置相应的scroll属性,就可以构建一个尚可的文本块. 但这样的文本块存在许多的问题,最为严重的是textarea内部只允许纯文本,并不能识别html标签(较新的ie浏览器可识别标签,但包括chrome在内的主流浏览器不能识别),所以,一些特定的格式无法很好表达.并且,在一些版本的ie浏览器上,当设置disabled="disable…

功能整合（一）：滚动条的变相隐藏、js控制div的渐变显示、滚动条监听

1.滚动条的变相隐藏 思路: 1.  把body的横向,纵向的超出部分隐藏,宽设置100%:高设置100%.就没有body的滚动条了, 2.  然后把最外层的div的宽设置的比body的宽宽一点,把div的滚动条挤出去,并把div的横向超出部分隐藏掉,就可以实现没有滚动条也可以滚动的效果 <html> <style> *{ //边距清零 margin: 0; padding: 0; } //隐藏body的滚动条(会没有滚动效果) .scroll{ overflow-x: hidde…

table设置表格有滚动条

table 设置表格有滚动条. 少说多做,代码中有注释: <!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>设置表格有滚动条</title> <style> * { margin: 0; padding: 0; } table…

div里面的元素在【垂直 方向】上水平分布 使用calc()函数动态计算

1==>如何让div里面的元素在[垂直 方向]上水平分布.important-dec{ height: 121px; //必须固定高度 flex-direction: column; //垂直排列 display: flex; justify-content: space-between;} 2==>使用 calc() 函数计算 <div> 元素的宽度:需要注意的是,运算符前后都需要保留一个空格,例如:width: calc(100% - 10px):任何长度值都可以使用calc(…

css+div table

div+css table表格样式 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-eq…

用伪类实现一个div的宽度和高度是固定百分比

遇到一个题目:一个div宽度是固定百分比的情况下,如何设置高度是宽度的80% 看到题目的第一反应是用js控制,获取到div的宽度之后再用宽度的80%来设置div的高度,但是如何在不用js的情况下,只用CSS来实现呢 下面是示例代码: HTML代码: <div class="outer"></div> CSS代码: .outer{ width: 30%; background: #eee; } .outer:after{ content: ''; display:…

以KeyValue形式构建Lua Table

Key为字符串 -- 定义一个key,value形式的table local kv = {fruit = "apple", bread = "french", drink = "milk"} --通过key从table中取值 print(kv["fruit"]) -- Also works print(kv.bread) for index, value in pairs(kv) do print("index:&q…

如何使用css伪类，实现div左上角出现封面等提示信息

 HTML <div class="ui-cover-tip”><div> CSS .ui-cover-tip{ position: relative; width: 200px; height: 200px; border: solid 1px red; } .ui-cover-tip:before{ content:''; position: absolute; display:block; width: 0; height: 0; border-top: 45px…

DIV内容超出长度显示省略号，鼠标移上自动显示全部内容（EasyUI DataGrid）

如果想把DIV中超出的文本显示成省略号,而不是换行全部显示,有2个办法. 注:本文主要是以EasyUI的DataGrid为案例的,如果是其他场景只要底层是用DIV显示文本的应该都能使用. 首先可以给此DIV指定3个关键样式{overflow: hidden;white-space: nowrap;text-overflow: ellipsis;} 指定样式后,文本超长已经会显示省略号了.如果想鼠标移上去显示全文的话,有2个办法: 一个是把全部文本写在div的title属性里面,还有一个办法是在原…

DIV实现水平或垂直滚动条

添加样式: 在html中,需要创建2层div来实现.一个div包含另一个div: 效果:…