![](https://img-blog.csdnimg.cn/20201014180756926.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
HTM+CSS
文章平均质量分 54
shirley云
矛盾的混合体!
展开
-
HTML 特殊符号编码对照表
特殊符号命名实体十进制编码特殊符号命名实体十进制编码特殊符号命名实体十进制编码ΑΑΑΒΒΒΓΓΓΔΔΔΕΕ转载 2016-07-20 15:47:58 · 365 阅读 · 0 评论 -
html替换和不可替换元素
从元素本身的特点来讲,可以分为替换和不可替换元素。1、替换元素替换元素就是浏览器根据元素的标签和属性,来决定元素的具体显示内容。例如浏览器会根据img标签的src属性的值来读取图片信息并显示出来,而如果查看(X)HTML代码,则看不到图片的实际内容;又例如根据input标签的type属性来决定是显示输入框,还是单选按钮等。(X)HTML中的img、input、textarea、se转载 2016-07-20 16:24:14 · 1169 阅读 · 0 评论 -
CSS3 Object-fit和Object-position
功能简介在CSS中,替换元素(replaced elements),如和元素一直存在长宽比的控制问题,特别在在响应式设计中,如何在不同设备,不同分辨率下对这些元素的长宽进行响应。例如,您可能想不以图片的正确尺寸,不想扭曲图像,也不想失去图像的长宽比例,让图片占据一定的空间。按照长宽比例调整和缩略图像的画面比挤压和拉伸图像是一个更优雅的解决方案。在CSS3中我们可以使用object-fit和转载 2016-07-20 16:40:02 · 476 阅读 · 0 评论 -
响应式图片填充工具picturefill
https://github.com/scottjehl/picturefillhttp://scottjehl.github.io/picturefill/picturefill允许web开发人员根据不同的屏幕大小、视口大小、屏幕分辨率等情况提供不同的图片给用户。picturefill使用方法首先引入JS(需要在HTML文档头部引用)为了使你的网页能够有效的加载,建议增加翻译 2016-07-20 18:18:29 · 4561 阅读 · 0 评论 -
常见的链接关系
alternate文档的可选版本(例如打印页、翻译页或镜像)stylesheet文档的外部样式表start集合中的第一个文档next集合中的下一个文档prev集合中的前一个文档contents文档目录index文档索引glossary文档中所用字词的术语表或解释copyr转载 2016-08-17 00:09:18 · 1419 阅读 · 0 评论 -
css中文英文换行、禁止换行、显示省略号
word-break:break-all;只对英文起作用,以字母作为换行依据 word-wrap:break-word; 只对英文起作用,以单词作为换行依据 white-space:pre-wrap; 只对中文起作用,强制换行white-space:nowrap; 强制不换行,都起作用white-space:nowrap; overflow:hidden; text-overflow:ellips原创 2016-08-09 14:20:01 · 4676 阅读 · 0 评论 -
HTML <a> 标签 (修改样式,链接邮箱Email地址)
属性值描述 标签的 charset 属性" style="margin:0px; padding:0px; border:0px; color:rgb(144,11,9); background:transparent">charsetchar_encodingHTML5 中不支持。规定被链接文档的字符集。 标签的 coords 属性转载 2016-08-09 14:35:23 · 7818 阅读 · 0 评论 -
前端冷知识
HTML篇浏览器地址栏运行JavaScript代码在浏览器地址栏可以直接运行JavaScript代码,做法是以javascript:开头后跟要执行的语句。比如:javascript:alert('hello from address bar :)');将以上代码贴到浏览器地址栏回车后alert正常执行,一个弹窗神现。需要注意的是如果是通过copy paste代码到浏览器地址转载 2016-08-09 16:53:35 · 498 阅读 · 0 评论 -
轻量级的的视差引擎Parallax.js
地址:https://github.com/wagerfield/parallax转载 2016-08-11 15:52:39 · 1357 阅读 · 0 评论 -
浏览器内核以及私有前缀
根据不同的内核,一些私有属性的css前缀不一样 Gecko内核 css前缀为"-moz-" 火狐浏览器WebKit内核 css前缀为"-webkit-" Comodo Drangon(科摩多龙),苹果,搜狗高速浏览器3,快快浏览器,枫树浏览器,云游浏览器,360极速浏览器,世界之窗极速版,SRWare Iron,猎豹浏览器,RockMelt,QQ浏览器转载 2016-08-12 17:27:33 · 2295 阅读 · 0 评论 -
css3 Gradient渐变效果
CSS3 渐变(gradients)可以让你在两个或多个指定的颜色之间显示平稳的过渡。以前,你必须使用图像来实现这些效果。但是,通过使用 CSS3 渐变(gradients),你可以减少下载的事件和宽带的使用。此外,渐变效果的元素在放大时看起来效果更好,因为渐变(gradient)是由浏览器生成的。CSS3 定义了两种类型的渐变(gradients):线性渐变(Linear Gradi原创 2016-06-28 16:27:07 · 626 阅读 · 0 评论 -
html5新增标签
article含义:article标签装载显示一个独立的文章内容。例如一篇完整的论坛帖子,一则网站新闻,一篇博客文章等等,一个用户评论等等... artilce可以嵌套,则内层的artilce对外层的article标签有隶属的关系。例如,一个博客文章,可以用article显示,然后一 些评论可以以article的形式嵌入其中。属性:支持HTML5的全局属性和事件属性。sec原创 2016-06-28 11:52:02 · 550 阅读 · 0 评论 -
css命名规范
id和class命名采用该版块的英文单词或组合命名,并第一个单词小写,第二个单词首个字母大写,如:QuickCss(最新产品/Quick+Css)CSS样式表各区块用注释说明尽量使用英文命名原则尽量不加中杠和下划线尽量不缩写,除非一看就明白的单词css命名好的css命名是检验一个css工作者是否合格的一项基本指标。头:header内容:content/con转载 2016-05-25 15:10:17 · 514 阅读 · 0 评论 -
你可能会遇到的CSS单位
em 相对于当前对象内文本的字体大小。rem r’是“root”的缩写,意思就是1rem等于根元素的字体大小,即相对于根元素html的大小。vh and vw 响应式web设计离不开百分比。但是,CSS百分比并不是所有的问题的最佳解决方案。CSS的宽度是相对于包含它的最近的父元素的宽度的。但是如果你就想用视口(viewpoi转载 2016-05-26 14:14:10 · 502 阅读 · 0 评论 -
HTML 5 <input> placeholder 属性
定义和用法placeholder 属性提供可描述输入字段预期值的提示信息(hint)。该提示会在输入字段为空时显示,并会在字段获得焦点时消失。注释:placeholder 属性适用于以下的 类型:text, search, url, telephone, email 以及 password。(submit类型的input不适用placeholder 属性)HTML5 plac原创 2016-05-20 10:21:19 · 364 阅读 · 0 评论 -
在less中使用css3 calc 的问题
问题描述在less中 calc(100% -4rem) 等带单位混合运算会被less解析忽略单位,全部按照百分比计算,此例中的计算被less编译成calc(96%)。原因分析less的计算方式跟calc方法有重叠,两者在一起有冲突解决方案原创 2016-05-23 16:00:49 · 7865 阅读 · 1 评论 -
自适应网页里,字体大小如何自适应屏幕
字体大小使用 em, rem 作为单位,然后使用 media query 来调整 html 元素的 font-size自适应网站html {font-size: 62.5%!important; /* 10÷16=62.5% */}@media only screen and (min-width: 481px){ html { font-size: 94%!im原创 2016-05-23 16:56:49 · 36672 阅读 · 4 评论 -
网页引用Font Awesome图标
首先引入方法一:将以下代码粘贴到网页HTML代码的 部分.方法二:复制整个 font-awesome 文件夹到您的项目中。在HTML的 中引用font-awesome.min.css。FONTAWESOME 图标介绍(http://fontawesome.dashgame.com/)FONTAWESOME 图标(附码表)(http://www.bootcss原创 2016-05-24 09:56:19 · 14961 阅读 · 3 评论 -
常见中文字体英文名称以及windows默认字体列表
在默认情况下,也就是未自行安装新字体或者 Office 等文字处理软件的情况下,Windows 默认提供下列字体:Windows 95/98/98SE 宋体、黑体、楷体_GB2312、仿宋_GB2312Windows XP/2000/2003/ME/NT 宋体/新宋体、黑体、楷体_GB2312、仿宋_GB2312 (Windows XP SP3 宋体-PUA)Windows原创 2016-05-24 10:39:56 · 27982 阅读 · 0 评论 -
CSS3中clip属性
clip 属性用来设置元素的形状。用来剪裁绝对定位元素。当一幅图像的尺寸大于包含它的元素时,”clip” 属性允许规定一个元素的可见尺寸,这样此元素就会被修剪并显示在这个元素中。1.clip属性只能用于绝对定位元素,position:absolute或fixed。2.clip属性有三种取值:auto 默认的 inherit继承父级的原创 2016-05-27 17:08:50 · 717 阅读 · 0 评论 -
复位样式——随时更新
复位样式,总结自己的@charset "utf-8";/* * Created: linda * LastChangedDate: 2016-05-31*//* 清除内外边距 */body, h1, h2, h3, h4, h5, h6, hr, p, blockquote, /* dom */dl, dt, dd, ul, ol, li,/* list */pre, /* c原创 2016-05-31 17:32:05 · 317 阅读 · 0 评论 -
html编码规范+css编码规范
html编码规范,css编码规范原创 2016-06-06 15:24:49 · 321 阅读 · 0 评论 -
用纯css3绘制三角形的原理
预备知识当我们设置一个div其width与height为100px,并且设置其四边框的宽度为100px,且分别设置其颜色后,我们可以看到如下的一张图片此时如果设置这个div的height为0的话,其他不变,会得到下面这个图形下面把其宽度也设置为0后,得到如下的一张图片正式讲解当我们如下设置代码并赋给div相应的属性时#side转载 2016-08-12 17:47:53 · 11418 阅读 · 0 评论