①各种分割线Html代码

1、<HR>

2、<HR align=center width=300 color=#987cb9 SIZE=1>
align 线条位置（可选left、right、center）；width 线条长度；color 颜色；size 厚度

二、特效（效果并不是孤立的，可相互组合）
1、两头渐变透明：
<HR style="FILTER: alpha(opacity=100,finishopacity=0,style=3)" width="80%" color=#987cb9 SIZE=3>

2、纺锤形：
<HR style="FILTER: alpha(opacity=100,finishopacity=0,style=2)" width="80%" color=#987cb9 SIZE=10>

3、右边渐变透明：
<HR style="FILTER: alpha(opacity=100,finishopacity=0,style=1)" width="80%" color=#987cb9 SIZE=3>

4、左边渐变透明：
<HR style="FILTER: alpha(opacity=0,finishopacity=100,style=1)" width="80%" color=#987cb9 SIZE=3>

5、虚线：
<HR style="border:1 dashed #987cb9" width="80%" color=#987cb9 SIZE=1>

6、双线：
<HR style="border:3 double #987cb9" width="80%" color=#987cb9 SIZE=3>

7、立体效果：
<HR style="FILTER: progid:DXImageTransform.Microsoft.Shadow(color:#987cb9,direction:145,strength:15)" width="80%" color=#987cb9 SIZE=1>

8、钢针效果：
<HR style="FILTER: progid:DXImageTransform.Microsoft.Glow(color=#987cb9,strength=10)" width="80%" color=#987cb9 SIZE=1>

９．垂直分割线

<table border="1px" cellpadding="0" cellspacing="0" style="height:265px;border-left-style:solid; border-bottom-style:none;border-right-style:none;border-top-style:none">

②控制文字显示：

$str=trim($design_str); // 取得字串同时去掉头尾空格和空回车

 //$str=str_replace("<br>","",$str); // 去掉<br>标签

 $str="<p>".trim($str); // 在文本头加入<p>

 $str=str_replace("\r\n","</p>\n<p>",$str); // 用p标签取代换行符

 $str.="</p>\n"; // 文本尾加入</p>

 $str=str_replace("<p></p>","",$str); // 去除空段落

 $str=str_replace("\n","",$str); // 去掉空行并连成一行

 $str=str_replace("</p>","</p>\n",$str); //整理html代码
HTML4/HTML5 用 CSS 修改 <hr> 线条样式
#
线型
EN 名称
HTML4
HTML5
说明
备注
01 实线 solid hr{border:0;border-top:1px solid #eee} hr{border:0;border-top:1px solid #eee} 1 像素实线顶边框，颜色#eee  
02 虚线 dashed hr{border:0;border-top:1px dashed #eee} hr{border:0;border-top:1px dashed #eee} 1 像素虚线顶边框，颜色#eee  
03 点线 dotted hr{border:0;border-top:1px dotted #eee} hr{border:0;border-top:1px dotted #eee} 1 像素点线顶边框，颜色#eee  
04 双实线 double hr{border:0;border-top:1px double #eee} hr{border:0;border-top:1px double #eee} 1 像素单实线顶边框，颜色#eee 1 像素两实线完全重合
hr{border:0;border-top:2px double #eee} hr{border:0;border-top:2px double #eee} 2 像素单实线顶边框，颜色#eee 1 像素两实线并排
hr{border:0;border-top:3px double #eee} hr{border:0;border-top:3px double #eee} 1 像素双实线顶边框，颜色#eee 1 像素两实线并排，间隔 1 像素
hr{border:0;border-top:4px double #eee} hr{border:0;border-top:4px double #eee} 1 像素双实线顶边框，颜色#eee 1 像素两实线并排，间隔 2 像素
hr{border:0;border-top:5px double #eee} hr{border:0;border-top:5px double #eee} 2 像素双实线顶边框，颜色#eee 2 像素两实线并排，间隔 1 像素
hr{border:0;border-top:6px double #eee} hr{border:0;border-top:6px double #eee} 2 像素双实线顶边框，颜色#eee 2 像素两实线并排，间隔 2 像素

HTML
是目前网络上应用最为广泛的语言，也是构成网页文档的主要语言。HTML 文件是由 HTML 语言命令组成的描述性文本，HTML
命令可说明文字、图形、动画、声音、表格、链接等。HTML
文件的结构包括头部（Head）、主体（Body）两大部分，其中头部描述浏览器所需的信息，而主体则包含所要说明的具体内容。

一个网页可对应多个 HTML 文件，HTML 文件以 .htm 或
.html 为扩展名。可使用任何能生成 TXT 类型源文件的文本编辑器产生 HTML 文件，只要修改文件后缀即可。开始标记 <html>
表示文件开头，结尾标记 </html> 表示文件结束。

HTML4/HTML5 用 style 属性修改 <hr>
线条样式
#
线型
EN 名称
HTML4
HTML5
说明
备注
01 实线 solid <hr style="border:0; border-top:1px solid #222;"> <hr style="border:0; border-top:1px solid #222;"> 1 像素实线顶边框，颜色#222  
02 虚线 dashed <hr style="border:0; border-top:1px dashed #222;"> <hr style="border:0; border-top:1px dashed #222;"> 1 像素虚线顶边框，颜色#222  
03 点线 dotted <hr style="border:0; border-top:1px dotted #222;"> <hr style="border:0; border-top:1px dotted #222;"> 1 像素点线顶边框，颜色#222  
04 双实线 double <hr style="border:0; border-top:1px double #222;"> <hr style="border:0; border-top:1px double #222;"> 1 像素单实线顶边框，颜色#222 1 像素两实线完全重合
<hr style="border:0; border-top:2px double #222;"> <hr style="border:0; border-top:2px double #222;"> 2 像素单实线顶边框，颜色#222 1 像素两实线并排
<hr style="border:0; border-top:3px double #222;"> <hr style="border:0; border-top:3px double #222;"> 1 像素双实线顶边框，颜色#222 1 像素两实线并排，间隔 1 像素
<hr style="border:0; border-top:4px double #222;"> <hr style="border:0; border-top:4px double #222;"> 1 像素双实线顶边框，颜色#222 1 像素两实线并排，间隔 2 像素
<hr style="border:0; border-top:5px double #222;"> <hr style="border:0; border-top:5px double #222;"> 2 像素双实线顶边框，颜色#222 2 像素两实线并排，间隔 1 像素
<hr style="border:0; border-top:6px double #222;"> <hr style="border:0; border-top:6px double #222;"> 2 像素双实线顶边框，颜色#222 2 像素两实线并排，间隔 2 像素

2016/04/13 ①html 中各种分割线------------------------------------------ ② 控制文字显示的更多相关文章

  1. CSS控制文字显示一行，超出显示省略号

    这几天在项目需求里面遇到了很多之前没做过的需求,也慢慢更加认识到了css的强大,是真的强大.以后会把自己技术调研的东西都写出来,哪怕只是一点点或者很小的点,重在学习. “CSS控制文字显示一行,超出显 ...

  2. “耐撕”2016.04.13站立会议

    1. 时间 : 19:40--20:00  共计20分钟 2. 人员 : Z   郑蕊 * 组长 (博客:http://www.cnblogs.com/zhengrui0452/), P 濮成林(博客 ...

  3. 2016.04.13,英语,《Vocabulary Builder》Unit 13

    cord, from the Latin word for 'heart'. concord, ['kɑːŋkɔːrd] n. 和睦, 公约 con-,'with'. discord, ['dɪskɔ ...

  4. 2016/10/13 oracle中的round()

    语法: ROUND(number,num_digits) 其中Number是需要进行四舍五入的数字:Num_digits为指定的位数,按此位数进行四舍五入,如果 num_digits 大于 0,则四舍 ...

  5. 在JSP中使用formatNumber控制要显示的小数位数

    先引入标签库 <%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt" %> 比 ...

  6. 使用css控制文字显示几行并且剩余部分隐藏（移动端和PC端同样适用）

    前言 有些需求需要我们控制一段文本最多显示几行,就像逛淘宝京东的评价楼层一样,有时可能还需要隐藏剩余部分,这样的需求我们怎么来解决呢? 解决办法 我们完全可以使用css来解决这一需求 1. 解决文本显 ...

  7. css控制文字显示长度，超过用省略号替代

    .line_text { width:200px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; } <span cl ...

  8. css 控制文字显示两行,多余用省略号 手机端

    p { width:100px; position:relative; line-height:20px; /*行高为高度的一半,这样就是两行*/ height:40px; overflow:hidd ...

  9. H3C汇聚层交换机认证在线人数展示系统之CheckList和燃尽图（16/04/06-16/04/13）

    一.CheckList(核查表) 序号 事件 计划完成时间 实际完成时间 未延迟 未完成 完成 1 登录口令加密以及解密 16/04/06   16/04/06 Y     2 表的创建和IP以及口令 ...

随机推荐

  1. float 和 clear

    float 特性1:可以为行内浮动元素设置宽高 <!DOCTYPE html> <html> <head> <meta charset="UTF-8 ...

  2. Python数据可视化库-Matplotlib（二）

    我们接着上次的继续讲解,先讲一个概念,叫子图的概念. 我们先看一下这段代码 import matplotlib.pyplot as plt fig = plt.figure() ax1 = fig.a ...

  3. python-爬虫学习（文字、图片、视频）

    爬虫-文字爬取 import re import requests respone = requests.get('https://ishuo.cn/') ##获取网站url data = respo ...

  4. 剑指Offer（书）：打印从1到最大的n位数

    题目:输入数字N,按顺序打印出从1到最大的N位十进制数,比如输入3,则打印出1.2.3一直到999 分析:N的范围不定.所以有可能超出范围,因此用数组存放以及输出.说实话,对复杂递归还是一头雾水 pu ...

  5. 剑指Offer（书）：数组中重复的数字

    题目:找出数组中重复的数字. 说明:在一个长度为n的数组里的所有数字都在0~n-1的范围内,数组中某些数字是重复的,但是不知道有几个数字重复了,也不知道每个数字重复了几次.请找出数组中任意一个重复的数 ...

  6. python直接赋值、深浅拷贝实例剖析

    根据数据类型分为两部分进行剖析: int.str类型      list.tuple.dict类型等 1.  int.str类型 [int类型实例] >>> import copy ...

  7. 解决Genymotion运行Android 5.0一直卡在开机界面

    在一些机器,启动genymotion 的android5.0版模拟器时,会卡在启动界面,一直启动不了. 这是因为要求的开启虚拟选项没有打开,在第一次启动时,会有提示,但可能大家没有注意(我也没注意到, ...

  8. linux rdesktop远程Win7老是提示密码错误问题解决

    最近使用rdesktop远程Win7老是提示密码错误,输了N次,无比确认密码是正确的. 在Win7系统本身登录也是正常的. 但rdesktop远程就是报密码错误. 开始怀疑更新了最新版本问题,但是使用 ...

  9. 【HDOJ6312】Game（博弈）

    题意: 有一个1到n的序列,两个人轮流取数,取走一个数同时会取走它所有的因子,不能取者为输,两个人都按最优策略取数,问先手是否必胜 思路: #include<cstdio> #includ ...

  10. java多线程调试

    1. 多线程调试 https://blog.csdn.net/bramzhu/article/details/52367052 https://www.jb51.net/article/129632. ...