html随笔CSS(*^__^*)
控制文本显示字数,超过规定的文本长度 x显示...
white-space:nowrap; //规定不能换行
overflow:hidden;
text-overflow:ellipsis; //超出长度,“...”显示
width:320px;
设置 div内div居中显示(此方法中的display:flex 为较高版本的所以ie9 不兼容)
父层div加上css属性
display:flex;
justify-content:center;
align-items:center;
input 框初始提示文字
placeholder="手机号/邮箱/用户名"/
子层的margin与父类的margin合并问题:http://blog.csdn.net/hnxieyi/article/details/52818236
可以通过以下方式避免margin的合并问题
都用float来定位(有条件要求,适用范围较广)
为父元素添加overflow不为visiable 的属性 (适用范围极广,推荐使用)
为元素添加border(一般不用)
使用绝对定位(适用范围较窄)
父元素增加padding-top属性(改变尺寸,不建议使用)
然鹅我在用margin-top的时候又发现一个问题: 在上一个层有clear属性的时候margin-top不起作用,应该还是margin合并的问题,但是具体原因我没有分析清楚,只提供几个解决方案,供大家参考:
中间加一个层<div style=”clear:both”></div>
设置上一个层的margin-bottom来代替下一个层的margin-top
使用包裹层,并设置上下层都用float:left;
使用绝对定位
全部加上border
父层 往下 遍历子层 可以用 find();
childern() //children() 方法返回返回被选元素的所有直接子元素。
animate使用
div,animate({“”:“” ,“”:“”},1200)
其中{}可以为执行动画的style e.g height、left....
“1200”为毫秒或者“fast”“normal”“slow” 为动画的执行速度
js后期新加元素绑定事件可以通过下方法
$(document).on("click",'.addspan',function(){
$(this).remove();
});
或者我们可以通过在加元素前 。将绑定的事件写入 加元素的html中
e.g
var eleSpan = "<span onclick='labelClick(this)'>"+sign+"</span>"; //将this 作为绑定事件的参数
if(spanlength == 0){
$(".selected").empty(); $(".selected").append(eleSpan);
} else if(spanlength <){
$(".selected").append(eleSpan);
}else{
alert("最多添加三个哦~");
}
function labelClick(ele){
$(ele).remove();
}
jquery方法:
removeClass(); //删除类
addClass(); //加类
empty(); //从被选元素内移除所有内容,包括所有文本和子节点。
remove(); //移除被选元素,包括所有文本和子节点。
val(); //返回或设置被选元素的值。元素的值是通过 value 属性设置的。该方法大多用于 input 元素。value为js的属性
text(); //返回或设置 被选元素中的所有文本值
index(); //同类同胞所在的位置 从0开始,找不到为-1
对于格式比较特殊的我们可以用table
table的行间距设定
border-spacing: 2px 15px; //横向 2px; 纵向 15px
去掉相邻重复的边框
margin: 0 0 -1px -1px; (根据边框宽度来调节)
position absolute relative区别 absolute: 对于absolute定位的层总是相对于其最近的定义为absolute或relative的父层,而这个父层并不一定是其直接父层。
如果其父层中都未定义absolute或relative,则其将相对body进行定位,
relative: relative定位的层总是相对于其最近的父元素,无论其父元素是何种定位方式
background 定位
120px 12px 水平120px; 竖直方向12x;
随机推荐
- spring容器bean的作用域 & spring容器是否是单例的一些问题
Spring容器中Bean的作用域 当通过Spring容器创建一个Bean实例时,不仅可以完成Bean实例的实例化,还可以为Bean指定特定的作用域.Spring支持如下5种作用域: singleto ...
- 【转】 聚类算法-Kmeans算法的简单实现
1. 聚类与分类的区别: 首先要来了解的一个概念就是聚类,简单地说就是把相似的东西分到一组,同 Classification (分类)不同,对于一个 classifier ,通常需要你告诉它“这个东西 ...
- FreeBSD之基本配置
1. 设置IP地址.网关ee /etc/rc.conf ifconfig_em0="inet 192.168.21.173 netmask 255.255.255.0" #设置 ...
- c++-pimer-plus-6th-chapter04
Chapter Review 1 a. char actors[30]; b. short betsie[100]; c. float chunk[13]; d. long double dipsea ...
- Ftp服务端安装-Linux环境
目的 为什么要搭建FTP服务器,进入maven仓库下载Jar包时点击相应的链接进去会看到目录结构,这个就是ftp站点.可以随意的下载. 环境 Linux系统为CentOS6.5 安装步骤 查询是否已安 ...
- ml基本问题
作者:NgShawn 链接:https://www.nowcoder.com/discuss/33737?type=2&order=3&pos=19&page=1 来源:牛客网 ...
- Remove Element leetcode java
问题描述: Given an array and a value, remove all instances of that value in place and return the new len ...
- 有用的git命令
1. git log -p // 查看log的详细信息 2. git reset HEAD xxxx // 将文件从stage状态拉出来 3. git checkout -- xxxx // 将修改的 ...
- Python中单线程、多线程和多进程的效率对比实验
GIL机制导致如下结果: Python的多线程程序并不能利用多核CPU的优势 (比如一个使用了多个线程的计算密集型程序只会在一个单CPU上面运行)python多线程适合io操作密集型的任务(如sock ...
- MongoDB\BSON\UTCDateTime::toDateTime
示例# 1 MongoDB \ BSON \ UTCDatetime:toDateTime()例子 <?php $utcdatetime = new MongoDB\BSON\UTCDateTi ...