css美化网页元素

标签：css   body   责任   水平   site   中文   元素   一起   并发   

span标签

作用：能让某几个文字或词语凸显出来

DOCTYPE html>
html>
    head>
        meta charset="UTF-8">
        title>影视简介title>
        link rel="stylesheet" type="text/css" href="css/YSJJ.css"/>
    head>
    body>
        h2>花千骨h2>
        p>《花千骨》是由 a href="#">慈文传媒集团a>制作并发行，span id="ZhuYan">林玉芬、高林豹、梁胜权联合执导，霍建华、赵丽颖span>领衔主br />
            演，span class="cor1">蒋欣、杨烁span>特别出演，span id="ZY">张丹峰、李纯、马可、鲍天琦、安悦溪、徐海乔span>等主演的古装玄幻仙侠剧。br />
             该剧改编自fresh果果同名小说，讲述少女花千骨与长留上仙白子画之间关于责任、成长、取舍的纯爱虐br />
             恋[1] 。该剧于2014年5月6日开机，9月15日杀青，8月12日发布中文及英文版的预告片[2] 。 该剧于br />
             2015年6月9日起每周二、周三晚10点在 span class="cor1">湖南卫视span>的钻石独播剧场播出。[3] 2015年7月5日起，该剧播放br />
             时间已经改为每周日、周一晚10点。当天零点在爱奇艺同步更新。[4]p>
             img class="img1" src="img/img/1.jpg" />
        h2>主要演员h2>
        img class="img2" src="img/img/2.jpg" />
        img class="img2" src="img/img/3.jpg" />
    body>
html>

字体样式（font）的书写

• color: 设置字体颜色

  • color:red;

• font-size：设置文字的大小

  • font-size:14px;

• font-family：设置文字的字体

  • font-family: 宋体;

• font-style：设置字体是否斜体

  • font-style: italic; 斜体
  • font-style: normal; 不斜体

• font-weight：设置字体是否加粗

  • font-weight: bold; 加粗
  • font-weight: normal; 不加粗

• line-height:：设置字体的行高

  • line-height: 40px;

• font: 字体的样式属性一起设置

  • 顺序
    • font-style
    • font-weight
    • font-size/line-height
    • font-family
  • 案例
    • font: italic bold 28px/40px "微软雅黑";
    • font: 28px/40px "微软雅黑";

• text-indent：设置首行缩进

  • text-indent: 50px; 缩进50个像素

• text-align：设置文字水平对齐方式

• text-align: center; 水平居中

使用CSS的超链接样式设置伪类超链接在不同状态下的样式：

a:link 未单击访问时超链接样式

a:visited 单击访问后超链接样式

a:hover 鼠标悬浮其上的超链接样式

a:active 鼠标单击未释放的超链接样式

设置伪类的顺序：a:link->a:visited->a:hover->a:active

列表样式list-style：

none 无标记符号 list-style-type:none;

disc 实心圆，默认类型 list-style-type:disc;

circle 空心圆 list-style-type:circle;

square 实心正方形 list-style-type:square;

decimal 数字 list-style-type:decimal

背景属性

背景颜色background-color

背景图像background-image--语法:background-image:url(图片路径);

背景定位 background-position

背景重复方式(background-repeat)

css美化网页元素

标签：css   body   责任   水平   site   中文   元素   一起   并发   

原文地址：https://www.cnblogs.com/zl225/p/13197487.html