一说到0.5px的边框，我们一般认为是不行的，因为在ps中0.5px的线也是做不出来的，这个计算机的像素有关系。

废话不多说了，0.5px 其实用的是css3新特性，box-shadow：阴影设置

代码

<!DOCTYPE html>

<html>

<head>

    <meta charset="utf-8">

    <title></title>

</head>

<body>

<div style="margin-top: 10px;border:1px solid #f00;width: 100px; height: 20px;">1px 红色的边框</div>

<div style="margin-top: 10px;width: 100px;height: 20px;box-shadow:0.5px 0.5px #f00 ,0.5px 0.5px #f00 inset">

0.5px 红色的边框

</div>

</body>

</html>

css3写出0.5px的边框的更多相关文章

  1. css写出0.5px边框（一）

    在移动端会出现线条太粗的现象,简单来说,是因为手机端的像素单位和ui的图比例是2:1,所以ui图的1px边框对我们来说就是0.5px,但是浏览器渲染的最小单位就是1px,下面给几种方法用css写出0. ...

  2. CSS3实现0.5px的边框

    前端页面细节处理好了才会显得精致.边框在网页中是常见的一种样式了.虽然不把它处理为0.5px看上去没毛病,但是想让你做的东西征服更多的人,这些细节处理是必须的. 今天主要说一下如何让边框显示0.5px ...

  3. CSS 0.5px 细线边框的原理和实现方式

    细线边框的具体实现方法有:伪元素缩放或渐变,box-shadow模拟,svg画线,border-image裁剪等.要实现小于1px的线条,有个先决条件:屏幕的分辨率要足够高,设备像素比要大于1,即cs ...

  4. css3写出飘雪花特效

    大冬天的,飘雪花的特效,你可能要用上了吧.通常情况下用jQuery写飘雪花的特效,但用css3写,其实特别简单,新手一看就懂,那就告别jQuery,用css3轻松搞定飘雪花特效吧! 点击查看特效演示 ...

  5. 0.5px的边框

    <!doctype html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  6. css给div添加0.5px的边框

    具体代码实现如下: <!DOCTYPE html> <html lang="en"> <head> <meta charset=" ...

  7. css3 使用SVG做0.5px 的边框细线

    .HalfPixelLine{ background: repeat-x top left url("data:image/svg+xml;utf8,<svg xmlns='http: ...

  8. 用css3写出的倒三角形

    <!DOCTYPE html><html><head><meta charset="gb2312" /><title>无 ...

  9. css3 做border = 0.5px的细线

    参考: https://blog.csdn.net/Tyro_java/article/details/52013531

随机推荐

  1. 【转】Fiddler 教程

    原文转自:http://www.cnblogs.com/tankxiao/archive/2012/02/06/2337728.html Fiddler是最强大最好用的Web调试工具之一,它能记录所有 ...

  2. CSS 实现：元素相对于文档水平垂直居中

    [要求]:如何用 CSS 实现水平/垂直居中一个元素(相对于文档) <body> <div class="content"></div> < ...

  3. Tomcat9源码编译及导入Eclipse(转)

    1.下载tomcat源码.建议下载最新版本tomcat9. svn地址:http://svn.apache.org/repos/asf/tomcat/tc9.0.x/branches/gsoc-jas ...

  4. activiti 任务授权，把流程中当前任务授权个其他用户代为办理

    / * 授权代办 * @param serDoc / @Transactional(readOnly = false) public void authAgent(SerDoc serDoc) { S ...

  5. PHP设置图片文件上传大小的具体实现方法

    PHP默认的上传限定是最大2M,想上传超过此设定的文件,需要调整PHP.apache等的一些参数 我们简要介绍一下PHP文件上传涉及到的一些参数: •file_uploads :是否允许通过HTTP上 ...

  6. Mac下的利器们介绍

    先说说一些快捷键吧,从windows下过来还不很习惯: ctrl + 开关 关机等提示 ctrl+shift+开关 关闭显示器 cmd+option+v 相当于剪贴 cmd+tab,对于最小化了的窗口 ...

  7. poj1502 最短路

    题意:有n个处理器,给出n*n的邻接矩阵的一半,表示相互之间传输信息的花费(另一半与给出的一半对称,即双向都可传输),x表示不能传输,问从第一个处理器传输到所有处理器的最小花费总和是多少. 就是跑一遍 ...

  8. Sublime Text3快捷方式与使用技巧

    Sublime Text 3 快捷键精华版 Ctrl+Shift+P:  打开命令面板Ctrl+P:  搜索项目中的文件Ctrl+G: 跳转到第几行Ctrl+W: 关闭当前打开文件Ctrl+Shift ...

  9. 黑马程序员——JAVA基础之set集合

    ------- android培训.java培训.期待与您交流! ---------- Set:       元素是无序(存入和取出的顺序不一定一致),元素不可以重复.    Set接口中常用的类: ...

  10. 查找目录下的所有文件中是否含有某个字符串 linux

    查找目录下的所有文件中是否含有某个字符串 find .|xargs grep -ri "IBM" 查找目录下的所有文件中是否含有某个字符串,并且只打印出文件名 find .|xar ...