html中一些莫名的空格
我们日常用编辑器编辑代码的时候,为了让代码的可读性更高,通常会有换行,空格或者tab键(bootstrap的规则中非常不建议这样做,不过为了方便,我还是比较习惯这样来缩进)的操作。
而这些也就造成了一些html中莫名其妙的一些空格与空行,总结一下最近遇到的一些,以后遇到其他的也会添加进来,供大家参考,有理解错误的欢迎大家不吝指正。
1.textarea中的空格及空行
textarea为html中常见的双标签,textarea中的内容可以在初始化的时候直接写在<textarea>和</textarea>之间,
接一句题外话,虽然如此,但是textarea的值如果要赋值的话不能直接用text(),要用val().
对于双标签,我习惯于写成如下这种格式:
<textarea>
</textarea>
如此,问题就来了,结果会发现,生成的textarea文本框里面莫名多出来了好多的空格
查阅资料后,将textarea标签改为以下格式,则生成的textarea正常,无空格现象
<textarea></textarea>
2.两个div之间有间隙
如下图所示,两个div中间有一条明显的空隙,既不是margin也不是padding,让人非常费解。(此问题我在去一家知名企业笔试中也遇到过,可见大企业通常都是很注重细节滴)
根据上面一个解决方案的启发,将页面结构写成如下格式:
<div class="item1">item1</div><div class="item2">item2</div>
则顺利解决空隙问题。
此问题在两个块级元素并排放的时候同样会出现。
思考:我们平时在jsp和html中都是将页面的元素按照一定的格式编排的,基本不会有专业人士将两个div并排写在一起,
笔者刚开始猜想出现以上这种情况会不会跟代码直接写在html有关,经在jsp和js中验证得知,都会出现这种现象,
笔者现在工作项目中应用的是bootstrap框架,项目中所有的dom元素都为浮动元素,所以并无以上问题,
而我们平时写代码,估计也很少有人把所有的相邻元素都加上背景颜色,因此这个问题并不是很好发现,
总之,先说到这里,以后有其他相关发现笔者会继续更新,谢谢大家阅读。
html中一些莫名的空格的更多相关文章
- Html中代码换行造成空格间距的问题
Html中代码换行造成空格间距的问题解析 解决方法: 一.简单粗爆不换行 写代码的时候不要换行,input等在一行输写,那么将解决该问题.但是代码就变得不再那么容易好看. 二.设置父级块的字体大小为0 ...
- 关于一些url中传递参数有空格问题
1.关于一些url中传递参数有空格问题: url.replace(/ /g, "%20") 从上面的例子中可以看到可以用:replace(/ /g, "%20" ...
- c# 字符串中多个连续空格转为一个空格
#region 字符串中多个连续空格转为一个空格 /// <summary> /// 字符串中多个连续空格转为一个空格 /// </summary> /// <param ...
- HTML中的几种空格
HTML提供了5种空格实体(space entity),它们拥有不同的宽度,非断行空格( )是常规空格的宽度,可运行于所有主流浏览器.其他几种空格( )在不同浏览器中宽度各异. ...
- Python中常见字符串去除空格的方法总结
Python中常见字符串去除空格的方法总结 1:strip()方法,去除字符串开头或者结尾的空格>>> a = " a b c ">>> a.s ...
- 在HTML代码中要如何插入空格?
超文本标记语言(HTML)会自动忽略空格.平常在编写代码的时候,用空格键.Tab键以及回车键产生的空格,都会被HTML自动忽略.那么我们该用什么方法来实现HTML的空格效果呢?有专门的空格代码吗?不少 ...
- quartusii开发过程中路径不能出现空格或中文
quartusii开发过程中路径不能出现空格或中文,否则软件出现.stf文件错误提示,开发环境搭建的时候也不能出现空格和中文,否则也会报错.
- PHP 去掉文文文件中的回车与空格
文本文件fff.txt中去除回车与空格: $aa = file_get_contents('./fff.txt'); $bb = str_replace(array("\r\n", ...
- 请实现一个函数,把字符串中的每一个空格替换成“%20”,比如输入 “We are Happly。” 则输出“we%20are%20happy。”
请实现一个函数,把字符串中的每一个空格替换成"%20",比如输入 "We are Happly." 则输出"we%20are%20happy. &q ...
随机推荐
- Oracle 11g R2 for Win7旗舰版(64位)- 安装
1.下载Oracle 11g R2 for Windows的版本 下载地址:http://www.oracle.com/techne ...
- Internet History, Technology and Security (Week4)
Week4. We are now moving into Week 4! This week, we will be covering commercialization and growth. T ...
- angularJS1笔记-(20)-模块化加载机制seajs
SeaJS是一个遵循CMD规范的JavaScript模块加载框架,可以实现JavaScript的模块化开发及加载机制. 与jQuery等JavaScript框架不同,SeaJS不会扩展封装语言特性,而 ...
- jsp 页面和 jsp标记
一个jsp页面可由5种元素组成 html标记 变量和方法的声明 java程序片 java表达式 <%!变量和方法的声明%> 被声明的方法和变量在整个jsp页面都可以访问,为全局变量 当多个 ...
- 蜗牛慢慢爬 LeetCode 7. Reverse Integer [Difficulty: Easy]
题目 Reverse digits of an integer. Example1: x = 123, return 321 Example2: x = -123, return -321 Have ...
- 课堂alpha发布
项目组名:奋斗吧兄弟 今天七组对于各自项目现有的成果进行了alpha发布,下面是我的一些感想. 天天向上团队的连连看游戏: 令我印象最深的是天天向上团队的连连看项目,他们目前能展示给我们的是核心的连连 ...
- ajax 数据请求(一)同域
参考:http://www.css88.com/jqapi-1.9/jQuery.ajax/ http://www.cnblogs.com/haitao-fan/p/3908973.html 1.常用 ...
- [Cnbeta]BAT财报对比
https://www.cnbeta.com/articles/tech/789123.htm 随着腾讯上周公布财报,BAT三家2018年第三季度的数据均已公布,曾经与腾讯.阿里齐名的百度正被拉开越来 ...
- poj 2299 Ultra-QuickSort(树状数组求逆序数)
链接:http://poj.org/problem?id=2299 题意:给出n个数,求将这n个数从小到大排序,求使用快排的需要交换的次数. 分析:由快排的性质很容易发现,只需要求每个数的逆序数累加起 ...
- L2 L3 L4
第二层交换机,是根据第二层数据链路层的MAC地址和通过站表选择路由来完成端到端的数据交换的.因为站表的建立与维护是由交换机自动完成,而路由器又是属于第三层设备,其寻址过程是根据IP地址寻址和通过路由表 ...