<!DOCTYPE html>
css7-文本和其他

text-align
行内元素对齐方式，值为 左/中/右 对齐：left/right/center
.test{text-align:center;}

white-space
超出不换行
normal： 默认处理方式。
nowrap： 强制在同一行内显示所有文本，合并文本间的多余空白，直到文本结束或者遭遇br对象。
.test{white-space:nowrap;}
注意测试代码有时候写一大串不间隔的英文字母后不会自动换行，原因是英文网页排版默认一个单词不换行。

overflow
超出隐藏
visible:默认，不剪切内容
hidden:超出对象尺寸内容裁剪
.test{overflow:hidden;}
white-space和overflow结合，可以做一行文本超出隐藏，例如新闻列表的标题
.test{width:200px; line-height:25px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}/*text-overflow属性是超出截断后显示...符号*/

text-indent
文本缩进，像素或em，每行开头缩进
p{text-indent:2em;}/*每段首行缩进2字符，很少用*/

letter-spacing
字符间距
p{letter-spacing:2em;}
letter-spacing和line-height结合，可以把页面字符重叠至一个字。

vertical-align
行内元素在行内的垂直对齐方式
baseline 默认，基线对齐
px或百分比数字，基线算起的偏移量，可为负值
.test{vertical-align:10px;} /*文本向上偏移10px*/
本属性一般用于微调行内元素的上下距离，如果是做上标、下标，建议使用HTML标签<sub>、<sup>

<style>
span{
vertical-align:2px;
font-size:6px;
}
</style>
<div>
E = MC<sup>2</sup>;
</div>

<hr>

CSS属性-其他

/*注释*/
/*这是注释*/
/*
里面的所有代码和内容被注释掉，注意注释不能嵌套
*/

cursor
鼠标放上变化图标
.test{cursor:pointer;}/*鼠标放上手型*/

list-style
修改列表标签样式
.test{list-style:none;}/*去除列表li前面黑点*/

opacity
透明度，最小0，最大1，可以为小数
.test1{opacity: 0.5; filter:alpha(opacity=50);}/*IE6-8不支持opacity，使用filter滤镜实现*/

圆角：IE9以上支持
.test{border-radius:25px;}

<style>
a{text-decoration:none;color:#000;cursor:text;}
div{text-decoration:underline;color:#00f;cursor:pointer;}
</style>
<a href="http://www.baidu.com/">aaaaa</a>
<div>bbbbb</div>

<style>
.yuanjiao{
width:200px;
height:200px;
background:#f00;

border-radius:20px;
}
.yuanjiao2{
width:200px;
height:200px;
background:#0f0;
position:absolute;top:500px;left:100px;

opacity:0.5;
filter:alpha(opacity=50);
}

</style>
<div class="yuanjiao">aaaaaaaaaa</div>
<div class="yuanjiao2">bbb</div>

<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<br>

css-文本及其他的更多相关文章

  1. 第 15 章 CSS 文本样式[下]

    学习要点: 1.文本总汇 2.文本样式 3.文本控制 主讲教师:李炎恢 本章主要探讨 HTML5 中 CSS 文本样式,通过文本样式的设置,更改字体的大小.样式以及文本的方位. 一．文本总汇 本节课, ...

  2. 第 15 章 CSS 文本样式[上]

    学习要点: 1.字体总汇 2.字体设置 3.Web 字体 主讲教师:李炎恢 本章主要探讨 HTML5 中 CSS 文本样式,通过文本样式的设置,更改字体的大小.样式以及文本的方位. 一．字体总汇 本节 ...

  3. css文本格式详解

    一.css文本主体内容: 二.css文本详解:  1.文本缩进 语法: text-indent:<length>|<percentage> 默认值为0. 属性值详解: < ...

  4. CSS文本与连接

    CSS文本 CSS文本属性可以定义文本外观,通过文本属性,可以改变文本的颜色.字符间距.对齐文本.装饰文本.对文本缩进等等. 常用的文本属性 属性 描述 color 文本颜色 direction 文本 ...

  5. [CSS]文本属性（Text）

      CSS 文本属性(Text) 属性 描述 CSS color 设置文本的颜色. 1 direction 规定文本的方向 / 书写方向. 2 letter-spacing 设置字符间距. 1 lin ...

  6. CSS 文本、字体、链接

    CSS 文本属性可定义文本的外观. 通过文本属性,您可以改变文本的颜色.字符间距,对齐文本,装饰文本,对文本进行缩进,等等. 缩进文本 把 Web 页面上的段落的第一行缩进,这是一种最常用的文本格式化 ...

  7. CSS文本效果

    前面的话 本文将详细介绍CSS文本效果 凸版印刷效果 这种效果尤其适用于中等亮度背景配上深色文字的场景:但它也可用于深色底.浅色字的场景,只要文字不是黑色并且背景不是纯黑或纯白就行 [浅色背景深色文本 ...

  8. CSS 文本溢出时显示省略标记

    如标题所示... <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.o ...

  9. css文本超出省略号

    终于完成了项目了,今天我就分享自己在项目中比较实用的一些功能的实现,第一个就是纯css文本超出省略号 /* 文本单行超出省略号 */ .textels { overflow: hidden; text ...

  10. css文本属性用法总结

    稍稍总结了下css文本的一些属性用法,自己忘记的时候也可以用来查查,不用去查网站那么麻烦. 下面是部分总结,也希望对其他人有用 文本修饰 (1)text-decoration:  文本修饰(横线) 4 ...

随机推荐

  1. DEV GridControl 获取选中行的数据

    private void gridView1_FocusedRowChanged(object sender, DevExpress.XtraGrid.Views.Base.FocusedRowCha ...

  2. windows消息常量值

    WM_NULL = 0WM_CREATE = 1应用程序创建一个窗口WM_DESTROY = 2一个窗口被销毁WM_MOVE = 3移动一个窗口WM_SIZE = 5改变一个窗口的大小WM_ACTIV ...

  3. PL/SQL中字符串变量的分割转化

    在编写PL/SQL时,有时候我们需要处理这样一个输入的变量,它的格式是由多个值通过分隔符组成的字符串,如“1,2,3”,我们需要将这个变量加入到我们的SQL中,形成诸如in('1','2','3')的 ...

  4. jquery 做出专业的界面，SHOW 一下最近的成果~~~

    最近在项目中把整个UI框架重新做了一下,都是用Jquery实现的,没有使用EXT.EasyUI那一类的UI框架再也不用担心版权问题啦~~~~~~ 接下来我会在博客中把常用的功能分享出来,先上一下动态T ...

  5. LeetCode_Combinations

    Given two integers n and k, return all possible combinations of k numbers out of 1 ... n. For exampl ...

  6. 《Programming WPF》翻译 第5章 4.元素类型样式

    原文:<Programming WPF>翻译 第5章 4.元素类型样式 命名样式非常有用,当你得到一组属性并应用到特点的元素上.然而,如果你想要应用一个统一的样式到所有确定元素类型的实例, ...

  7. Linux上ld和ld.so命令的区别

    显然,ld链接器,它的生命周期是发生在compile-time的,它的一些参数是编译时期gcc给传递的,比如,指定需要链接什么库. ld.so命令的周期是发生在run-time的,名字叫动态链接器/加 ...

  8. Android-PullToRefresh 使用心得

    目前下拉刷新已经满大街都是,在自己的应用如果不使用这个模式的话,出门都不好意思和人家打招呼,该文章就是简单探讨下针对于 github 上的这个开源项目的使用心得. 为什么是它?因为在 stackove ...

  9. java.lang.OutOfMemoryError： unable to create new native thread(转)

    解决 - java.lang.OutOfMemoryError: unable to create new native thread 工作中碰到过这个问题好几次了,觉得有必要总结一下,所以有了这篇文 ...

  10. SATA1.0，2.0，3.0区别

    外观没区别,接口都一样,线也一样,就是传输速率不一样,控制芯片不一样SATA1.0理论传输速度为1.5Gbit/s SATA2.0理论传输速度为3Gbit/sSATA2.0理论传输速度为6Gbit/s ...