用html代码怎样画一条竖直线。1像素，纯黑色的，长500px.
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了用html代码怎样画一条竖直线。1像素，纯黑色的，长500px.相关的知识，希望对你有一定的参考价值。
用一个div设置他的高度，width等于1，用border、background都可以给它设置颜色，它就是一条直线了。
具体实现方法操作如下：
工具原料：编辑器、浏览器；
方法1、可以给一个一定宽度的元素设置一个border-bottom属性，让其只有一个底边框，进而实现一条线的效果，代码如下：
<div id="div1"> </div><style> #div1 margin-top: 100px; width: 900px; border-bottom: 1px solid #000000;
</style>
方法2、使用hr标签实现画一条线，代码如下：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>float</title>
</head>
<div id="div1"></div>
<style>
#div1
width: 500px;
border-bottom: 1px solid red;
</style>
</html> 参考技术A 用dreamweaver来设计，很简单。你问的是高500px吧，还是水平线？如果是竖线，写个div层，加上css参数，width：1px，height：500px
如果是横线，其实一个水平线就能替代。<hr width="500" size="1" /> 参考技术B <div style="border-top:1px solid #000;width:500px;height:1px;"> </div>追问
不对，是横线
追答难不成这是竖线。。。我这里显示就是横线。
追问请看题！！！！！
。。。。。。我错了
那把border-top改成border-left
然后width:1px;height:500px
带轮廓的 CGPath
【中文标题】带轮廓的 CGPath【英文标题】：CGPath with outline 【发布时间】：2013-01-16 21:21:54 【问题描述】：我正在尝试绘制一个 CGPath，它的中风有一个中风。
基本上我想用 CGPath 画一条线。然后我想返回并在最后一个 CGPath 的两侧画线，使其具有轮廓的效果。
这条线可以以任何方式弯曲和转动，但我总是需要外面的两条线跟随。
编辑：我需要能够使线的中间透明但轮廓纯黑色。
【问题讨论】：
参考这个网址***.com/questions/5434874/draw-a-line-by-using-cgpath 【参考方案1】：使用CGPathCreateCopyByStrokingPath 通过以一定宽度抚摸旧路径来创建新路径。然后使用kCGPathFillStroke 绘制新路径。
- (void)drawRect:(CGRect)rect
CGContextRef context = UIGraphicsGetCurrentContext();
CGMutablePathRef path = CGPathCreateMutable();
CGPathMoveToPoint(path, NULL, 50, 50);
CGPathAddLineToPoint(path, NULL, 200, 200);
CGPathRef thickPath = CGPathCreateCopyByStrokingPath(path, NULL, 10, kCGLineCapButt, kCGLineJoinBevel, 0);
CGContextAddPath(context, thickPath);
CGContextSetStrokeColorWithColor(context, [UIColor blackColor].CGColor);
CGContextSetFillColorWithColor(context, [UIColor blueColor].CGColor);
CGContextSetLineWidth(context, 3);
CGContextDrawPath(context, kCGPathFillStroke);
CGPathRelease(thickPath);
CGPathRelease(path);
【讨论】：
如何绘制两个不同的 CGPath 并赋予每个颜色？【参考方案2】：最简单的解决方案就是将路径描边两次。首先使用较大笔画宽度的黑色，然后再次使用具有稍小的笔画宽度的蓝色笔画相同的路径。
编辑：
如果我没记错的话，您可以使用CGPathCreateCopyByStrokingPath(...) 创建一个新路径，然后您可以进行描边和填充。然后你可以使用半透明的颜色。
来自文档：
CGPathCreateCopyByStrokingPath创建另一个路径的描边副本。
CGPathRef CGPathCreateCopyByStrokingPath( CGPathRef path, const CGAffineTransform *transform, CGFloat lineWidth, CGLineCap lineCap, CGLineJoin lineJoin, CGFloat miterLimit );参数路径
要复制的路径。transform
指向仿射变换矩阵的指针，如果不需要变换，则为 NULL。如果指定，Quartz 在将转换路径的元素添加到新路径之前应用转换。lineWidth
要使用的线宽，以用户空间为单位。该值必须大于 0。lineCap
线帽样式常量——kCGLineCapButt（默认）、kCGLineCapRound 或 kCGLineCapSquare。参见“CGLineCap”。lineJoin
线连接值 - kCGLineJoinMiter（默认）、kCGLineJoinRound 或 kCGLineJoinBevel。参见“CGLineJoin”。miterLimit
使用的斜接限制。
【讨论】：
我希望中间颜色是半透明的。在它后面添加一条黑色的大线将使这成为不可能。 我明白你的意思了，谢谢你的帮助。 @David 这个 API 的 swift 3 的替代方案是什么 @VivekSehrawat 快速在线搜索显示它是copy(strokingWithWidth:lineCap:lineJoin:miterLimit:transform:)。
@DavidRönnqvist - 谢谢我知道了以上是关于用html代码怎样画一条竖直线。1像素，纯黑色的，长500px.的主要内容，如果未能解决你的问题，请参考以下文章