zhangyaochun
- 浏览: 2614467 次
- 性别:
- 来自: 北京
-
文章分类
- 全部博客 (1286)
- js-oop (2)
- js-window (10)
- js-event (19)
- js-string (37)
- js-array (27)
- js-page (4)
- js-dom (62)
- js-lang (8)
- js-number (7)
- js-platform (3)
- js-object (15)
- js-element (3)
- js-browser (7)
- js-url (6)
- js-date (10)
- css基础 (48)
- css优化 (15)
- html基础 (17)
- html标签 (19)
- js基础 (117)
- js-兼容性差异 (33)
- js引擎 (3)
- js性能 (14)
- json (6)
- jQuery源码浅析 (43)
- web mobile开发资料 (78)
- js跨域 (2)
- html5 (74)
- html5-canvas (7)
- css3 (53)
- 浏览器 (5)
- api设计学 (3)
- js-加载 (3)
- linux (37)
- 架构师 (1)
- php (2)
- self开发的脚本库--凤凰 (2)
- web应用名词 (6)
- javascript新特性翻译 (8)
- ajax (6)
- jQuery动画效果 (7)
- prototype的解读 (13)
- 优秀插件翻译 (1)
- css解决方案 (26)
- 数据库 (2)
- english daily (59)
- 浏览器内核探究 (1)
- jQuery插件介绍 (9)
- jquery基础篇 (26)
- chrome浏览器问题整理 (14)
- js选择器那些事 (3)
- 前端框架 (26)
- Firefox私有属性 (11)
- webkit私有属性集合 (17)
- 书籍推荐 (21)
- 数据结构 (1)
- 网站建设相关 (7)
- 好文翻译 (2)
- 个人作品 (3)
- kissy的解读 (4)
- css-layout（布局研究） (5)
- less研究 (1)
- YUI探究 (1)
- hash探究 (1)
- js动画 (7)
- 前端面试题 (37)
- css书写规范 (1)
- js模板引擎 (6)
- js模块化 (19)
- 编写高质量代码 (3)
- 性能探究--应用协议 (2)
- 前端图像处理 (19)
- Mac OS相关 (21)
- 正则表达式 (11)
- 离线应用相关 (0)
- 前端工具 (65)
- nodeJS (55)
- jquery优化篇 (2)
- 设计模式探究系列 (3)
- windows7 (2)
- IE10 (10)
- 微博开放平台探究 (2)
- 常用web服务接口 (1)
- 数据存储相关 (8)
- 零时文件 (2)
- jQuery Mobile (16)
- backbone (15)
- underscore (22)
- sass (11)
- android (3)
- phonegap (10)
- IE私有 (11)
- qwrap (8)
- git (14)
- chrome extensions (5)
- freemarker (11)
- angularJS (3)
- seo (2)
- markdown (3)
- css动画 (4)
- 安卓开发 (2)
- React (7)
- 活动页技术 (1)
- 网络安全 (3)
- grunt (7)
- Lo-Dash (3)
- 前端国际化 (4)
- 版本控制 (2)
- 盒模型 (4)
- 微信开发 (1)
- Mock数据工具 (1)
- sails (1)
- vim (1)
- js-color (1)
- iOS 基础 (43)
最新评论
-
jertom：
<div id="showInfo" ...
addEventListener等事件监听的参数细谈 -
乌托邦国王：
引用[u][/u]
css3动画属性系列之transform细讲移动translate -
hvang1988：
能提供附件下载吗，找不到js库，google封了访问不了
Syntaxhighlighter---代码高亮插件介绍 -
sscsacdsadcsd：
我的天 那到底是为什么function是object我看und ...
typeof func ==='function'的疑惑 -
wkjiangwk：
试了，没用，你们从不去测试。
介绍一下x-webkit-speech -------实现语音输入
CSS text-transform属性
-------------控制文本的大小写。
| none |
| yes |
| CSS1 |
| object.style.textTransform="uppercase |
浏览器支持：
- 所有浏览器都支持text-transform属性。
- 任何版本的IE（包括IE8）都不支持属性值“inherit”。
可能的值
| none | 默认。定义带有小写字母和大写字母的标准的文本。 |
| capitalize | 文本中的每个单词以大写字母开头。 |
| uppercase | 定义仅有大写字母。 |
| lowercase | 定义无大写字母，仅有小写字母。 |
| inherit | 规定应该从父元素继承 text-transform 属性的值。 |
1
顶
顶
0
踩
踩
分享到：
发表评论
-
css 基础之 em 与 rem
2017-02-27 14:03 974em 和 rem 都是相对单位，由浏览器转换为 ... -
css之counter-increment
2014-03-31 18:40 1250CSS 之 counter-increment ... -
css基础之clip属性
2014-03-06 22:03 1105本文介绍一下css的clip属性： ... -
css之initial
2013-11-02 21:04 1139本文来自：https://developer. ... -
position为relative的限制
2013-10-25 15:39 1400本文主要来自：http://www.pl ... -
css opacity属性
2013-04-10 17:12 0内容参考：http://www.dreamd ... -
css基础之text-decoration
2013-02-26 16:19 1408前言： 先看一个app的效 ... -
css伪元素之:first-line
2013-01-15 14:10 1366:first-line -- ... -
css伪元素之:first-letter
2013-01-15 14:11 1338:first-letter ... -
css伪元素之:after
2013-01-14 15:40 1472:after --- ... -
css伪元素之:before
2013-01-14 15:32 1572:before -- ... -
css之ime-mode
2012-08-02 16:21 1854css之ime-mode ---------- ... -
CSS unicode-bidi属性
2012-05-27 17:27 2088CSS unicode-bidi属性 un ... -
整理部分IE hack
2012-05-19 19:25 1516前面也简单地写过一篇简单整理IE的hack,但是那篇只是简单地 ... -
浅谈css3的书写顺序
2012-05-11 16:04 1598前言： 最近一直在写css规范的文档，关于 ... -
热门前端面试题之link与import方式的区别
2012-05-11 13:58 2203写css规范的文档的时候，很多人都会推荐css文件的引入方式尽 ... -
css vertical-align属性
2012-03-25 11:30 1694CSS vertical-align 属性 -- ... -
css伪类
2012-02-16 20:46 1549CSS 伪类 (Pseudo-classes) ... -
css后代选择器
2012-02-16 20:47 1541CSS 后代选择器 ----------- ... -
css相邻兄弟选择器
2012-02-14 14:56 1969CSS 相邻兄弟选择器 ------- ...
相关推荐
"text-transform-loader"就是这样一款专为Webpack设计的加载器，它主要用于处理和转换JavaScript模块中的文本内容。在深入理解这个加载器之前，我们先来了解一下Webpack的基本概念。 Webpack是一个模块打包工具，它...
这时候我们就需要text-transform属性了。好了废话不多说，直接看例子吧。 CSS代码： 复制代码代码如下: /*首字母大写*/ .a {text-transform:capitalize;} /*全都是大写*/ .b {text-transform:uppercase;} /*全都是...
CSS文本装饰和文本转换 ... 在正文中尝试了text-decoration和text-transform关键字。 这些关键字有很多功能，但是对于修饰，我选择了下划线，对于转换，我选择了小写字母。 这些关键字还有很多可以做的尝试。
标题中的“css3-text-bubble-tips”暗示了这是一个关于CSS3实现文本气泡提示的教程或示例集合。在Web开发中，文本气泡通常用于创建提示、通知或者对话框，它们通常有一个指向相关元素的箭头。CSS3是CSS（层叠样式表...
在CSS中，`text-shadow`是一个非常有用且富有创意的属性，它允许开发者为文本添加阴影效果，从而增强页面的视觉吸引力。通过调整阴影的位置、模糊半径和颜色，可以创造出各种不同的效果，如基础的阴影、辉光、浮雕...
### CSS Text 属性详解 #### 一、前言 CSS（层叠样式表）作为网页设计中的重要组成部分，主要用于控制页面元素的布局与外观。在众多的CSS属性中，文本相关的属性占据了重要的地位，它们能够帮助设计师精细地调整...
总结起来，纯CSS文本旋转和动画涉及到`transform`属性、`rotate()`函数、`transform-origin`、`@keyframes`规则以及可能的浏览器前缀。通过熟练掌握这些知识点，开发者可以创造出各种动态、富有表现力的文本效果，...
对于3D变换，我们需要引入`transform-style`和`perspective`属性。`transform-style: preserve-3d;`确保子元素在3D空间中保持其三维结构，而`perspective`属性定义了观察者与3D元素之间的距离，影响3D变换的深度感。...
为了创建立体纹理文字特效，我们需要对每个字母分别应用`rotate()`，并结合其他CSS3属性，如`perspective`（透视）、`transform-style`（保持子元素3D空间）和`backface-visibility`（背面隐藏）。 `perspective`...
6. **文字特效**：CSS3.0支持文字阴影（`text-shadow`）、文字渲染（`text-rendering`）和文字大小写转换（`text-transform`）等，使文字更具吸引力。 7. **响应式设计**：媒体查询（`media queries`）允许我们根据...
文本属性中，`text-align`用于文本对齐，`text-decoration`控制装饰线，如下划线，`text-indent`设置首行缩进，`text-transform`改变文本大小写，`white-space`处理空白字符，`word-spacing`和`letter-spacing`调整...
- **`text-transform`**：设置文本转换（如大写、小写）。 - **`white-space`**：设置空白符处理方式。 - **`line-height`**：设置行高。 #### 分页 - **`page-break-inside`**：控制分页符是否出现在元素内部。 - ...
但仅用`text-shadow`无法实现3D效果，要达到3D文本阴影，我们需要利用CSS3的其他属性，如`transform`和`perspective`。`transform`属性可以改变元素的形状、大小和位置，而`perspective`则为元素及其子元素创建3D...
font color font-family font-size font-size-adjust font-stretch font-style font-weight text-decoration text-underline-position text-shadow font-variant text-transform line-height letter-spacing word-...
是插件，可让您在CSS中使用速记text属性。 /* before */ section { text : bold center uppercase dimgrey 1.25 em 1.5 .05 em ; } article { text : 1.25 em * .05 em ; } /* after */ section { font-weight ...
1. 文字元素与3D变换：首先，我们需要一个包含文字的HTML元素，并为其设置`transform-style: preserve-3d;`，这样其子元素也会在3D空间中保留它们各自的3D变换。 2. 文字阴影：使用`text-shadow`属性可以创建文字的...
CSS3扩展了文本装饰，如`text-decoration-line`、`text-decoration-style`和`text-decoration-color`，允许更精细的控制下划线、上划线、删除线等。例如： ```css a { text-decoration-line: underline; text-...
text-shadow:1px 1px 1px rgba(151,24,64,0.2); -webkit-transition:all 0.5s; -moz-transition:all 0.5s; transition:all 0.5s; } #st-control-1,#st-control-1 + a{ left:0%; } #st-control-2,#st-control-2 ...
transform: translateY(4px); /* 按钮按下时产生下陷效果 */ } ``` 此外，为了使按钮在不同的屏幕尺寸上保持良好的显示，可以使用响应式设计。通过媒体查询（@media）可以根据设备的视口宽度调整按钮的样式： ```...