近段时间学习html和ＣＳＳ的一些细碎总结

1、边框圆角属性：border-radius，取值能够是百分比 / 自己定义长度，不能够取负值。假设是圆，将高度和宽度设置相等，而且将border-radius设置为100%
2、IE6，IE7，IE8，opera，firfox-2.0等浏览器，不支持边框的圆角效果。我们能够用图片来做。
3、为了克服有的浏览器不能显示某些属性设置的效果，能够专门设置使其识别，如火狐浏览器是 -moz-,谷歌浏览器是 -webkit- ,应用如：-webkit-border-radius:100%;
4、属性元素如input，能够在style中例如以下设置(text也能够是别的)：
input[type="text"]{
width:50px;
……(其它属性设置)
}
5、能够使用 outline：none；去除input输入表单的边框。可是有的时候就算设置了outline：none；也会发现边框没有去除，这个时候能够用border：none；就能够解决问题。
6、有时候能够使用无序列表ul,li来实现某些在同一排的一些元素，由于列表是块级元素，这个时候我们能够用元素的浮动将列表项的每一列都变成内嵌元素，实现他们显示在同一行。
7、有时候我们用input做搜索框的时候，常常会在搜索框里面设置初始值，然后用户点击的时候这个初始值会消失，除了用javascript事件做外，还能够用placeholder属性来做。如<input id="search" name="search" placeholder="please input what you want..."/>
8、用input做一些输入框如password框，username等的时候，应该设置输入的最大长度，避免出现无限制输入。
9、内嵌元素不能设置其高度和宽度，可是能够设置它的内边距和左右外边距。
10、使元素自己主动换行(强制换行)的方法是在声明块中增加 word-break:break-all;
最好的引用片段是word-wrap:break-word;overflow:hidden;
其它能够引用的片段是word-wrap:break-word;overflow:auto;
还有：word-wrap:break-word;word-break:break-all;
11、有时候我们要将我们做的一个东西放在整个页面的中央，我们能够设置margin值来实现。设置margin：0px；margin：auto；就能够了。
12、一般假设不想内容顶格或者紧挨着div边缘的话，能够设置padding属性，可是要记得改原始设置的宽度和高度，保证原来的大小。这种原理是元素的内容区是width和height定义的部分，可是元素的背景色和图像在padding是能够显示的。

13、为了防止前面设置的浮动元素的元素内容影响到后面设置的内容，能够在后面的元素的声明块内设置取消浮动 clear : left / right。然后再设置后面元素自身的浮动。

14、在input标签中，一般应该指定一个值来限制输入的最大长度，用maxlength来设置，如<input type="password" maxlength="20" />

15、通常会认为输入框中在開始输入的时候光标离输入框的边缘有一定距离会比較好看。能够设置padding-left的值来实现。

近段时间学习html和ＣＳＳ的一些细碎总结相关推荐

对这段时间学习数据库的总结和感悟
对这段时间学习数据库的总结和感悟从2018-12月开始学习mysql,到今天,已经一个月了,因为上班的关系,所以只能每天挤时间出来学习mysql,因为之前一直是使用oracle数据库,所以我也没顾得 ...
近段时间整理出的三款Android游戏源码
这段时间休息在家的时候,整理出三款Android游戏源码,分享给大家交流学习一下. 1.会说话的汤姆猫Android版** 2.五子连珠游戏Android版**** 3.斗地主游戏Android版欢 ...
近段时间的学习碎片整理（7）
Flexboxlayout 弹性布局(参考RecyclerView FlexboxLayoutManager 自适应宽度布局管理器_蓝色的天空的博客-CSDN博客) FlexboxLayout是去年 ...
近段时间的学习碎片整理（4）
Service 从Android 8.0系统开始,应用的后台功能被大幅削减.现在只有当应用保持在前台可见状态的情况下,Service才能保证稳定运行,一旦应用进入后台之后,Service随时都有可能被 ...
近段时间的学习碎片整理（5）
Android5.0新特性全新的 Material Design 设计风格支持多种设备全新的通知中心设计支持 64 位 ART虚拟机 Overview 设备识别解锁 RecyclerView ...
近段时间的学习碎片整理（10）
1.本地docx文件解析 (1)引入依赖 implementation 'tm-extractors:tm-extractors:0.4' (2)解析文件 private fun readDOCX(p ...
近段时间的学习碎片整理（6）
1.ripple <?xml version="1.0" encoding="utf-8"?> <ripple xmlns:android=& ...
近段时间的学习碎片整理（18）
设置壁纸功能(可参考Android 代码设置壁纸,兼容华为小米 OPPO Vivo - 简书) 建议先将壁纸下载到缓存文件夹后再调用手机自带的设置壁纸组件来完成,也可以用wallpapermanag ...
数通 | 从二层、三层的概念切入这段时间学习的数通知识
文章目录话题引入实例分析一波实例一实例二实例小结补充内容局域网&以太网网络适配器三层交换机 VLAN 没讨论到的地方参考资料话题引入在数通学习中,不可避免的会看到&qu ...

近段时间学习html和ＣＳＳ的一些细碎总结

近段时间学习html和ＣＳＳ的一些细碎总结相关推荐

最新文章

热门文章