初窥css
CSS相关概念
全称是层叠式样式表。规定了html在网页上的显示样式。我们都知道css主要是负责装饰页面的,但是其实在HTML4之前,网页的样式与架构全部都是写在一起的,也是在HTML4之后w3c组织决定将样式与结构分开的。
前端三层(感觉名字好像一本秘籍,哈哈)
html:结构层,搭建网页的整体架构
css: 样式层,装饰页面。
JavaScript:行为层,一些页面交互效果。
作用细化
1.给文本添加文字显示样式
2.给盒子添加属性进行结构布局
注意事项
1.css的k和v写法:k:v
2.多个属性之间必须用;分割
3.对于换行,缩进等不敏感
4.设置字体时请将英文字体写到中文字体前面。
font属性用来控制大多数字体的样式,它本身是复合属性(可以用-连接单一属性名)
小知识点
常用字体:
备用字体
有时候为了页面更加美观,有些程序员就会使用一些比较奇怪的字体,但是刚好用户电脑上没有这个字体,这个时候就需要备用字体了,下面代码中我会写到用法
小练习
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="zh"> <head> <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" /> <title>初学css</title> <style> div{ width: 300px; /*这里把盒子宽度设置为300像素*/ font-size:300px ; /*这里把字体大小设置为300像素*/ color: pink; /*字体颜色为粉色*/ font-family: "Arial","微软雅黑","宋体"; /*这里将英文字体设为Arial,中文字体为微软雅黑,中文备用字体为宋体*/ background-color: deepskyblue; /*这里将盒子背景颜色设置为深天蓝色*/ border: yellow solid; /*将边框的颜色设为黄色,边框为实线*/ } </style> </head> <body> <div > <p>我真的是汪星人</p> </div> </body> </html>
原文:https://www.cnblogs.com/roseneverdie/p/10726150.html