(一)css-显示模式、基本属性、特性

一 CSS简介(简)

  1. 美化网页,布局页面
  2. 层叠样式表(cascading style sheets)的简称,又称css样式表或级联样式表。

二 CSS引入方式

按照css样式的书写位置分类

  1. 内联样式表/行内样式表:元素标签内部的style属性中设定css样式。【权重高】【控制当前标签】内联样式表

  2. 嵌入式/内部样式表:全部放在html,单独放在一个style 标签里。【控制整个页面元素】【一般在<head里】

  3. 链接式引入/外部样式表:单独写在css文件,之后引入到html页面使用。外部样式表

三 CSS元素显示模式

显示模式

块元素

  1. 特点:
    独占一行,宽度默认是容器(父级宽度)的100%;
    高度宽度外边距及内边距都可以控制;
    是盒子,可以放很多行内或者块元素。

  2. 注意:
    文字类元素不能用块元素;
    <p主要放文字,不能放块元素,尤其不能放<div。

  3. 常见:
    div 、hr、p、h1~h6、ul、ol、dl、form、table

行内元素(内联元素)

  1. 特点:
    相邻元素多个一行;
    宽高直接设置无效(需转换);
    默认宽度为内容的宽度;
    只能放文本或其他行内元素。

  2. 注意:
    链接里不能再放链接;
    特殊情况<a里可放块元素,但要给<a转换块元素最安全。</

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
H5、CSS3新属性和ES6新特性是现代Web开发中非常重要的内容。 H5(HTML5)是HTML的第五个版本,引入了许多新的语义化标签和功能。其中一些新属性包括: 1. `<canvas>`:用于绘制图形、动画和其他视觉效果。 2. `<video>`和`<audio>`:用于嵌入视频和音频内容。 3. `<input>`的新类型:如`type="date"`、`type="email"`等,用于更方便地处理不同类型的用户输入。 4. `<progress>`和`<meter>`:用于显示进度条和度量。 5. `<section>`、`<article>`、`<header>`和`<footer>`:用于更好地组织页面结构。 CSS3引入了许多新的样式属性和效果,使得页面设计更加灵活和丰富。一些新属性包括: 1. 边框属性:如`border-radius`用于创建圆角边框,`border-image`用于使用图片作为边框。 2. 渐变:如`linear-gradient`和`radial-gradient`用于创建平滑过渡的背景效果。 3. 动画和过渡:如`@keyframes`和`transition`属性,用于创建动态的元素效果。 4. 弹性布局:使用`display: flex`和相关属性,实现灵活的布局方式。 ES6(ECMAScript 6)是JavaScript的第六个版本,也被称为ES2015。它引入了许多新的语言特性和语法糖,使得JavaScript编程更加高效和易读。一些新特性包括: 1. 块级作用域:引入`let`和`const`关键字,使得变量的作用域更加清晰和可控。 2. 箭头函数:使用`=>`语法定义匿名函数,简化了函数的书写和上下文绑定。 3. 模板字符串:使用反引号(`)包裹字符串,可以在其中插入变量和换行符。 4. 解构赋值:通过模式匹配的方式,将对象或数组的属性值解构到变量中。 5. Promise:用于处理异步操作,避免了回调地狱的问题。 6. 模块化:使用`import`和`export`关键字进行模块的导入和导出。 以上只是H5、CSS3和ES6的一些主要特性,它们都为Web开发带来了更多可能性和便利性。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值