专栏首页成长道路html 边框变粗 margin -1px

html 边框变粗 margin -1px

最近刚开始学习web前端,html和css,对于遇到的边框变粗的问题,用margin为负值解决问题发表一些自己的理解

首先我们来看看下面一张图片

list-style: none;                 border:1px solid black;                 width: 200px;                 line-height: 2em;                 text-align: center;

你会发现中间的线条特别的粗,这个问题该如何解决呢?

这里就可以用margin -1px(取决你边框的宽度)来解决。加入这行代码的样式,如下图

 下面我们就来分析这就话,对于边框的top,和left向上和向左移动一个而对于right和bottom它们会把紧跟其后的元素拉过来。

其实每个li都向上和向左在原来的基础上移动了1px,对于bottom边框把下方紧随其后的top边框拉过来之后,top边框也要向上移动1px,刚好重合。 还有其他的解决方法,就是重合的边框你可以设置:border-top(bottom或left或right):none;这样的话也可以取消边框。

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • apache griffin本地安装部署

    1.下载到本地github地址:https://github.com/apache/griffin

    用户1171305
  • mako模板+django+分页

    遇到的问题:我看网上html页面大家通过page2.next_page_number和page2.preivous_page_number获取上一页和下一页的页...

    用户1171305
  • hive基本概念

    1.hive是一个基于hadoop之上的一个数据仓库。可以处理的数据是关系型数据 库(结构性)、本地数据、hdfs数据(非结构化的数据); 2.hive是对...

    用户1171305
  • 【基础】CSS实现多重边框的5种方式

    目前最优雅地实现多重边框的方案是利用CSS3 的 box-shadow属性,但如果要兼容老的浏览器,则需要选择其它的方案。本文简要地列举了几种多重边框的实现方案...

    毛瑞
  • 自动驾驶中单目摄像头检测输出3-D边界框的方法概述

    本文是来自黄浴博士的知乎专栏,主要讲述了在自动驾驶中单目摄像头检测输出3D边界框的相关论文分享。其中涉及的论文都是值得相关研究者一睹为快。本文已获得黄浴博士授...

    点云PCL博主
  • 快速制作边框的心得

    常常需要制作一个边框,中间放个半透明的板子,用来放置文字,最快的方法是: 1、画一个圆边矩形 2、保存选区,再画收缩之或者自由变换选区,两者运算,求出边框 3、...

    用户1075292
  • height:auto 火狐没边框

    最后添加了一个overflow: hidden;属性ok了,ie火狐都可以显示边框

    yuanyuan
  • CSS颜色选择

    亮蓝色:#409EFF success: #67C23A warning: #E6A23C danger: #F56C6C info: #909399

    渔父歌
  • 编程小知识之循环依赖

    拿 Lua(5.3) 举例,如果我们循环 require 模块,就会触发堆栈溢出错误:

    用户2615200
  • JS判断设备终端(PC,iPad,iPhone,android,winPhone)和浏览器

    deepcc

扫码关注云+社区

领取腾讯云代金券