【零基础学习web前端】CSS3-文本效果（文本阴影、自动换行）

Amy

【零基础学习web前端】CSS3-文本效果（文本阴影、自动换行）

【零基础学习web前端】教程目录导航

http://www.sufeinet.com/thread-24027-1-1.html

文本阴影（text-shadow）
text-shadow: h-shadow  v-shadow  blur  color;

• h-shadow    必写。水平阴影的位置，可以为负值。
• v-shadow    必写。垂直阴影的位置，可以为负值。
• blur             可选。模糊距离。
• color           可选。阴影颜色。
  

[CSS] 纯文本查看 复制代码

h1{
    text-shadow: 5px 5px 5px black;
}

[HTML] 纯文本查看 复制代码

<h1>苏飞论坛</h1>

效果


自动换行（word-wrap）
word-wrap 属性允许长单词或 URL 地址换行到下一行。
word-wrap :normal           只在允许的断字点换行（浏览器保持默认处理）
word-wrap :break-word    在长单词或 URL 地址内部进行换行。

[CSS] 纯文本查看 复制代码

div{
    width: 20em;
    border: 1px  solid  red;
    word-wrap: break-word;
}

[HTML] 纯文本查看 复制代码

<div>
        双十二促销【终身VIP】【全年最低价】:一次开通永久免费下载所有源码 绝对的全年最低价格。不会存在比这个价格更低的优惠活动了。 参与活动单击这里 [url]http://www.sufeinetsufeisufeisufeisufeisufeisufeisufeisufeisufeisufeiu[/url]
    </div>

效果：

如果是

[CSS] 纯文本查看 复制代码

word-wrap: normal;

效果：

站长苏飞

广告融入的不错，无处不在的感觉

liu

强烈支持楼主ing……

竹林风

支持楼主

惜

好的后台 一定要了解前端

范范

我只是路过打酱油的。