<!DOCTYPE HTML>
<html>
<head>
<meta charset="UTF-8">
<title>CSS3 Demo</title>
<style type="text/css">
#intro{
font-size: 40px;
-webkit-transition:font-size 0.2s ease-out;
}
@media only screen and (max-width: 1200px) { #intro{ font-size: 39px; }}
@media only screen and (max-width: 1100px) { #intro{ font-size: 38px; }}
@media only screen and (max-width: 1000px) { #intro{ font-size: 37px; }}
@media only screen and (max-width: 900px) { #intro{ font-size: 36px; }}
@media only screen and (max-width: 800px) { #intro{ font-size: 35px; }}
@media only screen and (max-width: 700px) { #intro{ font-size: 34px; }}
@media only screen and (max-width: 600px) { #intro{ font-size: 33px; }}
@media only screen and (max-width: 500px) { #intro{ font-size: 32px; }}
@media only screen and (max-width: 400px) { #intro{ font-size: 31px; }}
@media only screen and (max-width: 300px) { #intro{ font-size: 30px; }}
</style>
</head>
<body>
<div id="intro">我是靖鸣君 我是靖鸣君 我是靖鸣君</div>
</body>
</html>
以上代码，很简单，当浏览器宽度在300像素的时候，文字大小为30PX,浏览器宽度在400像素的时候，文字大小为31像素。不信，你就试试。。。
相关推荐
js代码实现页面自适应，css样式可以用rem来做单位，实现界面随浏览器变化而自适应大小
8.13.3 自适应高度的兼容 8.13.4 实例制作中的兼容问题 第9 章 一个英文网站的制作 9.1 分析效果图 9.2 切图 9.2.1 制作首页的切图 9.2.2 二级页面的切图 9.3 制作站点首页头部 9.3.1 首页头部的信息和基础样式的...
当一行文字超过DIV或者Table的宽度的时候，浏览器中默认是让它换行显示的，如果我们不想让他换行显示那要怎么办呢，下面为大家介绍下如何设置div+CSS设置一行内文字超过宽度不换行且不显示
最近在为学乐网开发图片显示功能时遇到一个问题：在一个table中有两行，上边显示图片（大小随机），下边显示对图片的相关说明（文字长度随机）
利用js来实现有一个缺点就是只能在页面刷新的时候才能调整图片的高度，不能随着浏览器的窗口大小变化来实现自适应。 二、我这次主要是用css来实现图片高度的自适应问题。 下面是所需要的代码 （这种方法是可以在图片...
Vue调整文字大小 Vue指令可根据元素宽度自动调整字体大小。 它使字体大小在灵活或响应式布局上具有灵活性。 ：调整浏览器视口的大小以查看实际效果 安装 通过NPM安装 $ npm install vue-resize-text --save 通过...
fontFlex是一个轻量级jQuery插件,根据屏幕/浏览器宽度动态更改字体大小。多用于响应或自适应的CSS布局。浏览器要求ie8以上版本，演示地址：http://www.jq22.com/jquery-info521
css相关 本文总结了前端面试题中，关于css部分 ，掌握这些 ，对你面试会有很大帮助。关于JS，浏览器，框架等后续... 设置一段文字的大小为6px10. css菊花图11. 关于em12. 关于vh, vw13. Flex布局14. overflow原理15. 实
本系统前台DIV+CSS编写，后台功能完整，图片展示支持自动幻灯...3.自由设置水印，可设置图片水印，与文字水印。智能识别图片大小打水印 4.后台设置缩略图大小，智能生成缩略图。 5.无限级分类，高度智能的分类管理,可
Viewport不局限于浏览器可视区域的大小，可能比浏览器的可视区域要大，也可能比浏览器的可视区域要小。 媒体查询 CSS媒体查询允许开发者基于浏览网站的设备的特性来应用不同的样式申明，最常用的特性是视口宽度。 ...
为你指定的图片打开一个自适应大小的弹出窗口 Sound 类别：Object 文件格式：mxp │ 1,862B 给网页添加背景音乐，可设置循环次数 Average Distribute 类别：Command 文件格式：mxp │ 2,828B 平均分布单元格...
使用前端转换方式在不支持emoji表情符号的设备和浏览器中使用图片显示emoji表情符号，转换后的表情符号可以自适应文字大小（最大不超过20px，如果需要自定义的图片尺寸，请参见'重新生成代码和表情图片'）。...
3.自由设置水印，可设置图片水印，与文字水印。智能识别图片大小打水印 4.后台设置缩略图大小，智能生成缩略图。 5.无限级分类，高度智能的分类管理,可设置显示顺序，可批量修改 6.图片管理通过审核功能可设置图片...
它是自适应的，可以在任何大小的屏幕上正常显示。 当文章没有指定缩略图时，它会显示随机缩略图。 你可以在后台自定义随机缩略图和浏览器站点副标题。 它支持文字LOGO和图片LOGO，你可以自行选择。 它还带有代码...
多列等高的问题 上例中有包含不同内容的 3 列，...必须意识到 Web 上没有固定的东东，乡民们有不同的屏幕分辨率，浏览器中的文字也可能被设置为任意大小，所有这些都会影响内容的高度。 分离列内容与其背景色 解决
3、浏览器版本的判断 236 4、编写跨浏览器兼容性的JS代码时，常用到的判断代码 237 5、JS 计算网页内容的宽与高 (浏览器的标准模式与怪异模式) 237 6、JS设置与查看网页的解析模式（值） 249 7、JS判断对象是否已经...
3.6 textarea自适应文字行数 3.7 禁止文本框的拷贝和粘贴 3.8 控制两个文本框只输其一 3.9 判断编辑器中是否包含特殊字符 3.10 判断文本中回车的数量 3.11 判断字符串中有多少汉字 3.12 去除字符串的前后空格 3.13 ...
3.6 textarea自适应文字行数 3.7 禁止文本框的拷贝和粘贴 3.8 控制两个文本框只输其一 3.9 判断编辑器中是否包含特殊字符 3.10 判断文本中回车的数量 3.11 判断字符串中有多少汉字 3.12 去除字符串的前后空格 3.13 ...
3) 增加新的右键菜单代替原来的浏览器菜单,同时增加右键格式引用及代码样式的功能。 4) 右键菜单的粘贴功能支持自动检测并提示清理WORD格式的功能。 5) 去掉一些无效的旧属性，清理了一些无用的JS代码。...
9、播放器大小自由设置，视频可以自适应窗口大小。 酷播V4.0版更新说明： 1、酷播跨平台多终端网页播放器V4.0版(原名极酷阳光播放器) 2、开放支持播放器右键自定义功能，用户可以自己定义右键信息及链接；(New) ...