[html代码] 几种美丽的分割线

女爷i 2022-07-21 12:21 206阅读 0赞

一、普通

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">

源引：http://www.yulv.net/archives/477

发表评论取消回复

表情：

评论列表（有 0 条评论，206人围观）

还没有评论，来说两句吧...

相关阅读

相关 HTML 几种特别分割线特效

![003dcd7a238bef77f68a744e18231f0d.jpeg][] HTML分割线特效，挺实用与漂亮的分隔线，需要的朋友可以参考下。一、基本线条 --

r囧r小猫/ 2024年03月31日 14:58/ 0 赞/ 33 阅读

相关 HTML文档插入JS代码的几种方法

在HTML文档里嵌入客户端JavaScript代码有4中方法： 1.内联，放置在< script>和标签对之间。 2.放置在由< script>标签的src属性指定的外

「爱情、让人受尽委屈。」/ 2022年09月23日 10:54/ 0 赞/ 225 阅读

相关 [Html]Jekyll 代码高亮的几种选择

序新年第一炮，轻松加愉快的，来完成一些年前准备写的文章。Jekyll 中格式化代码有很多种方式，在这里说说几种的实现方式。 Jekyll Jekyll 是一种通

ゝ一纸荒年。/ 2022年08月18日 15:29/ 0 赞/ 156 阅读

相关 [html代码] 几种美丽的分割线

一、普通 1、<HR> -------------------- 2、<HR align=center width=300 color=\987cb9 SIZE=1

女爷i/ 2022年07月21日 12:21/ 0 赞/ 207 阅读

相关在html中嵌入css代码的几种方式

转载自[CSDN博客][CSDN] [CSDN]: https://blog.csdn.net/liusure09/article/details/50194289?loc

约定不等于承诺〃/ 2022年05月16日 08:34/ 0 赞/ 282 阅读

相关在html中嵌入js代码的几种方式

1.最常用：使用script标签的src属性 <script>标签包含src属性，这个属性可以指定包含js代码的文件路径，使用示例如下： 1.首先在工程新建一个java

叁歲伎倆/ 2022年05月16日 07:05/ 0 赞/ 244 阅读

相关大日志分割的几种方法

本文介绍大日志分割的几种方法。当日志容量上G的时候，用vi查看具体内容效率就会变得特别低，这个时候就需要将大日志进行分割。为了比较各种分割方法的效果，我选取的测试日志

谁借莪１个温暖的怀抱￠/ 2022年05月13日 14:10/ 0 赞/ 358 阅读

相关 linux 命令行分割字符串的几种方法

使用xargs echo '11@22@33' | xargs -d '@' -n 1 echo | sed '$d' 使用awk echo '1

小鱼儿/ 2022年05月12日 01:04/ 0 赞/ 367 阅读

相关提升语义分割性能的几种方法

本文主要记录几种提升基于深度学习的图像语义分割精度的方法，以防忘记！ By zhengzibing2011, 2017年10月21日-星期六 1 1.图像语义分割面临的挑

比眉伴天荒/ 2022年02月19日 02:11/ 0 赞/ 480 阅读

相关 HTML中画分割线

使用hr标签实现画一条线 html代码： <html> <body> <p>hr 标签定义水平线：</p> <hr />

Love The Way You Lie/ 2021年09月17日 09:06/ 0 赞/ 796 阅读