CSS定义HR水平线的几种样式，不要小看了HR水平线哦，用好了会给你的网页增色不少，这一段代码分别定义了几种漂亮的HR样式及颜色，供你参考，如果喜欢，直接拷贝代码就用吧。
成都创新互联公司是一家专注网站建设、网络营销策划、成都微信小程序、电子商务建设、网络推广、移动互联开发、研究、服务为一体的技术型公司。公司成立10年以来，已经为超过千家纱窗各业的企业公司提供互联网服务。现在，服务的超过千家客户与我们一路同行，见证我们的成长；未来，我们一起分享成功的喜悦。
1、首先，在电脑中打开编辑器，创建html文档。
2、然后，创建h1标签，用行内样式控制字体颜色为红色。
3、接下来，用内部样式选择器选择h1标签，控制它的样式。
4、外部样式需要，创建外部样式.css文件。
5、然后，在html文件里面引入css文件。
6、最后，在浏览器看是否生效，就可以了。
对于CSS定义水平线标签，常用的有以下几种样式，仅供参考。对于 程序代码height:1px;border:none;的主要用途就是Css Reset，关于Css Reset可以搜索下博客里其他文章介绍。
需要准备的材料分别有：电脑、浏览器、html编辑器。
1、首先，打开html编辑器，新建html文件，例如：index.html。
2、在index.html中的style标签中，输入css代码：div {height:60px;border-bottom:1px dashed}。
3、浏览器运行index.html页面，此时通过css定义了一个水平的虚线。
CSS样式分为：内联式css样式、嵌入式css样式、外部式css样式。
对CSS三种样式定义及其实例：
内联式css样式。
内联式css样式表就是把css代码直接写在现有的HTML标签中，如下面代码：
1 p style="color:red"这里文字是红色。/p
css样式代码要写在style=""双引号中，如果有多条css样式代码设置可以写在一起，中间用分号隔开（英文状态下;）。
嵌入式css样式。
嵌入式css样式，就是可以把css样式代码写在标签之间。如下面代码实现把三个标签中的文字设置为红色：
1 style type="text/css"span{color:red;}/style
嵌入式css样式必须写在之间，并且一般情况下嵌入式css样式写在之间。
外部式css样式。
外部式css样式(也可称为外联式)就是把css代码写一个单独的外部文件中，这个css样式文件以“.css”为扩展名（也可以为调用其他网站CSS）。
1 link href="style.css" rel="stylesheet" type="text/css" /
注意事项： 1、css样式文件名称以有意义的英文字母命名，如 main.css。 2、rel=”stylesheet” type=”text/css” 是固定写法不可修改。 3、标签位置一般写在标签之内。
掌握好三种CSS三种样式使用方法在Web开发中将节省很多时间。
!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" ""
html xmlns="" xml:lang="en" lang="en"
head
titleCSS定义HR水平线/title
style type="text/css"
.hr0{ height:1px;border:none;border-top:1px dashed #0066CC;}
.hr1{ height:1px;border:none;border-top:1px solid #555555;}
.hr2{ height:3px;border:none;border-top:3px double red;}
.hr3{ height:5px;border:none;border-top:5px ridge green;}
.hr4{ height:10px;border:none;border-top:10px groove skyblue;}
/style
/head
body
hr class="hr0" /
hr class="hr1" /
hr class="hr2" /
hr class="hr3" /
hr class="hr4" /
/body
/html
