点击处理:

消除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.10.9每个数字对应一个IEfilter值。

第二部分是19后面的六位 。这个是六进制的颜色值。要跟rgb函数中的取值相同。比如rgb(255,255,255)对应#ffffff;就是白色。

div在不设置宽度的情况下,会自动适屏,但想让div宽度随内容变化, 加上display: inline-block;就可以了

此随笔会不定期得更新,整合一些技巧,供自己和大家学习使用

html基础技巧:点击、placeholder、文本、字体、清楚浮动的更多相关文章

  1. 【css3】如何自定义 placeholder 文本颜色

    昨天写了一篇基于 jquery 实现 ie 浏览器兼容 placeholder 效果,具体内容点击传送门.不过还是有点小瑕疵,就是不能设置 placeholder 文本颜色.本文主要介绍利用 css ...

  2. 【MFC系列】MFC快速设置控件文本字体、大小、颜色、背景

    以静态文本为例,分享一下怎么修改文本字体.大小.颜色.背景等参数.其他文本.控件等可参照修改. 1.修改字体.大小 这个很简单,首先在Dlg类中声明一个CFont类型的成员变量: 然后在类的初始化函数 ...

  3. css总结4:input 去掉外边框,placeholder的字体颜色、字号

    1 input 标签去除外边框: 在进行webAPP开发时,input外边框非常影响美观,去除外边框方法如下: <input style="border: 0px;outline:no ...

  4. 04CSS文本字体及排版

    CSS文本字体 字体——font-family font-family:字体1,字体2,字体3,……:应用font-family属性可以一次定义多个字体,而在浏览器读取字体时, 会按照定义的先后顺序来 ...

  5. CSS 文本字体颜色设置方法(CSS color)

    CSS 文本字体颜色设置方法(CSS color) 一.认识CSS 颜色(CSS color) 这里要介绍的是网页设置颜色包含有哪些:网页颜色规定规范. 1.常用颜色地方包含:字体颜色.超链接颜色.网 ...

  6. 设计院老师良心汇总:值得牢记的15个CAD基础技巧,能帮大忙

    哈喽!你们的CAD魔鬼(老师)来喽! 良心CAD技巧汇总,设计院师傅精心汇总,值得你牢记的15个CAD基础技巧,满满的都是干货,日常最常见的问题以及解决方法这里都汇总给你,给你高效的绘图体验,关键时刻 ...

  7. Google在情报搜集中的基础技巧

    Google在情报搜集中的基础技巧 作者:王宇阳 时间:2019-06-06 作者笔记 ​ Google Hacking 是指使用特定的高级的google搜索语法,收集渗透测试目标的信息,查找目标的配 ...

  8. 管理员技术(二): 访问练习用虚拟机、 命令行基础技巧 、 挂载并访问光盘设备、ls列表及文档创建、复制删除移动

    一.访问练习用虚拟机 目标: 学会在教学环境中访问练习用虚拟机,主要完成以下事项: 1> 快速重置教学虚拟机环境       2> 通过“虚拟系统管理器”访问虚拟机       3> ...

  9. css基础-css选择器和css文本样式相关

    css基础-css选择器和css文本样式相关: 使用link链入外部样式,页面加载时会同时加载样式 @import url(“*.css”);使用导入式,页面加载完后,才会加载样式 链接伪类的顺序 : ...

  10. HTML5移动Web开发(八)——避免文本字体大小重置

    适用设备:iOS.Windows Mobile在一些移动设备上,比方说iPhone,Windows Mobile,当用户把手机切换到横屏时,浏览器会自动地重置文本字体大小.这可能会对我们造成困扰,因为 ...

随机推荐

  1. 干货型up主

    很多教学视频,我看了反射,正在看JAVAWEB 和Spring  讲得很清楚 反正就是很好!!! https://space.bilibili.com/326782142?spm_id_from=33 ...

  2. Django rest framework 使用haystack对接Elasticsearch

    Elasticsearch 介绍 ElasticSearch是一个基于Lucene的搜索服务器.它提供了一个分布式多用户能力的全文搜索引擎,基于RESTful web接口.Elasticsearch是 ...

  3. 【翻译】asp.net core中使用MediatR

    这篇文章来自:https://ardalis.com/using-mediatr-in-aspnet-core-apps 本文作为翻译,有一些单词翻译成中文可能会有一些误解(对于读者)或者错误(对于作 ...

  4. Linux -- nginx

    一. 网络服务 web服务器和web框架的关系 web服务器(nginx):接收HTTP请求(例如www.baidu.com)并返回数据 web框架(django,flask):开发web应用程序,处 ...

  5. jvm学习一:类加载过程详解

    (自学笔记,持续更新,欢迎指正) 我们都知道一个java程序运行要经过编译和执行,但是这太概括了,中间还有很多步骤,今天来说说类加载 学完类加载之后,java运行过程就可以分为  编译  > 类 ...

  6. H5的表格

    表格标签<table> 绘制表格的标签:<table>标签 表格标题:<caption>标签 表格宽度与高度:width和height属性 表格边框色:border ...

  7. 一个很变态的SQL

    select max(s.operat_time) as pzTime from ws_state_record s where s.status = (select p1.node_id from ...

  8. Hdoj 1847.Good Luck in CET-4 Everybody! 题解

    Problem Description 大学英语四级考试就要来临了,你是不是在紧张的复习?也许紧张得连短学期的ACM都没工夫练习了,反正我知道的Kiki和Cici都是如此.当然,作为在考场浸润了十几载 ...

  9. license.json

    {"license":{"uid":"5359f3d1-8c8c-462b-a17b-b7eb0c3ddb8f","type&qu ...

  10. jdk8在windows及linux环境下安装

    jdk下载 下载地址:https://www.oracle.com/technetwork/java/javase/downloads/index.html 目前大部分公司内部使用的还是jdk8,大部 ...