您的位置：首页 > 职场人生

赢在职场－WEB全栈开发－1-3CSS的位置

2016-05-28 09:08 429 查看

行内样式、内部样式、外部样式

***************************************************************************************

main.css

.ExternalStyle

{

width: 300px;

height: 50px;

background:blue;

} <!外部样式>

***************************************************************************************

<html>

<head>

<meta charset="utf-8">

<link href = "main.css" rel = "stylesheet"> <!Hypertext Reference的缩写，意思是超文本引用，引入外部样式，外部CSS引用；rel是relationship的英文缩写，REL属性用于定义链接的文件和HTML文档之间的关系；stylesheet，的意思就是样式调用>

<title>

抬头

</title>

<style>

.InternalStyle

{

width:400px;

height:50px;

background:green;

}

</style>

</head>

<body>

<!行内样式(Internal Style(internal |ɪnˈtɜːnl| adj
里面的、内部的；实际网页可能有上千个盒子，使用行内样式这种方式就不方便了>

<div style = "width:300px;height:100px;background:red">

Inline Style、行内样式、Internal Style

</div>

<!内部样式；内部样式只能用于某一个html内部，若若干个网页使用同一个样式，则很难维护>

<div class = "InternalStyle">

InternalStyle、内部样式

</div>

<!外部样式；通过链接引入>

<div class = "ExternalStyle">

ExternalStyle、外部样式

</div>

</body>

</html>

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航