HTML结构css样式初识~2018年8月10日

HTML基本结构

<!DOCTYPE html> <!-- 文档申明-->
<html> 
	<head>
	</head>
	<body>
	</body>
</html>

head头部基本属性

<head>
	<title></title><!-- 标题 -->
	<meta charset="utf-8"> <!-- 字符集编码 -->
	<link rel="stylesheet" type="text/css" href=""><!-- Css外部样式导入 -->
	<link rel="shortcut icon" type="image/x-icon" href=""><!-- 标题图标 -->
	<style type="text/css"></style><!-- css内部样式 -->
</head>

CSS样式的三种表现方式

<a href="" style="color:red" /> <!-- 内联样式 直接在元素中描述样式 -->
<!-- 内部样式 在头文件直接描述样式 -->
<style type="text/css">
</style>
<!-- 外部样式 导入css样式文件-->
<link red="stylesheet" type="text/css" href="../css/dome.css">
优先级:内联样式>内部样式>外部样式

css基本选择器

<style type="text/css">
    <!-- ID选择器 -->
    #id{ color:yellow;}    
    <!-- 元素选择器 -->
    body{ color:red;}
    <!-- 类选择器 -->
    .class{ color:skyblue;}
    <!-- 属性选择器 -->
    a[href="https://www.baidu.com/"]{color:blue;}
</style>

手写作业链接

相关文章