个人HTML笔记一917

时间 2019-11-13

标签个人 html 笔记栏目 HTML 繁體版

原文原文链接

HTML笔记css

HTML超文本标记语言(HyperText Markup Language)html

<html>布局

<head>网站

<tiltle>url

这是第一个网站spa

</tiltle>htm

</head>图片

<body>it

</body>io

</html>

CSS(cascading style sheets)层叠样式表

功能：为页面元素提供颜色大小布局等效果的支持

能够设置的样式：

文本样式图片样式背景样式列表与表格样式布局样式

容器标签

div标签 (块级元素）影响布局

span标签（行级元素）不影响布局

容器设置数据样式的分类

一、行内样式直接写在标签中，使用style属性注意样式也是键值对，使用：分隔，各个样式用；分开样式语法样式属性：值

二、内嵌样式通常页面中使用样式的地方很是多，若是但愿经过一个统一的设定，而后让全部具备某个特征的元素都具备该样式，那么就可使用内嵌样式语法以下

样式如

Border:1px;

}

</style>

三、外部样式

通常一个页面须要统一的页面风格，能够考虑使用同一个CSS样式，那么能够单独写一个CSS文件，而后使用link标签将其引入到页面中

经典的边框的样式是边框

Bodrder:1px solid red;

使用1个像素宽度的红色实线

实线： solid

虚线：dashed

电线：dotted

样式的优先级

就近原则和专注原则（HTML是从上之下从左至右执行）

经常使用的选择器

基本选择器

ID选择器

#id

{

样式

}

类选择器

.class

{

样式

}

标签选择器

{

样式

}

通用选择器

{

样式

}

复合选择器

子代选择器

父代>子代

{

样式

}

后代选择器

祖代后代

{

样式

}

标签类选择器

标签名.类名

{

样式注意：带有该类样式的标签才能使用该样式，其余的带有该样式的标签不具有该样式

}

组合选择器

选择器，选择器，选择器

{

样式

}

经常使用样式

文本样式

Font-size:10px;

Font-weight:bold;

Font-family:华文行楷;

Color:#ff0000;

Text-decoration:underline | overline | line-through

Text-align:left |cemter| right

Line- height: 标准行高的倍数|像素

盒子模型

在页面中的全部内容都是盒子

页面上的元素就是盒子堆砌的结果

图片样式

边框与宽度

图片元素是一个行级元素（span）

display样式能够切换元素的块级显示或者行级显示，以及隐藏

Block

Inline

None

背景样式

Backfround-image:url(地址)

Background-repeat:no-repeat | repeat-X |repeat-Y

Background-position:xy坐标|left,center,right,top,bottom,center