精华内容
下载资源
问答
  • css比较好看的字体样式
    千次阅读
    2021-08-04 07:44:54

    样式一:

    body {

    margin: 0;

    padding: 0;

    line-height: 1.5em;

    font-family: "Times New Roman", Times, serif;

    font-size: 14px;

    color: #000000;

    background: #f2e7ca url(images/templatemo_body.jpg) top center no-repeat;

    }

    样式二:

    body {

    background:#2f373a;

    font-family:Arial,Helvetica,sans-serif;font-size:100%;

    line-height:1em;color:#4e4e4e;

    min-width:920px;

    border-top:10px solid #0c0e0e

    }

    样式三:

    body {

    font-family:Arial,Helvetica,sans-serif;

    font-size:1em;

    vertical-align:middle;

    font-weight:normal

    }

    样式四:

    body

    {

    margin:0px;

    padding:0px;

    background-color:#E7EAEB;

    font-family:"微软雅黑","黑体","宋体";

    font-size:12px;

    height:36px;

    }

    样式五:

    body

    {

    font: .8em Arial, Tahoma, Verdana;

    background: #fff url(../images/bg.gif) repeat-x;

    color: #777;

    }

    样式六:

    body

    {

    width:auto; margin-top:12px;

    float:right; font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;

    font-size:11px;

    color:#999999;

    line-height:25px;

    letter-spacing:1px

    }

    样式七:

    body

    {

    width:auto;

    margin-left:1px;

    float:left;

    font-family:Arial, Helvetica, sans-serif;

    font-size:13px;

    color:#5f5f5f;

    line-height:35px;

    text-transform:uppercase

    }

    样式八:

    body {

    background: #e1e5e8;

    font-family: "Georgia", Tahoma, Sans-Serif;

    font-size: 12px;line-height: 18px;

    color: #888;

    }

    样式九:

    body

    {

    width:130px; height:20px;

    background:url(images/servicesbg.gif) 0 0 repeat-x #68EF00;

    color:#317400;

    font:18px/14px Georgia, "Times New Roman", Times, serif;

    margin:34px 0 0 37px;

    }

    样式十:

    body

    {

    display:block;

    width:94px;

    height:20px;

    background: url(images/serviceslink1bg.gif) 0 72% no-repeat #6DFD00;

    color:#01699F;

    font:13px/20px Georgia, "Times New Roman", Times, serif; text-decoration:none;

    }

    样式十一:

    body {

    margin: 0;

    padding: 0;

    line-height: 1.5em;

    font-family: Georgia, "Times New Roman", Times, serif;

    font-size: 12px;color: #33322e;background: #39443D url(images/templatemo_body_bg.jpg) repeat-x;

    /* background: #47443c url(images/templatemo_body_bg_2.jpg) repeat-x; */

    }

    样式十二:

    body {margin: 0;padding: 0;line-height: 1.5em;font-family: Tahoma, Geneva, sans-serif;font-size: 12px;color: #6f6f6f;

    background: #2ac5c0 url(images/templatemo_body_top.jpg) repeat-x;

    }

    样式十三:

    body {

    margin: 0;

    padding: 0;

    line-height: 1.5em;

    font-family: Verdana, Geneva, sans-serif;font-size: 11px;

    color: #ffffff;background: #005b7f;

    }

    样式十四:

    body {

    margin: 0;

    padding: 0;

    line-height: 1.7em;

    font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;

    font-size: 12px;color: #333333;

    background: #000000 url(images/templatemo_main_bg.jpg) repeat-y center;

    }

    样式十五:

    body {

    margin: 0;

    padding: 0;

    line-height: 1.7em;

    font-family: Verdana, Geneva, sans-serif;

    font-size: 12px;color: #707b84;

    background: #3e464d;

    }

    样式十六:

    body {

    margin: 0;

    padding: 0;

    line-height: 1.7em;

    letter-spacing: 1px;

    font-family: Georgia, "Times New Roman", Times, serif;font-size: 12px;

    color: #333;

    background: #e1d1d6 url(images/templatemo_body.png) repeat-x top;

    }

    样式十七:

    body {

    margin: 0;

    padding: 0;

    line-height: 1.7em;

    letter-spacing: 1px;

    font-family: Georgia, "Times New Roman", Times, serif;font-size: 12px;

    color: #333;

    background: #e1d1d6 url(images/templatemo_body.png) repeat-x top;

    }

    样式十八:

    body

    {

    background:url(images/bg.gif) repeat #000000;

    padding:0; font-family:arial, sans-serif; font-size:12px;

    margin:0px auto auto auto;

    color:#36322b;

    }

    样式十九:

    body

    {

    margin:0px;

    padding:0px;

    background:url(images/mainbg.gif) 0 0 repeat-x #F6F4E4;

    color:#6B6854;

    font:14px/18px "Trebuchet MS", Arial, Helvetica, sans-serif;

    }

    样式二十:

    body

    {

    font-family:Georgia;

    font-family:Arial;

    }

    更多相关内容
  • 1.指定字体:font-family (1)实用通用字体系列: 复制代码代码如下:body {font-family: sans-serif;} (2)制定字体系列: 复制代码代码如下: h1 {font-family: Georgia, <span xss=removed>serif;} 在所有 ...
  • 刚好公司要用到,需要纯css的,不用任何插件就可以显示很不错的字体 样式一: <style type="text/css"> .tb-js-yf-style{font-family: "Arial","Microsoft YaHei","黑体","宋体",sans-serif;} </style&...

    刚好公司要用到,需要纯css的,不用任何插件就可以显示很不错的字体

    样式一:

    <style type="text/css">
    .tb-js-yf-style{font-family: "Arial","Microsoft YaHei","黑体","宋体",sans-serif;}
    </style>
    
    样式一:
    <div class="tb-js-yf-style">京缘</div>
    <div class="tb-js-yf-style">JY</div>

     

    样式二:

    <style type="text/css">
    .tb-js-yf-style2{font: 12px/1.5 Tahoma,Helvetica,Arial,'宋体',sans-serif;}
    </style>
    
    样式二:
    <div class="tb-js-yf-style2">京缘</div>
    <div class="tb-js-yf-style2">JY</div>

     

    样式三:

    <style type="text/css">
    .jia-style{font: 14px/1.5 'Microsoft YaHei',arial,tahoma,\5b8b\4f53,sans-serif;}
    </style>
    
    样式三:
    <div class="jia-style">京缘</div>
    <div class="jia-style">JY</div>

    样式四:

    <style type="text/css">
    .ued-style{font: 12px/1 Tahoma,Helvetica,Arial,"\5b8b\4f53",sans-serif;}
    </style>
    
    样式四:
    <div class="ued-style">京缘</div>
    <div class="ued-style">JY</div>

    样式五:

    <style type="text/css">
    .ux-style{font-family: Helvetica, 'Hiragino Sans GB', 'Microsoft Yahei', '微软雅黑', Arial, sans-serif;}
    </style>
    
    样式五:
    <div class="ux-style">京缘</div>
    <div class="ux-style">JY</div>

     

    样式六:

    <style type="text/css">
    .ux-style2{font:12px/1 Tahoma,Helvetica,Arial,"\5b8b\4f53",sans-serif;}
    </style>
    
    
    样式六:
    <div class="ux-style2">京缘</div>
    <div class="ux-style2">JY</div>

    样式七:(主要是英文比较有特色)

    <style type="text/css">
    .geo-style{font:Georgia, serif;}
    </style>
    
    样式七:
    <div class="geo-style">京缘</div>
    <div class="geo-style">JY</div>

     

    样式八:(主要是英文比较有特色)

    <style type="text/css">
    .geo-style2{font:italic 1em Georgia, serif;}
    </style>
    
    样式八:
    <div class="geo-style2">京缘</div>
    <div class="geo-style2">JY</div>

     

     

     

     

     

     

     

     

    展开全文
  • CSS——CSS常用的字体样式

    千次阅读 2020-11-08 19:54:56
    CSS——字体样式 常用: font-family:字体 font-size:大小 font-weight:粗细 color:颜色 字体样式测试 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title...

    CSS——字体样式

    常用:

    • font-family:字体
    • font-size:大小
    • font-weight:粗细
    • color:颜色

    字体样式测试

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
        <style>
            body{
            font-family:楷体; /*字体,可以设置多个*/
            color:blue;  /*颜色*/
            }
            h1{
            font-size:30px;  /*字体大小*/
            color:red;
            }
            .active{
            font-weight:bold;  /*粗体  用<strong></strong>标签也可以实现*/
            }
            .first{
            font:oblique bolder 36px "楷体";  /*斜体  粗体  大小  字体*/
            /*可以把设计字体样式的语句写在一起,这样更方便*/
            }
    
    
        </style>
    
    </head>
    <body>
    
    <h1>故事介绍</h1>
    
    <p class="active">
        平静安详的元泱境界,每隔333年,总会有一个神秘而恐怖的异常生物重生,它就是魁拔!
        魁拔的每一次出现,都会给元泱境界带来巨大的灾难!即便是天界的神族,也在劫难逃。
        在天地两界各种力量的全力打击下,魁拔一次次被消灭,但又总是按333年的周期重新出现。
        魁拔纪元1664年,天神经过精确测算后,在魁拔苏醒前一刻对其进行毁灭性打击。
        但谁都没有想到,由于一个差错导致新一代魁拔成功地逃脱了致命一击。
        很快,天界魁拔司和地界神圣联盟均探测到了魁拔依然生还的迹象。因此,找到魁拔,彻底消灭魁拔,再一次成了各地热血勇士的终极目标。
    
    </p>
    <p class="first">
        在偏远的兽国窝窝乡,蛮大人和蛮吉每天为取得象征成功和光荣的妖侠纹耀而刻苦修炼,却把他们生活的村庄搅得鸡犬不宁。
        村民们绞尽脑汁把他们赶走。一天,消灭魁拔的征兵令突然传到窝窝乡,村长趁机怂恿蛮大人和蛮吉从军参战。
        然而,在这个一切都凭纹耀说话的世界,仅凭蛮大人现有的一块冒牌纹耀,不要说参军,就连住店的资格都没有。
        受尽歧视的蛮吉和蛮大人决定,混上那艘即将启程去消灭魁拔的巨型战舰,直接挑战魁拔,用热血换取至高的荣誉。
    
    </p>
    
    
    </body>
    </html>
    

    效果图

    在这里插入图片描述

    展开全文
  • 9款漂亮的纯css字体样式

    千次阅读 2021-02-04 23:20:16
    样式: 代码: <html> <head> </head> <style> body{ text-align: center; } .hcqFont{position:relative;letter-spacing:.07em;font-size:3em;font-weight:normal;margin:0 auto} ....

    样式:
    在这里插入图片描述
    代码:

    <html>
    <head>
    </head>
    <style>
        body{
        	text-align: center;
        }
        .hcqFont{position:relative;letter-spacing:.07em;font-size:3em;font-weight:normal;margin:0 auto}
        .hcqFont:before,.hcqFont:after{position:absolute;top:0;left:0;right:0}
        .hcqStyle1{color:hsl(184,80%,25%);text-shadow:0 0 1px currentColor,/*highlight*/-1px -1px 1px hsl(184,80%,50%),0 -1px 1px hsl(184,80%,55%),1px -1px 1px hsl(184,80%,50%),/*light shadow*/1px 1px 1px hsl(184,80%,10%),0 1px 1px hsl(184,80%,10%),-1px 1px 1px hsl(184,80%,10%),/*outline*/-2px -2px 1px hsl(184,80%,15%),-1px -2px 1px hsl(184,80%,15%),0 -2px 1px hsl(184,80%,15%),1px -2px 1px hsl(184,80%,15%),2px -2px 1px hsl(184,80%,15%),2px -1px 1px hsl(184,80%,15%),2px 0 1px hsl(184,80%,15%),2px 1px 1px hsl(184,80%,15%),-2px 0 1px hsl(184,80%,15%),-2px -1px 1px hsl(184,80%,15%),-2px 1px 1px hsl(184,80%,15%),/*dark shadow*/2px 2px 2px hsl(184,80%,5%),1px 2px 2px hsl(184,80%,5%),0 2px 2px hsl(184,80%,5%),-1px 2px 2px hsl(184,80%,5%),-2px 2px 2px hsl(184,80%,5%)}
        .hcqStyle2{display:inline-block;font-weight:bold;color:#def;text-shadow:0 0 1px currentColor,-1px -1px 1px #000,0 -1px 1px #000,1px -1px 1px #000,1px 0 1px #000,1px 1px 1px #000,0 1px 1px #000,-1px 1px 1px #000,-1px 0 1px #000;-webkit-filter:url(#diff1);filter:url(#diff1);/*background:#def;padding:0 .2em*/}
        .hcqStyle3{background: #EEE url(data:image/gif;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAAECAIAAAAmkwkpAAAAHklEQVQImWNkYGBgYGD4//8/A5wF5SBYyAr+//8PAPOCFO0Q2zq7AAAAAElFTkSuQmCC) repeat;text-shadow: 5px -5px black, 4px -4px white;font-weight: bold;-webkit-text-fill-color: transparent;-webkit-background-clip: text}
    	.hcqStyle4{color: transparent;-webkit-text-stroke: 1px red;letter-spacing: 0.04em;}
    	.hcqStyle5{color: transparent;background-color : blue;text-shadow : rgba(255,255,255,0.5) 0 5px 6px, rgba(255,255,255,0.2) 1px 3px 3px;-webkit-background-clip : text;}
    	.hcqStyle6{color: gold;letter-spacing: 0;text-shadow: 0px 1px 0px #999, 0px 2px 0px #888, 0px 3px 0px #777, 0px 4px 0px #666, 0px 5px 0px #555, 0px 6px 0px #444, 0px 7px 0px #333, 0px 8px 7px #001135}
    	.hcqStyle7{font-family:cursive;text-shadow:6px 2px 2px #333;color:deeppink}
    	.text-reflect-base{color: palegreen;-webkit-box-reflect:below 10px;}
    	.text{
    	    width: 300px;
    	    height: 200px;
    	    position: absolute;
    	    left: 50%;
    	    margin-left: -150px;
    	    background-image: -webkit-linear-gradient(left,blue,#66ffff 10%,#cc00ff 20%,#CC00CC 30%, #CCCCFF 40%, #00FFFF 50%,#CCCCFF 60%,#CC00CC 70%,#CC00FF 80%,#66FFFF 90%,blue 100%);
    	    -webkit-text-fill-color: transparent;
    	    -webkit-background-clip: text;
    	    -webkit-background-size: 200% 100%; 
    	    -webkit-animation: masked-animation 4s linear infinite;
    	    font-size: 35px;
    	}
    	@keyframes masked-animation {
    	    0% {
    	        background-position: 0  0;
    	    }
    	    100% {
    	        background-position: -100%  0;
    	    }
    	}
    </style>
    <body>
        <h1 class='hcqFont hcqStyle1'>hcqFont hcqStyle1</h1>
        <h1 class='hcqFont hcqStyle2'>hcqFont hcqStyle2</h1>
        <h1 class="hcqStyle3">hcqStyle3</h1>
    	<h1 class="hcqStyle4">hcqStyle4</h1>
    	<h1 class="hcqStyle5">hcqStyle5</h1>
    	<h1 class="hcqStyle6">hcqStyle6</h1>
    	<h1 class="hcqStyle7">hcqStyle7</h1>
    	<h1 class='text-reflect-base'>text-reflect-base</h1>
    	<div class="text"><p>text</p></div>
    </body>
    </html>
    
    展开全文
  • css怎么改字体样式

    千次阅读 2021-06-29 08:44:51
    CSS是一种定义样式结构如字体、颜色、位置等的语言,那么我们该如何使用css设置字体样式呢?下我们来看一下使用css字体样式的方法。css字体样式的方法:1、font-size指定字体大小,常用单位有em和px2、font-...
  • CSS字体样式

    千次阅读 2022-01-30 19:37:30
    CSS字体样式字体样式属性一、字体类型1.设置一种字体2.设置多种字体二、字体大小三、字体粗细四、字体风格五、字体颜色1、关键字2、16进制RGB值 字体样式属性 一、字体类型 font-family可以指定多种字体。使用多个...
  • CSS字体样式调整详解

    千次阅读 2022-01-29 19:20:49
    大家好,今天分享一下CSS字体样式调整 我们对文本样式做以下的调整 1.颜色 2.文本对齐的方式 3.首行缩进 4.行高 5.装饰 写HTMl代码: <!DOCTYPE html> <html lang="en"> <head> <meta charset...
  • 7款漂亮的纯css字体样式

    千次阅读 2020-11-10 10:57:04
    转载于:https://blog.csdn.net/aa19891204/article/details/81021591 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>...h1 class="vintage1">
  • CSS字体样式

    千次阅读 多人点赞 2020-06-21 14:10:43
    1. CSS字体样式属性 1.1 font-size:字号大小 font-size属性用于设置字号,该属性的值可以使用相对长度单位,也可以使用绝对长度单位。其中,相对长度单位比较常用,推荐使用像素单位px,绝对长度单位使用较少。具体...
  • 基于css3制作的一款恐怖惊悚文字字体样式动画特效,万圣节惊悚文字动画特效。
  • CSS字体样式有哪些

    2021-11-25 19:46:06
    设置字体的大小 font-size 设置字体风格 font-variant 设置小型的大写字母字体 font-family 设置字体名 font-weight 设置字体的粗细 字体大小font-size属性 font-size:绝对大小|相对大小...
  • css怎么自定义字体样式

    千次阅读 2020-11-12 19:26:49
    css自定义字体样式的方法:可以利用font属性来自定义字体样式,如【font-weight:normal;】。font-weight属性用于设置文本的粗细,如果要设置文本字体大小,可以使用font-size属性。 font 简写属性在一个声明中设置...
  • 设置字体样式的5中常用属性如下 1:color 设置字体颜色,也可以设置其他颜色 2:font-size 设置字体大小 (1)、设置的并不是文字本身的大小,在页面中,每个文字都是处在一个看不见的框中的 我们设置的font-size实际...
  • 主要为大家介绍下css下的字体样式,font的属性与写法,需要的朋友可以参考下
  • css中文字体样式代码

    千次阅读 2020-06-12 14:26:32
    { font-family:"Microsoft YaHei",微软雅黑,"MicrosoftJhengHei",华文细黑,STHeiti,MingLiu } 加上中文名“微软雅黑”是为了兼容opera 在css中使用英文表示法,以下附常见中文字体的英文名:
  • css怎么设置字体加粗样式

    千次阅读 2021-08-04 04:22:09
    css设置字体加粗样式的方法:首先创建一个HTML示例文件;然后在body中定义一些文字内容;最后通过“font-weight:bold;”或“font-weight:bolder;”属性设置字体加粗样式即可。本文操作环境:Windows7系统、Dell G3...
  • css字体样式属性有哪些

    千次阅读 2021-08-04 07:04:04
    css字体样式属性有:1、color是字体颜色;2、【font-size】字号大小;3、【font-family】字体;4、【font-weight】字体粗细;5、【font-style】字体风格。本教程操作环境:windows7系统、css3版,DELL G3电脑。css...
  • css字体样式属性有:1、font-size:字号大小。2、font-family:规定元素的字体系列。3、font-weight:字体粗细。4、font-style:字体风格。5、font:综合设置字体样式。.css字体属性说明:1、font-size:字号大小font...
  • css文本样式(一):css字体样式

    千次阅读 2021-05-05 17:57:51
    css字体样式 文字样式属性: 字体:font-family 文字大小:font-size 文字颜色:font-color 文字粗细:font-weight 文字样式:font-style font-family字体属性:定义元素内文字以什么字体来显示。 语法:font-...
  • css代码如下: { font-family:"Microsoft YaHei",微软雅黑,"MicrosoftJhengHei",华文细黑,STHeiti,MingLiu } 加上中文名“微软雅黑”是为了兼容opera 在css中使用英文表示法,以下附...网页字体样式华文宋体:ST
  • 1.font-style:文字样式。 取值:normal 正常的字体, italic 斜体字, oblique 倾斜的字体。 (此图片来源于网络,如有侵权,请联系删除! ) 2.font-weight:设置文本字体的粗细。取值范围为100-900.
  • css字体样式属性大全(内附实例)

    千次阅读 2020-07-31 00:08:53
    综合设置字体样式 font-size:字号大小 font-size 属性用于设置字体字号,该属性的值可以使用相对长度单位,也可以使用绝对单位长度,其中,相对单位比较常用,推荐使用像素单位px,绝对单位使用较少 可选参数值...
  • 手机端应用的CSS字体样式规范

    千次阅读 2019-06-26 11:24:38
    本人主要是前后端开发,设计不是很在行,在没有设计师的情况下,调字体样式真的很苦恼。这里整理一下自己通用的字体大小和颜色,方便后续直接使用。 这里是借鉴了微信小程序的视觉规范,主要是用于手机端H5应用、像...
  • 前端CSS3--字体样式

    千次阅读 2020-08-29 21:10:01
    一、font-family设置字体 sans-serif是专指西文中没有衬线的字体 例如:为网页中的文字设置字体为"宋体"。 <style type="text/css"> body{ font-family:"宋体",sans-serif; } 或 body{font-family:"Microsoft ...

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 156,813
精华内容 62,725
关键字:

css比较好看的字体样式