li的border无法和上边对齐
如果利用border设置四周的border,如果一边的边框比较长无法对齐
解决办法:
.test{
position: relative;
border: 1px solid #808080;
height: 100px;
width: 100px;
}
.test:after{
content: '';
position: absolute;
right: -10px;
top:-1px;
width: 0;
height: 0;
border-width: 102px 10px 0 0;
border-style: solid;
border-color:red;
}
<div class="test"> </div>
li的border无法和上边对齐的更多相关文章
- CSS ul li a 背景图片与文字对齐
<div class="four"> <h2>电子商务</h2> <img src="images/photo2.gif&quo ...
- C-图文上边对齐
1.效果 1.1 样式设置 2 效果 2.1 样式
- css text-align-last设置末尾文本对齐方式
text-align-last:auto | start | end | left | right | center | justify auto: 无特殊对齐方式. left: 内容左对齐. cen ...
- ul li 下的元素内容垂直居中
CSS: <style> * {;; } li { list-style: none; } li span { border: 1px solid red; height: 100px; ...
- css技巧之如何实现ul li边框重合
提到边框重合,我们不妨打开淘宝首页浏览主体分类内容板块瞧瞧---亲,你看到了,正是这个,边框重合.其实我们不难发现,这个效果并不难,只是我们没有真正的动手做过而已,所以不知道怎么做,那么下面就是一个很 ...
- li span兼容性问题
li与span的搭配使用所产的浏览器兼容性问题 1.ls两位,设定了width还是没用.2.总结了一下就是,里面的标签漂浮以后,就不能撑起外层的容器了. 3.li要设至少一个宽度或高度,还要加上ove ...
- 如何解决两个li之间的缝隙
如何解决两个li之间的缝隙的问题: 在做一个类似按钮左右滑动的选择器的动效,遇到了个是关于li之间的缝隙的问题: HTML如下: <span class="c1mChanger&quo ...
- 利用vertical-align实现行内元素对齐
实际项目中,常常会遇到一排行内元素对齐排列的需求,但是往往它们是这样的 我们想要的其实是这样的 曾经我一度不得不使用定位来实现我想要的位置效果,将父元素设置 position:relative ,行内 ...
- 用ul li实现边框重合并附带鼠标经过效果
边框重合这个效果并不难,只是我们没有真正的动手做过而已,下面让我们来谈谈用ul li如何实现边框重合,并附带鼠标经过效果 <!DOCTYPE html> <html lang=&qu ...
随机推荐
- TextView 设置超过几行后显示省略号
android:lines="5" android:ellipsize="end"
- LayerDrawable 资源
与 StateListDrawable 有点类似,LayerDrawable 也可包含一个 Drawable 数组,因此系统 将会按这些 Drawable 对象的数组顺序来绘制它们,索引最大的 Dra ...
- POJ2251 Dungeon Master(bfs)
题目链接. 题目大意: 三维迷宫,搜索从s到e的最小步骤数. 分析: #include <iostream> #include <cstdio> #include <cs ...
- Codeforces Round #312 (Div. 2) A.Lala Land and Apple Trees
Amr lives in Lala Land. Lala Land is a very beautiful country that is located on a coordinate line. ...
- oracle连接进程数设置
SQL> select count(*) from v$session #连接数SQL> Select count(*) from v$session where status='ACTI ...
- UVALive 6198 A Terribly Grimm Problem
题目大意是 给出L,H 10^10范围 为[L, H]这个连续的整数区间寻找一个序列. 序列的长度要跟[L, H]一样 然后序列中的数都是素数,并且互不相同 并且序列中第i个数 要求是L + ...
- 在sql语句中使用plsql变量
示例代码如下: create or replace type ua_id_table is table of number; declare v_tab ua_id_table;begin v_tab ...
- redis取值报错
> get "all_couriers_on_the_job" (error) ERR Operation against a key holding the wrong k ...
- ubuntu14.04 安装tar.gz文件
UBUNTU14.04 中tar.gz安装方法 # 是root用的,如果想一直用就要先root设置密码sudo passwd root.$ 一般用户 root@big-System-Product-N ...
- jQuery(二)
jQuery学完了!好用! 1.用定时器做的jquery里面的animate效果 <!DOCTYPE html> <html lang="en"> < ...