H5基本样式和css选择器

最新推荐文章于 2023-12-29 11:39:17 发布

web_internet

最新推荐文章于 2023-12-29 11:39:17 发布

阅读量2.8k

点赞数 2

分类专栏： HTML5 文章标签： css html5 选择器基本样式

本文链接：https://blog.csdn.net/web_internet/article/details/52267560

版权

HTML5 专栏收录该内容

3 篇文章 0 订阅

订阅专栏

css基本样式：

css基本样式是对标签的修饰美化，它可以让网页显得更炫酷优美，下面就给大家介绍一些基本的样式：

<!DOCTYPE html>

<html>

<head>

div{

/*文字颜色*/

color: red;

/*设置宽度*/

width: 500px;

/*设置高度*/

height: 500px;

/*设置背景颜色*/

/*background-color: orange;*/

background-color: rgb(84,121,30);

/*边框*/

border: 5px solid black;

/*标签文本开头空出30px*/

text-indent: 30px;

/*标签内文本内容加下划线*/

text-decoration: underline;

/*文本贯穿线*/

text-decoration: line-through;

/*取消a标签的下划线*/

text-decoration: none;

/*内容居中*/

text-align: center;

/*字体大小*/

font-size: 30px;

/*字体*/

font-family: STSong;

/*文字加粗*/

font-weight: bold;

/*文字倾斜*/

font-style: italic;

/*设置背景图片*/

background-image: url(img/3.jpg);/*(此处需要在omg文件夹中插入一张图片)*/

/*不重复背景图片*/

background-repeat: no-repeat;

/*背景尺寸*/

background-size: 100% 100%;

}

／*取消a标签自带的下划线*/

text-decoration: none;

}

</style>

</head>

<body>

<div>我是div</div>

<a href="javascript:void(0)">我是a标签</a>

<div>

<a href="javascript:void(0)">我是另一个a标签</a>

</div>

</body>

</html>

css选择器：

css选择器就如同雷达一样，他能精准的找到我们想要修改的标签的样式，他在程序编写的过程中起到很大的作用，可以说没有css选择器就不能制作出一套完美的网页，如下，我通过代码的方式让大家体会选择器的强大作用；（注：大家在运行代码的过程中尽量是想用哪个就注掉其他无关的代码，以免它们之间相互影响，给你的观察带来影响。）

<!DOCTYPE html>

<html>

<head>

<title>css选择器</title>

/*css选择器第一种：标签名选择器*/

div{

width: 100px;

height: 100px;

background-color: red;

}

/*二：类选择器*/