杂七杂八

原创 2016年06月01日 23:48:07

杂七杂八

px | em | rem

px:像素,绝对长度单位;相对于显示屏幕分辨率而言

em:相对长度单位;相对于父级元素文本的字体尺寸

rem:相对长度单位;相对于HTML根元素

为了简化换算,可用的办法举例:

 html { font-size:62.5%; /*10÷16=62.5%*/}
 body { font-size:12px; font-size:1.2rem; /*12÷10=1.2*/ }
 p { font-size:14px; font-size:1.4rem; /*14÷10=1.4*/ }

父级对象高度

当一个div有三个子元素且左右两个都浮动时,怎样让其高度取决于三个子元素中最高的高度?

  1. 设置父对象中 min-height: 值px;
  2. 设置overflow:auto;(个人觉得不太好)

border-radius属性

border-radius: 1-4 length|% / 1-4 length|%; (缩写格式)

如果”/”前后值都设置,那么”/”前面的值设置其水平半径,”/”后面的值设置其垂直半径;
若没有”/”,则水平半径值等于垂直半径值。其值按照top-left、top-right、bottom-right、bottom-left的顺序。

border-radius : 25px;/*四个值相等均为25px*/
border-radius : 25px 30px;/*top-left=bottom-right=25px;top-right=bottom-left=30px*/
border-radius : 25px 30px 35px;/*top-left=25px;top-right=bottom-left=30px;bottom-right=35px;*/
border-radius : 25px 30px 35px 40px;/*top-left=25px;top-right=30px;bottom-left=35px;bottom-right=40px;*/


border-top-left-radius:          //左上角
border-top-right-radius:         //右上角
border-bottom-right-radius:      //右下角
border-bottom-left-radius:       //左下角
/*拆分式中第一个值是圆角水平半径,第二个值是圆角垂直半径,若第二个值省略,这时角就是一个四分之一的圆角*/

css画三角形

一般在布局的时候会有小三角形引的二级导航框会用到

html代码

<div id="re"></div>

样式

#re {
    width: 0;
    border-top: 10px solid transparent;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    border-bottom: 10px solid yellow;
}

导航菜单旋转效果

就是熟悉了一下transform属性吧可以说,效果好像也不是很好看:p

html代码

<ul>
    <li><a href="#">首页</a></li>
    <li><a href="#">关于</a></li>
</ul>

样式

ul {
    display: block;
    background-color: red;
}
ul li {
    display: inline-block;
    list-style-type: none;
    transform-style: preserve-3d;
    perspective: 800px;
}
ul li a {
    color: #fff;
    display: block;
    text-decoration: none;
    font-family: "\5FAE\8F6F\96C5\9ED1";
    font-size: 24px;
    line-height: 20px;
    padding: 15px 10px;
}
ul li a:hover{
    -ms-transform:rotateX(360deg);     /* IE 9 */
    -moz-transform:rotateX(360deg);    /* Firefox */
    -webkit-transform:rotateX(360deg); /* Safari 和 Chrome */
    -o-transform:rotateX(360deg);  /* Opera */
    transition: 5s;
    background-color: yellow;
}
and and and 我真的不知道写博客到底要写啥(……….略略略)

Android 杂七杂八

Glide的使用: 1.在build.gradle中添加依赖:compile'com.github.bumptech.glide:glide:3.7.0' 2.网络图片加载到ImageView中:...
  • qq_37721961
  • qq_37721961
  • 2018年01月11日 14:27
  • 33

android 杂七杂八

EditText多行输入时,想从第一行输入 只需要 android:gravity="top" 就可以了
  • u013775102
  • u013775102
  • 2014年03月03日 16:59
  • 415

关于java.nio.ByteBuffer的一些杂七杂八。

任何网络程序框架都会面临一个问题:如何提供一个高效的buffer?比如我们想写一个http server,那么就需要不断的从文件中读入数据,然后写入到socket中,如:  byte[] buf=n...
  • chenyechao
  • chenyechao
  • 2013年06月29日 01:36
  • 896

android 之杂七杂八

前言:单独开一篇
  • harvic880925
  • harvic880925
  • 2014年05月04日 14:49
  • 2176

Android杂七杂八(一)

Activity       Activity是Android中的一个组件,提供了一个界面用于和用户的交互,用户可以在上面进行操作。 Activity的四种状态:running/paused/st...
  • qq_37721961
  • qq_37721961
  • 2018年01月15日 16:48
  • 8

杂七杂八的话--c++

1、 通常情况下,如果一个类包含有指针数据成员,我们在复制对象时,不能直接对指针进行赋值,而应该是重新动态分配内存,并复制指针所指向数据,称之为深拷贝,否则,一旦析构函数去释放指针时,会造成内存的重复...
  • vevenlcf
  • vevenlcf
  • 2013年08月16日 09:45
  • 547

操作系统—杂七杂八

内容会持续更新,有错误的地方欢迎指正,谢谢!本文包括:操作系统除了进程和线程、内存管理之外的内容。1、什么是init进程?init进程是系统所有进程的起点,init进程的进程号永远是1。2、什么是内核...
  • BillCYJ
  • BillCYJ
  • 2018年01月12日 00:58
  • 16

杂七杂八----常用命令

在命令行中通过adb shell am broadcast发送广播通知 打印apk 的信息:aapt dump badging Phone.apk  make showcommands ...
  • tangmin0719
  • tangmin0719
  • 2013年05月23日 17:06
  • 700

android 之杂七杂八

前言:单独开一篇将遇到的关于android代码中的一些小问题予以总结。 一、关闭软键盘 [java] view plaincopy ...
  • jian_csdn
  • jian_csdn
  • 2015年01月27日 16:38
  • 251

杂七杂八的记录

这篇博客会整理这些天的一些笔记,比较杂乱,算是自己的一个笔记吧。Linux常用命令文字界面切换登录界面: ctrl+alt + f1 ~ f6ubuntu300分钟关闭 sudo shutdown +...
  • mockingbirds
  • mockingbirds
  • 2016年02月21日 14:53
  • 968
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:杂七杂八
举报原因:
原因补充:

(最多只允许输入30个字)