一说到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. JS回车键处理

    HTML <input type="text" id="keyword" name="keyword" autocomplete=&q ...

  2. 【Bear】api分类

    参考 jQuery API 中文文档

  3. 转载blog_Linux下Tomcat日志定期清理 及 logrotate 配置

    服务器上的tomcat的catalina.out文件越来越大,查看起来很不方便,以前每次都是想起来的时候手工清理一下(cat /dev/null > catalina.out),后来发现了log ...

  4. <转>windows下安装redis

    1.redis简介redis是一个key-value存储系统.和Memcached类似,它支持存储的value类型相对更多,包括string(字符串).list(链表).set(集合).zset(so ...

  5. 了解 C++ 默默编写并调用的函数

    前言 对于一个类来说,最最基础的三类成员函数莫过于:构造函数,析构函数以及拷贝函数 (copy构造函数和=重载函数).即使你的类没有为这些函数做出定义,C++ 也会自动为你创建.本文将讲述的是 C++ ...

  6. SAP 审计

    SAP 权限审计:SA38--- RSUSR002 还有其它事务码待续,,,

  7. AspxGridView

    转:出处 http://i.cnblogs.com/EditPosts.aspx?opt=1 AspxGridView点滴 1:页码设置 <SettingsPager>         & ...

  8. JavaWeb学习记录（八）——servlet获取配置信息

    jdbc.properties内容如下: jdbcUrl=jdbc\:mysql\://localhost\:3306/animaluser=rootpass=root servlet获取资源信息代码 ...

  9. timus 1022 Genealogical Tree(拓扑排序)

    Genealogical Tree Time limit: 1.0 secondMemory limit: 64 MB Background The system of Martians’ blood ...

  10. Java—面向对象—权限修饰符及思维导图

    课上老师所讲实例整理: package org.hanqi.pn0120; //汽车 public class Car { //颜色 private String yanse; //品牌 privat ...