`
mrstanglu
  • 浏览: 41152 次
  • 性别: Icon_minigender_2
  • 来自: 郑州
社区版块
存档分类
最新评论

使用css设置字体的透明度及艺术字代码

CSS 
阅读更多
使用css设置字体的透明度及艺术字代码
2006/10/28 下午 06:28

<div   style="height:   60;   background-color:   red;   filter:alpha(opacity=20);">meizz</div>   
放td容器里面   
  <table   width="100%"     border="0"   cellspacing="0"   cellpadding="0">   
      <tr>   
          <td     style="filter:alpha(opacity=50)">test</td>   
      </tr>   
  </table>   
    
  或者可以设置整个body的透明度   
  body   {filter:alpha(opacity=50)} 

  alpha   透明滤镜 

艺术字代码      
发光文字代码   

</textarea><table style="FILTER: glow(color=#6699FF,direction=2)">   

<font color=#ffffff size=2>你要的文字</font>    

</table>   

其中color 是阴影的颜色,可以配合网页色调改变,direction 是设置阴影的强度。font color是原字体的颜色。   

3D文字效果:  代码:  
<style type="text/css">      
.3dfont { FILTER: glow(color=ffffff,strength=0) shadow(color=cccccc,direction:135); POSITION: relative; WIDTH: 100% }       
</style>      
<table border="0" width="100%">      
<tr>      
<td width="100%" class="3dfont"><font color="#008040">文字</font>    

浮雕的文字   
</textarea><table style="FILTER: dropshadow(color=#6699FF, offx=1, offy=1, positive=1);">    

<font color=#0000FF>你要的文字</font>    

</table>    
color是阴影的颜色,可以配合网页色调改变,positive是设置阴影的强度。offx;offy是设置的阴影和文字的距离;font color是原字体的颜色。   

阴影的文字   
</textarea><table style="FILTER: dropshadow(color=#cccccc, offx=2, offy=2, positive=2);">    

<font color=#6CABE7 size=2>你要的文字</font>    

</table>   

文本框字体   

</textarea><TEXTAREA STYLE="font:12px;font-family:Verdana;color:#666666">输入内容   

注:字体(font-family)还可以选用Arial,Tahoma等等;color可自行设定

分享到:
评论

相关推荐

    CSS3实现3D折叠字体效果代码.zip

    【CSS3实现3D折叠字体效果】是一种利用现代浏览器支持的CSS3技术来创建具有立体感和动态视觉效果的文字展示方式。在网页设计中,这种效果可以为网站增添独特的风格和吸引力,尤其适用于创意型或者艺术类的网页设计。...

    css3高亮图片文字显示效果

    我们可以使用`opacity`或`brightness`调整图片的透明度或亮度,使得图片在初始状态呈现出暗淡的效果。例如: ```css img { filter: brightness(60%); } ``` 当鼠标悬停在图片上时,我们可以使用`:hover`伪类来...

    简洁透明网格css模板

    透明网格CSS模板的核心在于其透明度的应用,通过调整元素的`opacity`或使用`rgba()`颜色值,设计师可以创造出半透明的效果,使得背景图片或其他元素可以透过网格层隐约可见,增加层次感和深度。此外,这种透明效果还...

    纯CSS样式透明水滴文字特效.zip

    5. **透明度(Opacity)**:调整文字和背景的透明度,模拟水滴的透明质感。 6. **CSS滤镜(Filter)**:可能使用模糊滤镜(blur)为背景添加水雾效果,增强水滴的视觉效果。 7. **CSS布局**:如Flexbox或Grid,用于...

    css3创意气泡文字标签布局动画特效

    在这个项目中,开发者可能定义了一系列关键帧,如0%, 50% 和100%,在这些阶段分别设置了气泡的大小、位置、颜色以及透明度,以产生平滑的动画效果。例如: ```css @keyframes bubble-animation { 0% { transform...

    DIV+CSS文字阴影的一个效果

    在这个例子中,阴影向右下角偏移了2像素,具有3像素的模糊半径,颜色为半透明的黑色(50%的透明度)。 为了更好地理解并实践这个效果,我们可以创建一个元素,并为其应用上述样式: ```html &lt;!DOCTYPE html&gt; ...

    CSS实现背景图片透明而文字不透明效果的两种方法

    这种方法通过使用 `rgba()` 函数设置背景颜色的透明度来实现。我们为背景图片创建一个父级容器,然后为包含文本的子级容器设置一个带有半透明白色的背景。这样,文字将保持完全不透明,而背景会呈现出透明度。例如...

    CSS禅意花园源代码

    除此之外,还会涉及到CSS3的新特性,如渐变(gradients)、阴影(shadows)、圆角(border-radius)、透明度(opacity)、过渡(transitions)、动画(animations)以及媒体查询(media queries),这些都是实现现代...

    css3淡淡的雾气飞过动画特效

    2. **设置样式**:接着,为这个元素添加样式,包括大小、位置和背景颜色(或透明度),使其看起来像雾气: ```css .fog { position: absolute; width: 100%; height: 100%; background-color: rgba(255, 255, ...

    艺术设计CSS网页模板

    此外,使用CSS可以实现图像的透明度、形状和滤镜效果。 7. **优化与性能**:优秀的CSS模板会考虑代码的可读性、可维护性和性能。通过合理组织CSS代码、减少冗余、利用CSS预处理器(如Sass或Less)以及优化图像,...

    CSS3 SVG霓虹灯文字特效.zip

    【CSS3 SVG霓虹灯文字特效】是一种在网页设计中广泛应用的视觉效果,它通过结合CSS3和SVG(Scalable Vector Graphics)技术,创造出类似传统霓虹灯管的动态发光文字,为网页增添现代感和艺术气息。这种特效不仅在...

    CSS3 Animation文字动画特效.zip

    6. **闪烁效果**:利用`animation`结合透明度变化,让文字忽明忽暗,吸引视线。 7. **路径运动**:借助`animation`与`svg`路径,让文字沿着预设路径移动。 这些特效的实现通常包括以下几个步骤: 1. 定义动画:使用...

    纯CSS3实现的3D镂空文字特效源码.zip

    我们可以分别对文字的前后两个伪元素设置不同的颜色和透明度,以达到镂空效果。 3. **阴影(Box Shadows)**:`box-shadow`属性可以为元素添加阴影效果,通过调整阴影的偏移量、模糊半径和颜色,可以增强3D效果,使...

    CSS禅意花园(源代码)

    3. **CSS样式控制**:通过控制文本样式(如字体、行高、对齐方式)、颜色方案(使用颜色、渐变和透明度)、背景图片等,可以实现丰富的视觉效果。例如,文件094可能展示了如何巧妙运用背景图片和颜色来营造特定氛围...

    CSS水墨按钮动画特效.zip

    6. 如果使用SVG,将水墨效果的图形作为SVG元素插入,并通过CSS调整其透明度、位置等属性,配合动画实现水墨扩散效果。 在实际应用中,开发者可以根据需要调整动画的速度、颜色、扩散范围等参数,以适应不同场景和...

    25个高级CSS技巧教程

    9. **使用CSS透明实现的各种特效**:通过`opacity`和`rgba`颜色模式,可以创建半透明的菜单、水印效果等,增加设计的层次感和深度。 10. **模糊的背景效果**:利用CSS的`backdrop-filter`属性,可以创建模糊的背景...

    CSS禅意花园-源代码

    - **颜色模式**:了解RGB、HSL、Hex等颜色表示方法,以及透明度(opacity)的使用。 - **字体样式**:字体家族、大小、行高、字间距等属性,以及Web安全字体和自定义字体的引入。 - **背景属性**:背景颜色、图片...

    css2.0使用手册

    此外,CSS2.0还支持透明度控制,通过opacity属性可以实现元素的透明效果。 定位和布局是CSS2.0中的关键特性。position属性(如static、relative、absolute、fixed)用于定义元素的定位方式,z-index则用于决定层叠...

    纯CSS3带阴影效果的剪纸文字动画特效源码.zip

    `会创建一个向右下角偏移2像素,模糊半径为5像素的黑色阴影,其中`rgba(0, 0, 0, 0.5)`表示颜色的透明度。 剪纸效果通常涉及到元素的`clip-path`属性,这是一个非常强大的工具,可以用来定义元素的可见区域。通过...

    CSS3实用指南(stunningCSS3) 代码

    CSS3新增了更多颜色模式(如HSL和HSLA),以及透明度支持。此外,`text-shadow`为文字添加阴影,`text-decoration`允许设置下划线、上划线等装饰效果。 8. **响应式设计** `media queries`是实现响应式设计的关键...

Global site tag (gtag.js) - Google Analytics