CSS快速入门

属性

color:颜色

font-size:字体大小

text-decoration:文本装饰

text-indent:首行缩进

line-height:行高

text-align:文本对齐

CSS引入样式

  • 行内样式:写在标签的style属性中
  • 内嵌样式:写在style标签中(通常写在head标签中)
css 复制代码
<style>
	h1 {
		xxx :xxx
	}
</style> 
  • 外联样式:写在单独的.css文件中(需要通过link标签在网页中引入)
html 复制代码
<link rel="stylesheet" href="xxx.css">

CSS选择器

  • 元素选择器:根据标签的名称来选择,如h1
  • id选择器:为标签设置id属性,用#id设置元素样式
  • 类选择器:为标签设置class属性值,用.cls设置元素属性

优先级:ID选择器>类选择器>元素选择器

盒子模型

内容区域、内边距区域、边框区域、外边距区域

  • box-sizing:指定width,height修饰的内容liru border-box盒子的区域
  • margin:外边距(上,右, 下,左)或者(上下 左右),auto:自动计算(自动居中)
相关推荐
3824278271 天前
JS表单提交:submit事件的关键技巧与注意事项
前端·javascript·okhttp
Kagol1 天前
深入浅出 TinyEditor 富文本编辑器系列2:快速开始
前端·typescript·开源
小二·1 天前
Python Web 开发进阶实战:Flask-Login 用户认证与权限管理 —— 构建多用户待办事项系统
前端·python·flask
浩瀚之水_csdn1 天前
python字符串解析
前端·数据库·python
全栈小51 天前
【前端】在JavaScript中,=、==和===是三种不同的操作符,用途和含义完全不同,一起瞧瞧
开发语言·前端·javascript
如果你好1 天前
Vue createRenderer 自定义渲染器从入门到实战
前端·javascript·vue.js
温宇飞1 天前
Web 图形合成技术:Blending 与 Porter-Duff Compositing
前端
小高0071 天前
读懂 Tailwind v4:为什么它是现代前端项目的必选项?
前端·javascript·vue.js
我的golang之路果然有问题1 天前
python中 unicorn 热重启问题和 debug 的 json
java·服务器·前端·python·json
SpringLament1 天前
从零打造AI智能博客:一个项目带你入门全栈与大模型应用开发
前端·aigc