html和CSS基础学习（三）

最新推荐文章于 2017-10-29 13:23:05 发布

MsStrbig

最新推荐文章于 2017-10-29 13:23:05 发布

阅读量466

点赞数

CC 4.0 BY-SA版权

分类专栏： HTML+CSS 文章标签：网页基础前端 html css

本文链接：https://blog.youkuaiyun.com/MsStrbig/article/details/77881226

HTML+CSS 专栏收录该内容

28 篇文章

订阅专栏

本文介绍了HTML中的定义列表及CSS的基本应用，包括长度单位、文本样式设置、颜色表示方法及字体设置等内容。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1：定义列表

标签为<dl>表示定义列表

<dl>

</dl>

dt 标签表示内容定义 dd表示对定义内容的描述例如

<dl>

</dl>

2：文本样式（CSS）

基本长度单位： px:表示像素 %：表示继承父元素样式的百分比单位

em 是相对于当前字体的单位//这个需要特别注意

.sn{

width:100px;

height:100px;

background-color:red;//背景颜色的范围不是字体，字体大小是font-size 颜色是color

}

.sm{

width:50%;

height:50%;

background-color:greenyellow ;//背景颜色的范围

}

</style>

<div class="sn">html

<divclass="sm">

</div>

设置的父元素的样式

子元素的样式继承来的

#sn{

font-size:10px

width:10em;

height:30em;

background-color:gold;

}这里面background-color是以em为基准的。一半字体的标准像素是16px

3:十六进制的RGB

颜色的单位：RGB表示的基本的三元素，红，绿，蓝；

一半颜色的浓度可以用0~255表示

background-color:#FF5500;用十六进制表示颜色；

background-color:rgb(50,30,100);可以用RBG（10,20,30）十进制表示；

background-color:rgb(50%,30%,100%);%可以表示色素.

4:字体

字体设置:可以分为字体样式设置和颜色设置

（1）设置字体颜色可以用color 设置，这个与背景

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<style type="text/css">
			.sn{
				width: 100px;
				height: 100px;
				background-color:red ;
				
			}
			.sm{
				width: 50%;
				height: 50%;
				background-color:greenyellow ;
			}
			#sn{
				font-size:20px 
				/*width: 10em;
				height: 30em;
				background-color:gold ;*/
			}
			body{
				font-size:100px ;
				font-family: "微软雅黑",宋体,arial;
			}
		</style>
	</head>
	<body>
		<div class="sn">
			<div class="sm">
		</div>
		</div>
		<div class="sq">
			我要睡觉了ghyfdjyfdidygvcx
			<div id="sn">
					开始睡着了abcdbg
                               <!--
                               	作者：offline
                               	时间：2017-09-07
                               	描述：此处可以看出ID选择器，优先级要大于元素选择器
                               -->
			</div>
		</div>
		
		
		
	</body>
</html>

颜色的设置是不同的！

font-size:20px 但并不是表示的是文件本身的大小，表示文件所在框框的大小。在计算机中一般字体的大小是16px为基准的

（2）由于每个游览器的不同，他们默认的字体是不同的，对中英文显示的是不相同的为了区别这个问题可以使用 font-familiy可以指定游览器显示的字体；

（3）例如：font-family: "微软雅黑",宋体,arial; arial表示的是英语字体显示

（4）游览器支持的字体必须是我们计算机本身具有的自己，我们可以在C盘/window/font查看自己计算机拥有的字体