day03_CSS的基础语法及页面的引用

简介: day03_CSS的基础语法及页面的引用

基础语法

css的定义方法是:

选择器 { 属性:值; 属性:值; 属性:值;}

选择器是将样式和页面元素关联起来的名称,属性是希望设置的样式属性每个属性有一个或多个值。代码示例:

/*
    css注释 ctrl+shift+"/"
*/
div{ 
    width:100px; 
    height:100px; 
    color:red 
}

css页面引入方法:

1、外联式:通过link标签,链接到外部样式表到页面中。

– 开发中使用最多的,可以将所有的样式放在一个css文件、便于后续管理

<link rel="stylesheet" type="text/css" href="css/main.css">

2、嵌入式:通过style标签,在网页上创建嵌入的样式表。

– 多用于网页首页的样式、加快首页响应

<style type="text/css">
    div{ width:100px; height:100px; color:red }
    ......
</style>

3、内联式:通过标签的style属性,在标签上直接写样式。

<div style="width:100px; height:100px; color:red ">
相关文章
|
10天前
|
前端开发
页面无法滑动-CSS: touch-action属性
页面无法滑动-CSS: touch-action属性
19 0
|
2月前
|
Web App开发 前端开发 JavaScript
编程笔记 html5&css&js 004 我的第一个页面
编程笔记 html5&css&js 004 我的第一个页面
|
2月前
|
XML 前端开发 数据格式
css语法
【2月更文挑战第26天】css语法
17 6
|
20天前
|
前端开发
css的语法
【4月更文挑战第12天】css的语法
17 2
|
1天前
|
移动开发 前端开发 JavaScript
【专栏:HTML与CSS实战项目篇】使用HTML5与CSS3制作一个动态表单验证页面
【4月更文挑战第30天】本文介绍了使用HTML5和CSS3创建动态表单验证页面的方法。首先,简述HTML5用于构建网页内容,CSS3用于描述样式。接着,分四步展示实现过程:1) 设计包含输入框和提示信息的表单结构;2) 使用CSS3创建样式,增强视觉效果;3) 使用JavaScript监听输入事件,动态验证表单并显示错误信息;4) 测试和调试确保跨平台兼容性。通过学习,开发者能掌握创建带验证功能的表单,提升用户体验。
|
1天前
|
前端开发 测试技术 UED
【专栏:HTML 与 CSS 实战项目篇】实现一个在线产品展示页面
【4月更文挑战第30天】本文介绍了使用HTML和CSS创建吸引人的在线产品展示页面的实战步骤,包括页面设计规划、HTML结构搭建、CSS样式设计、具体页面实现、交互效果添加、优化与提升。通过简洁布局、产品列表和详情页设计,实现易用且具吸引力的展示效果。优化图片和代码,提升性能,以助企业在数字时代脱颖而出。
|
24天前
|
移动开发 前端开发
【通用CSS模板】移动端H5页面统一样式.css
【通用CSS模板】移动端H5页面统一样式.css
|
25天前
|
前端开发
CSS的常用语法
【4月更文挑战第7天】CSS的常用语法
13 3
|
26天前
|
前端开发
CSS的语法是用来定义网页中元素样式的规则集合
【4月更文挑战第6天】CSS的语法是用来定义网页中元素样式的规则集合
16 5
N..
|
2月前
|
前端开发
CSS定义的基本语法
CSS定义的基本语法
N..
8 1