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);
第二句话的意思就是当上一行的透明度不起作用的时候执行。这句话的意思本来是用来做渐变的。但是这个地方不需要渐变。所以两个颜色都设置成了相同的颜色。
这个颜色“#19ffffff”是由两部分组成的。
第一部是#号后面的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,当用户把手机切换到横屏时,浏览器会自动地重置文本字体大小.这可能会对我们造成困扰,因为 ...
随机推荐
- 小程序——返回上个页面触发事件(onUnload)
//页面销毁前--上传被提交的数据 onUnload:function(){ var _this=this; let updateStatus = wx.getStorageSync('UpdateS ...
- (hdu) 4857 逃生 (拓扑排序+优先队列)
题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=4857 Problem Description 糟糕的事情发生啦,现在大家都忙着逃命.但是逃命的通道很窄 ...
- RocksDB系列二十二:RocksDB使用场景和特性
- 数据标记系列——标记工具Imagtagger
https://github.com/bit-bots/imagetagger 待有空说一说!
- EntityFramework Core笔记:查询数据(3)
1. 基本查询 1.1 加载全部数据 using System.Linq; using (var context = new LibingContext()) { var roles = contex ...
- 解决win10隔几分钟自动黑屏睡眠的方法
来源:win10总是很快自动休眠怎么解决? - 风格不空格的回答 - 知乎 https://www.zhihu.com/question/39263412/answer/87430653 1.运行注册 ...
- 第六十三天 js基础
一.JS三个组成部分 ES:ECMAScript语法 DOM:document对象模型=>通过js代码与页面文档(出现在body中的所有可视化标签)进行交互 BOM:borwser对象模型=&g ...
- 机器学习---文本特征提取之词袋模型(Machine Learning Text Feature Extraction Bag of Words)
假设有一段文本:"I have a cat, his name is Huzihu. Huzihu is really cute and friendly. We are good frie ...
- 2.4 random 模块
- Scrapy 框架 配置文件
配置文件 基本配置 #1.项目名称,默认的USER_AGENT由它来构成,也作为日志记录的日志名 BOT_NAME = 'Amazon' #2.爬虫应用路径 SPIDER_MODULES = ['Am ...