
正文
css样式定义设置文字,css设置字体样式属性
提示:扫一扫查出行【扫一扫了解最新限行尾号】
复制提示
Css设置字体
link href="style.css" rel="stylesheet" type="text/css" 其中style.css是你外部css文件名 2.写在html页面的head/head里面 style type="text/css" *{font-size:10px;} //通配符是用于定义网页所有标签的样式 body{font-size:10px;} // 这个样式是用于定义body中的标签样式 //在html中,一般以上两种定义字体大小的方法都可以,*定义的范围会比较广一点, 你会发现很多网页有这么一行代码 *{margin:0; padding:0;} //这个是用于更改ie的3像素bug/style 3.二楼给的写法 body style="font-size:12px" 也是定义标签样式的一种方法,一般没学过css的初学者这样定义样式是比较方便的,但这样写管理起来很麻烦,代码冗杂,又长又臭,特别是代码多了以后,想修改就更麻烦了,而且代码也不美观,还可能会影响浏览速度....所以还是建议使用上面两种比较好,熟练以后就用第一种 4.其实还有很多定义样式的方法,网上找找资料,慢慢学习,不难的 你说的控制多层嵌套的表格,其实你可以给你要控制的单元格加个id或者class, 然后把他们的样式写进css里面 我简单写一下,嵌套就不写了,最讨厌表格了,实在是太麻烦了trtd class="type01"文字是红色的,14px/td //class定义的样式可以多次用 td id="type01"文字是黑色的,11px/td //id定义的样式只对一个标签有用/trtr class="type01" //用了上面的class样式 td这里面的文字是红色的,14px/td/tr在样式表中这样写他们的样式 ①.type01{ color:#FF0; font-size:14px;} //class="type01"的标签 #.type01{color:#000; font-size:11px;} //id="type01"的标签 // 写进css文件里面②style type="text/css"
相关问答
Q1: CSS如何设置文字字体
如果你想你网站上的文字看起来更加不一样,就必须要给网页中的标题、段落和其他页面元素应用不同的字体。你可以用font-family属性在CSS样式里设置字体,如: font-family:Arial; 但是设置的这种字体,你电脑上必须装有该字体,否则将按原字体样式显示。当然,也可以写上多种字体,当对方浏览你的网站,没有安装第一种字体时,浏览器就会在列表中继续往上搜寻,直到找到有适合的字 体为止,像这样: font-family:Arial,Helvetica,sans-serif; 在上例中,Web浏览器会先看看是否安装了Arial字体。如果安装了,那么就用Arial字体显示;如果没有安装,浏览器就会继续寻找Helvetica字体;如果还是没有找到,最后它就会指定一种通用的字体--sans-serif。如果字体的名称中包含多个单词时,则必须用双引号(“”)将它们括起来,如: font-family:"Times New Roman",Times,serif; 以下就介绍几种常用的font-family字体类型组合,每一列的最后都包含一种通用的字体。 1、Serif字体:最适用于冗长的文字信息,因为读者都会觉得这种字体使字母主笔划的结尾处会有一些细小的“足”,能够比较有效地引导人们的视线从一个字母一到到下一个字母,阅读起来感觉更加轻松。serif字体包括:Times,Times New Roman、Georgia。 2、Sans-serif字体:它看起来干净而简洁,所有经常被用在标题上。Sans-serif字体包括:Arial、Helvetica、Verdana和Formata。 3、Monospaced字体:它经常用于显示计算机代码,它每个字母都是等宽的。
Q2: 如何对文本进行css样式设置
color属性:设置文本文字颜色。用法如下:
color:颜色值;
color属性可以设置的合法颜色值包括:16进制颜色值(例:#ffffff),rgb颜色值【例:rgb(0,0,0)】,rgba颜色值【例:rgb(0,0,0,0.5),0.5表示透明度】,hsl颜色值【例:hsl(120,65%,75%)】,hsla颜色值【hsl(120,65%,75%,0.3),0.3表示透明度】。
2、css文本文字行高(行间距)的属性
line-height属性:设置行间的距离(行高)。用法如下:
line-height:值;
具体cssline-height属性是如何设置文本文字的行间距,大家可以参考之前的文章【css如何设置行间距?css文本文字的行间距设置】,希望对大家有所帮助。
3、css设置文本文字的水平对齐方式的属性
text-align属性:设置元素中的文本文字的水平对齐方式。用法如下:
text-align:left||right||center||justify;
left:设置文本文字左对齐。默认值:由浏览器决定。
right:设置文本文字右对齐。
center:设置文本文字居中对齐。
justify:实现两端对齐文本效果。
4、css文本缩进属性
text-indent属性:设置文本缩进。
具体csstext-indent属性是怎样设置文本缩进的,大家可以参考【css如何实现首行缩进效果?text-indent属性实现首行缩进】。
5、设置文本文字装饰效果
text-decoration属性:定义添加到文本的修饰。
说明:
这个属性允许对文本设置某种效果,如加下划线。如果后代元素没有自己的装饰,祖先元素上设置的装饰会“延伸”到后代元素中。
用法:
text-indent:none||[underline(下划线)||overline(上划线)||line-through(中划线)]||blink;
none:默认值,定义标准的文本。
underline:定义文本下的一条线。
overline:定义文本上的一条线。
line-through:定义穿过文本下的一条线。
blink:定义闪烁的文本。
6、文本字符的大小写转换属性
text-transform属性:控制文本字符的大小写。
用法:
text-transform:uppercase(全大写)||lowercase(全小写)||capitalize(首字母大写)||none;
7、文本文字间距的属性
word-spacing属性:设置文字或单词之间的间距,单词之间的间距=word-spacing+空格大小。
letter-spacing属性:设置字母间的间隔。
8、文本文字阴影的属性
text-shadow属性:向文本文字设置阴影
Q3: 使用CSS定义文字字体
做了一个导航横向代码里面的鼠标未移上去时的字体怎么也改不了颜色和大小
希望高手帮个忙看看怎么改CSS代码:#top1
{
WIDTH:
969px;}/*---------------------页面基础定义----------------------------------*/body,td,th
{
font-family:
Tahoma,
Verdana,
Arial,
sans-serif;
font-size:
12px;
color:
#000000;}body
{
margin-left:
0px;
margin-top:
0px;
margin-right:
0px;
margin-bottom:
0px;}/*---------------------链接定义----------------------------------*/a
{
color:
#FFFFFF;
text-decoration:
none;}a:hover
{
color:
#000000;
text-decoration:
none;}a:active{
color:
#FF0000;
text-decoration:
none;}/*---------------------菜单样式----------------------------------*/#menu{
height:32px;
margin-top:1px;
background-color:#90D311;}#menu
ul{
margin:auto;
width:778px;
height:32px;
list-style-type:none;
padding:0px;
margin-top:0px;
margin-bottom:0px;}.m_li{
float:left;
width:88px;
line-height:32px;
text-align:center;
margin-right:-2px;
margin-left:-2px;}.m_li
a:link{
display:block;
color:#FFFFFF;
width:85px;}.m_line{
float:left;
width:1px;
height:32px;
line-height:32px;
/*ff下有效(图片垂直居中)*/}.m_line
img{
margin-top:expression((
32
-
this.height
)
/
2);
/*ie下有效(图片垂直居中)*/}.m_li_a{
float:left;
width:85px;
line-height:32px;
text-align:center;
padding-top:3px;
font-weight:bold;
background-image:url(
);
position:relative;
height:32px;
margin-top:-3px;
margin-right:-2px;
margin-left:-2px;}.m_li_a
a{
display:block;
color:#FF0000;
width:85px;}.smenu{
width:810x;
margin:0px
auto
0px
auto;
padding:0px;
list-style-type:none;
height:32px;
FLOAT:
left;}.s_li{
line-height:32px;
FLOAT:
left;
width:auto;
display:none;
height:32px;
}.s_li_a{
line-height:32px;
width:auto;
display:block;
height:32px;
FLOAT:
left;}
Q4: CSS字体与文本样式详解
学习导航
1、css中的长度与颜色
2、css中的文字属性
3、css中的文本属性
1、文字样式属性
font-family 字体属性
作用:元素内文字以什么字体来显示
语法:font-family:[字体1],[字体2],[......];
说明:含空格字体名和中文,用英文引号(")括起;多个字体用英文逗号隔开;引号嵌套,外使用双引号,内使用单引号。
font-size 文字大小
作用:元素内文字大小
语法:font-size:绝对单单位,相相对单位
color 文字颜色
语法:颜色名|十六进制|RGB
font-weight 文字粗细
语法:font-weight:normal 正常 | bold 加粗 | bolder 加粗 | lighter 细体 | 100-900
说明:默认值:normal 400等同于normal,而700等同于bold
font-style 文字样式
作用:为元素内文字设置样式
语法:font-style:normal 正常显示 | italic 文字倾斜 | oblique 文字倾斜(基本不用)
font-variant 字体变形
作用:设置元素中文本为小型大写字母
语法:font-variant:normal 正常显示| small-caps 将英文大小写字母调成为同宽
font 属性简写
语法:font:font-style font-variant font-weight font-size/line-height font-family;
说明:值之间空格隔开,注意书写顺序。
2、CSS文本样式
text-align
作用:设置元素内文本的水平对齐方式
语法:tex-align:left 左对齐 | right 右对齐 | center 居中对齐 | justify 两端对齐
注意:该属性对块级元素设置有效
line-height
作用:设置元素中文本行高
语法:line-height:长度值 | 百分比
说明:一行文字的高度,行高指文本行的基线间的距离
文字基线
注意:基线并不是汉字文字的下沿,看图理解自行理解
行高和行距
行高:基线到基线的距离
行距:底线到顶线的距离
注意:看图自行理解
行框和行内框
注意:看图自行理解
vertical-align
作用:设置元素内容的垂直方式
语法:vertical-align:baseline | sub | super | top | text-top | middle | bottom | text-bottom | 长度 | 百分比
注意:看图自行理解
text-indent 首行缩进
3、文本样式属性
text-transform: capitzlize 首字母大写 | uppercase 字母大写 | lowercase 字母小写 | none 正常
text-decoration: underline 下划线 | overline 上划线 | line-through 删除线 | none 正常
综合实操案例
如果您觉得有用,记得在下方点赞、关注、留言,我会定期奉 上更多的惊喜哦,您的打赏支持才是我继续努力的动力,么么哒。
每日分享在学习过程中总结的学习经验,学习笔记,笔试题,HTML,CSS,JavaScript,jQuery教程,Vue教程,PHP教程,TinkPHP教程等,望大家能以学习为目的,每天阅读一篇文章,了解身边的技术。陪有梦想的人一起成长!







