从0开始搭建一个自己的网站--基础知识_怎么从零布局一个网页-CSDN博客

本文链接：https://blog.csdn.net/l1l1ll1/article/details/139896361

css选择器

1.元素（标签）选择器

-选择器的名字必须是标签的名字

-作用：选择器中的样式会作用于所有同名的标签上

元素名称 {

css样式名:css样式值；

}

div{

     color: red;

 }

2.id选择器

- 选择器的名字前面需要加上#

- 作用：选择器中的样式会作用于指定id的标签上，而且有且只有一个标签（由于id是唯一的）

#id属性值 {

css样式名:css样式值；

}

#time {

    color: blue;

}


<span id="time">2023年03月02日 21:50</span>

3.类选择器

- 选择器的名字前面需要加上 .

- 作用：选择器中的样式会作用于所有class的属性值和该名字一样的标签上，可以是多个

.class属性值 {

css样式名:css样式值；

}

.cls{

     color: green;

 }




<span class="cls" >2023年03月02日 21:50</span>

超链接

构成

<a href="destination.html" target="_self">点击我（在当前窗口打开 destination.html）</a>
<a href="destination.html" target="_blank">点击我（在新窗口打开 destination.html）</a>

- href: 指定访问的url

- target: 指定在何处打开资源链接

- _self: 默认值，在当前页面打开

- _blank: 新建页面打开

在head里加入可以统一设置打开方式

<head>
  <base target="_blank">
</head>

布局标签

布局标签：实际开发网页中，会大量频繁的使用 div 和 span 这两个没有语义的布局标签。

- 标签：<div> <span>

- 特点：

div标签：

- 一行只显示一个（独占一行）

- 宽度默认是父元素的宽度，高度默认由内容撑开

- 可以设置宽高（width、height）

span标签：

- 一行可以显示多个

- 宽度和高度默认由内容撑开

- 不可以设置宽高（width、height）