html基础技巧:点击、placeholder、文本、字体、清楚浮动
点击处理:
消除a标签点击后的边框,颜色(background:#fff)
1:a:focus{outline:none;}
button去除边框
1:border:none
2:border:0px(不建议)
3:button::after {
content: none;
}
伪类清楚浮动:
.float:after {
content: " ";
display: table;
}
.float:after {
clear: both;
}
placeholder样式修改
- input::-webkit-input-placeholder {
- color: #aab2bd;
- font-size: 12px;
- }
文本处理:
单行文本溢出省略号结尾。需要做不换行处理+(white-space: nowrap;给定宽度)
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
超过两行用省略号代替 -webkit-line-clamp控制(火狐不支持)( -moz-appearance
)
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 3;
-webkit-box-orient: vertical;
字体处理:
字体大小:font-size:16px;<!--默认16px-->
字体间距:letter-spacing:2px;
字体:font-family:"NSimSun"
字体粗细:font-weight:bloder;
normal:默认值;bold:粗体字符;bolder:更粗的字符;
数字表示:100~900的整百数;400 等同于 normal,而 700 等同于 bold。
虚线
- border-top:1px black dashed;"
border-bottom:1px dotted black
border-bottom:1px solid black
rgba的兼容
- filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#19ffffff,endColorstr=#19ffffff);
第二句话的意思就是当上一行的透明度不起作用的时候执行。这句话的意思本来是用来做渐变的。但是这个地方不需要渐变。所以两个颜色都设置成了相同的颜色。
这个颜色“
#19ffff
ff”是由两部分组成的。
第一部是#号后面的
19
。是rgba透明度
0.1
的IEfilter值。从
0.1
到
0.9
每个数字对应一个IEfilter值。
第二部分是
19
后面的六位 。这个是六进制的颜色值。要跟
rgb
函数中的取值相同。比如
rgb
(
255
,
255
,
255
)对应
#ffffff
;就是白色。
div在不设置宽度的情况下,会自动适屏,但想让div宽度随内容变化, 加上display: inline-block;就可以了
此随笔会不定期得更新,整合一些技巧,供自己和大家学习使用
html基础技巧:点击、placeholder、文本、字体、清楚浮动的更多相关文章
- 【css3】如何自定义 placeholder 文本颜色
昨天写了一篇基于 jquery 实现 ie 浏览器兼容 placeholder 效果,具体内容点击传送门.不过还是有点小瑕疵,就是不能设置 placeholder 文本颜色.本文主要介绍利用 css ...
- 【MFC系列】MFC快速设置控件文本字体、大小、颜色、背景
以静态文本为例,分享一下怎么修改文本字体.大小.颜色.背景等参数.其他文本.控件等可参照修改. 1.修改字体.大小 这个很简单,首先在Dlg类中声明一个CFont类型的成员变量: 然后在类的初始化函数 ...
- css总结4:input 去掉外边框,placeholder的字体颜色、字号
1 input 标签去除外边框: 在进行webAPP开发时,input外边框非常影响美观,去除外边框方法如下: <input style="border: 0px;outline:no ...
- 04CSS文本字体及排版
CSS文本字体 字体——font-family font-family:字体1,字体2,字体3,……:应用font-family属性可以一次定义多个字体,而在浏览器读取字体时, 会按照定义的先后顺序来 ...
- CSS 文本字体颜色设置方法(CSS color)
CSS 文本字体颜色设置方法(CSS color) 一.认识CSS 颜色(CSS color) 这里要介绍的是网页设置颜色包含有哪些:网页颜色规定规范. 1.常用颜色地方包含:字体颜色.超链接颜色.网 ...
- 设计院老师良心汇总:值得牢记的15个CAD基础技巧,能帮大忙
哈喽!你们的CAD魔鬼(老师)来喽! 良心CAD技巧汇总,设计院师傅精心汇总,值得你牢记的15个CAD基础技巧,满满的都是干货,日常最常见的问题以及解决方法这里都汇总给你,给你高效的绘图体验,关键时刻 ...
- Google在情报搜集中的基础技巧
Google在情报搜集中的基础技巧 作者:王宇阳 时间:2019-06-06 作者笔记 Google Hacking 是指使用特定的高级的google搜索语法,收集渗透测试目标的信息,查找目标的配 ...
- 管理员技术(二): 访问练习用虚拟机、 命令行基础技巧 、 挂载并访问光盘设备、ls列表及文档创建、复制删除移动
一.访问练习用虚拟机 目标: 学会在教学环境中访问练习用虚拟机,主要完成以下事项: 1> 快速重置教学虚拟机环境 2> 通过“虚拟系统管理器”访问虚拟机 3> ...
- css基础-css选择器和css文本样式相关
css基础-css选择器和css文本样式相关: 使用link链入外部样式,页面加载时会同时加载样式 @import url(“*.css”);使用导入式,页面加载完后,才会加载样式 链接伪类的顺序 : ...
- HTML5移动Web开发(八)——避免文本字体大小重置
适用设备:iOS.Windows Mobile在一些移动设备上,比方说iPhone,Windows Mobile,当用户把手机切换到横屏时,浏览器会自动地重置文本字体大小.这可能会对我们造成困扰,因为 ...
随机推荐
- centos 6.8 nginx+mysql+php
1:查看环境: [root@123 /]# cat /etc/redhat-release CentOS release 6.8 (Final) 2:关掉防火墙 [root@123 /]# chkco ...
- 相片后期处理,PS调出温暖的逆光美女
原图: 效果图: 后面就是开PS导图: 说明下,因为拍的时候大概知道自己的方法会让照片变暖,现场光线又很暖,所以色温要调低一些,这边是4100,其他不用变,直接转JPG调色了 1:第一步是加第一个曲线 ...
- [转帖]CPU Cache 机制以及 Cache miss
CPU Cache 机制以及 Cache miss https://www.cnblogs.com/jokerjason/p/10711022.html CPU体系结构之cache小结 1.What ...
- Uint 7.文本和字体属性,background,精灵图和3种定位
一. 文本属性 CSS 文本属性可定义文本的外观. 通过文本属性,您可以改变文本的颜色.字符间距,对齐文本,装饰文本,对文本进行缩进,等等. <!DOCTYPE html> <htm ...
- SPP-net原理解读
转载自:目标检测:SPP-net 地址https://blog.csdn.net/tinyzhao/article/details/53717136 上文说到R-CNN的最大瓶颈是2k个候选区域都要经 ...
- [SimplePlayer] 1. 从视频文件中提取图像
在开始之前,我们需要了解视频文件的格式.视频文件的格式众多,无法三言两语就能详细分析其结构,尽管如此,ffmpeg却很好地提取了各类视频文件的共同特性,并对其进行了抽象描述. 视频文件格式,统称为co ...
- python面向对象之类的组合
一.python类的组合:给一个类的对象封装一个属性,这个属性是另一个类的对象二.组合的意义:让类的对象与另一个类的对象产生关系,类与类之间产生关系.三.例子模拟英雄联盟写一个游戏人物的类 要求:(1 ...
- [BZOJ 2242] [SDOI 2011] 计算器
Description 你被要求设计一个计算器完成以下三项任务: 给定 \(y,z,p\),计算 \(y^z \bmod p\) 的值: 给定 \(y,z,p\),计算满足 \(xy≡ z \pmod ...
- AtCoder Grand Contest 012
AtCoder Grand Contest 012 A - AtCoder Group Contest 翻译 有\(3n\)个人,每一个人有一个强大值(看我的假翻译),每三个人可以分成一组,一组的强大 ...
- HDU - 1078 FatMouse and Cheese (记忆化搜索)
FatMouse has stored some cheese in a city. The city can be considered as a square grid of dimension ...