详解CSS定义HR水平线的几种样式


  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
  2. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> 
  3. <head> 
  4.  <title>CSS定义HR水平线</title> 
  5.  <style type="text/css"> 
  6.  <!-- 
  7. .hr0{ height:1px;border:none;border-top:1px dashed #0066CC;} 
  8. .hr1{ height:1px;border:none;border-top:1px solid #555555;} 
  9. .hr2{ height:3px;border:none;border-top:3px double red;} 
  10. .hr3{ height:5px;border:none;border-top:5px ridge green;} 
  11. .hr4{ height:10px;border:none;border-top:10px groove skyblue;} 
  12.  --> 
  13.  </style> 
  14. </head> 
  15. <body> 
  16. <hr class="hr0" /> 
  17. <hr class="hr1" /> 
  18. <hr class="hr2" /> 
  19. <hr class="hr3" /> 
  20. <hr class="hr4" /> 
  21. </body> 
  22. </html> 

以上是小编为您精心准备的的内容,在的博客、问答、公众号、人物、课程等栏目也有的相关内容,欢迎继续使用右上角搜索按钮进行搜索css
样式
css水平线样式、hr 水平线样式、css样式定位详解、css hr样式、css设置hr样式,以便于您获取更多的相关知识。

时间: 2024-10-04 14:54:00

详解CSS定义HR水平线的几种样式的相关文章

详解CSS选择器、优先级与匹配原理

作为一个Web开发者,掌握必要的前台技术也是很重要的,特别是在遇到一些实际问题的时候.这里给大家列举一个例子: 给一个p标签增加一个类(class),可是执行后该class中的有些属性并没有起作用.通过Firebug查看,发现没有起作用的属性被覆盖了.这个时候突然意识到了CSS选择器的优先级问题,这里就CSS选择器的优先级问题做了一些总结. 51CTO推荐阅读:巧妙地使用CSS选择器 选择器种类 严格来讲,选择器的种类可以分为三种:标签名选择器.类选择器和ID选择器.而所谓的后代选择器和群组选择

精彩实例详解CSS滤镜教程

css|教程|滤镜|详解 使您由浅入深了解CSS滤镜的使用,是一个不错的教程!希望对您学习CSS有用! 1.实例详解CSS滤镜(1)概述 (2005-05-04) 2.实例详解CSS滤镜(2)Mask属性 (2005-05-04) 3.实例详解CSS滤镜(3)Blur属性 (2005-05-04) 4.实例详解CSS滤镜(4)Chroma属性 (2005-05-04) 5.实例详解CSS滤镜(5)DropShadow属性 (2005-05-04) 6.实例详解CSS滤镜(6)Glow属性 (20

详解CSS布局设计块元素和内联元素

css|设计|详解 块元素(block element)一般是其他元素的容器元素,块元素一般都从新行开始,它可以容纳内联元素和其他块元素,常见块元素是段落标签'P."form"这个块元素比较特殊,它只能用来容纳其他块元素. 如果没有css的作用,块元素会顺序以每次另起一行的方式一直往下排.而有了css以后,我们可以改变这种html的默认布局模式,把块元素摆放到你想要的位置上去.而不是每次都愚蠢的另起一行.需要指出的是,table标签也是块元素的一种,table based layout

实例详解CSS滤镜(5)DropShadow属性

ado|css|滤镜|详解 DropShadow属性是为了添加对象的阴影效果的.它实现的效果看上去就像使原来的对象离开页面,然后在页面上显示出该对象的投影.看一看它的表达式: Filter:DropShadow(Color=color,Offx=Offx,Offy=offy, Positive=positive) 该属性一共有四个参数: Color代表投射阴影的颜色. Offx和offy分别X方向和Y方向阴影的偏移量.偏移量必须用整数值来设置.如果设置为正整数,代表X轴的右方向和Y轴的向下方向.

实例详解CSS滤镜(4)Chroma属性

css|滤镜|详解 Chroma属性可以设置一个对象中指定的颜色为透明色,它的表达式如下: Filter:Chroma(color=color) 这个属性的表达式是不是很简单,它只有一个参数.只需把您想要指定透明的颜色用Color参数设置出来就可以了.比如下面这幅图: 图中显示两种字体,两种颜色,我们现在对"leaves"字体添加chroma属性,使其透明.代码如下: <html> <head> <title>chroma filter</ti

实例详解CSS滤镜(3)Blur属性

css|滤镜|详解 假如您用手在一幅还没干透的油画上迅速划过,画面就会变得模糊.CSS下的blur属性就会达到这种模糊的效果. 先来看一下blur属性的表达式: filter:blur(add=add,direction,strength=strength) 我们看到blur属性有三个参数:add.direction.strength. Add参数有两个参数值:true和false.意思是指定图片是否被改变成模糊效果. Direction参数用来设置模糊的方向.模糊效果是按照顺时针方向进行的.其

实例详解CSS滤镜(2)Mask属性

css|滤镜|详解 Mask属性为对象建立一个覆盖于表面的膜.它的表达式也很简单: Filter:Mask(Color=颜色) 只有一个Color参数,用来指定使用什么颜色作为掩膜. 同样,我们来看一下一幅图片在加上mask属性前后的效果(见下图): 加上MASK属性的效果就好象是在用有色眼镜看物体一样.上面的效果的代码如下: <html> <head> <title> mask filter </title> <style>//*设置CSS样式

实例详解CSS滤镜(1)概述

css|滤镜|详解 CSS的滤镜属性的标识符是filter.为了使您对它有个整体的印象,我们先来看一下它的书写格式: filter:filtername(parameters) 怎么样?是不是很简单,看上去与前面讲的属性定义没什么太大的差别.Filter是滤镜属性选择符. 也就是说,只要您进行滤镜操作,就必须先定义filter:filtername是滤镜属性名,这里包括alpha.blur.chroma等等多种属性,详细内容请看下表:   上面filter表达式中括号内的parameters是表

详解CSS的定位语法应用

css|详解|语法 一.CSS定位:position 语法: position : static | absolute | fixed | relative  取值: static  : 默认值.无特殊定位,对象遵循HTML定位规则  absolute  : 将对象从文档流中拖出,使用 left , right , top , bottom 等属性相对于其最接近的一个最有定位设置的父对象进行绝对定位.如果不存在这样的父对象,则依据 body 对象.而其层叠通过 z-index 属性定义  f