如何在html中设置网页背景颜色

如何在html中设置网页背景颜色,第1张

<html><head></head><body>

<div style="background-color:redheight:100px"></div>

<div style="background-color:blueheight:200px"></div>

</body></html>

颜色自己调,可以用取色器查看颜色,例如background-color:#789999如果需要加边框可以用border属性

<html><head></head><body>

<div>

<div style="float:leftheight:100pxwidth:50%background-color:green"></div>

<div style="float:leftheight:100pxwidth:50%background-color:red"></div>

</div>

<div style="background-color:blueheight:200pxclear:both"></div>

</div></div></body></html>

建议你先了解一下div/CSS布局,同一种布局有不同的实现方式。

首先打开电脑上自带的记事本程序,然后输入html网页基本结构语句。<html><body></body></html>

由于css样式必须在标签<head></head>之间,因此我们点击<html>后面,输入<head></head>标签。

在head标签之间输入样式标签<style></style>,然后定义一些属性,例如

<style type="text/css">

body {background-color: yellow} 定义网页背景色为黄色;

h1 {background-color: #00ff00} 定义h1标签背景色为#00ff00;

h2 {background-color: transparent} 定义h2标签背景色为透明;

p {background-color: rgb(250,0,255)} 定义p标签背景色为rgb值;

p.no2 {background-color: graypadding: 20px} 这个定义class属性为no2的p标签背景色为灰色,并且边距为20px;

</style>

然后点击body标签后面输入正文标签内容,例如

<h1>这是KING</h1>

<h2>这是KING</h2>

<p>这是KING</p>

<p class="no2">这个KING设置20内边距。</p>

点击记事本菜单中的文件,选择另存为,把内容保存为html网页格式。双击打开预览效果。

我们可以发现代码中两个同样的<p>标签显示的css样式却不同,区别就在于样式中定义的p.no2,这就是正文代码中class="no2"的优势所在,可以定义个性风格。

还可以选择用html设置,如下:

颜色自己调,可以用取色器查看颜色,例如background-color:#789999如果需要加边框可以用border属性


欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/zaji/7073347.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-04-01
下一篇 2023-04-01

发表评论

登录后才能评论

评论列表(0条)

保存