CSS 基础笔记（二）

最新推荐文章于 2024-09-11 20:31:47 发布
最新推荐文章于 2024-09-11 20:31:47 发布
阅读量135 收藏
点赞数
分类专栏： css 文章标签： css 基础
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/onejava0821/article/details/87897095
版权

一、浮动

CSS的浮动是一个非常有用的工具，我们可以通过使用float属性设定浮动的方向（float：left  float：right），设定过浮动的元素会自动聚拢，关于浮动，推荐一篇写的很详细的博客https://blog.csdn.net/hu19921016/article/details/79219985

二、css框模型

元素框的最内部分是实际内容，padding 属性定义元素的内边距

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title></title>
    </head>
    <body>
        
        <div style="border:3px solid red ; width: 400px; height: 400px; padding: 40px;" >
             <div style="border:1px solid gray; width: 150px; height: 150px; ;">肾7plus</div>
             <div style="border:1px solid yellow; width: 150px; height: 150px;">华为P9</div>
             
        </div>
    </body>
</html>

上述例子设定了元素的内边距为40px，我们也可以用padding-top、-right、-left、-bottom 分别设置上下左右内边距。

相对于内边距，当然也有外边距，我们可以使用margin属性。

 

 

 

 

 

 

 

onejava0821
关注
专栏目录
CSS笔记（二）
baidu_29474379的博客
01-23 224
样式表书写位置 内嵌式写法 &lt;head&gt; &lt;style type=”text/css”&gt; 样式表写法 &lt;/style&gt; &lt;/head&gt; 外链式写法 写在head里，&lt;link rel=”stylesheet” href=”1.css”&gt; &lt;!-- 外链式写法--&gt; &lt;link rel="styl
CSS笔记(二)
hhdai1的博客
08-26 699
CSS 的继承性 关于文字样式的属性，都具有继承性。这些属性包括：color、 text-开头的、line-开头的、font-开头的。 关于盒子、定位、布局的属性，都不能继承。 CSS 的层叠性 层叠性。层叠性是一种能力，就是处理冲突的能力。 层叠性：计算权重 层叠性：就是 css 处理冲突的能力。 所有的权重计算，没有任何兼容问题 1、对于相同的选择器（比如同样都是类选择器），其样式表排序：行级样式 > 内嵌样式表 > 外部样式表（就近原则） 2、对于相同类型的样式表（比如同
前端css基础学习笔记
a_big_panda的博客
01-22 979
例如： 效果：例如：效果：例如：效果：选择页面中对应的标签（找她），方便后续设置样式（改她）例如：效果：例如：效果：注意：一个id选中多个标签也有效果，但不符合规范，规范是一个id选择器只选中一个标签例如：效果：例如：效果：例如：效果：注意点：例如：效果：例如：效果：注意：注意：例如：效果：例如：效果：注意：例如：效果：例如：效果：注意：如果需要让文本水平居中，text-align属性给文本所在标签（文本的父元素）设置例如：效果：注意：开发中会使用text-decoration：none；清除a标签默认的下
尚硅谷CSS学习笔记
MissXu666的博客
10-10 1376
等等），导致节点位置发生变化，此时触发浏览器重排（reflow），需要重新生成渲染树。③维护方面：CSS Sprites在维护的时候比较麻烦，页面背景有少许改动时，就要改这张合并的图片，无需改的地方尽量不要动，这样避免改动更多的CSS，如果在原来的地方放不下，又只能（最好）往下加图片，这样图片的字节就增加了，还要改动CSS。我们在编码时，不用过于关注浏览器的私有前缀，不用去记忆，去查询，因为常用的css3 新特性，主流浏览器都是支持的，对于老版本浏览器，我们也可以借助现代构建工具，去帮我们添加私有前缀。
CSS基础笔记-02动画
渔道的博客
01-05 1276
学习css动画的基本用法
CSS基础_css_笔记
09-23
**CSS基础：开启网页设计之旅** CSS，全称Cascading Style Sheets，是用于描述HTML或XML（包括如SVG、MathML等各种XML方言）文档样式的样式表语言。它是网页设计的重要组成部分，允许我们将表现与内容分离，使网页...
学习CSS基础过程笔记
03-26
学习 CSS 基础过程笔记是前端开发者的必备技能之一，本笔记总结了 CSS 的基础知识点，涵盖选择器、常见样式、布局案例等多方面的内容。 选择器 选择器是 CSS 中最基本也是最重要的概念之一。选择器用于选择 HTML ...
Web前端HTML5 CSS3初学者零基础入门全套学习笔记.zip
05-09
Web前端HTML5 CSS3初学者零基础入门全套学习笔记 Web前端HTML5 CSS3初学者零基础入门全套学习笔记 Web前端HTML5 CSS3初学者零基础入门全套学习笔记 Web前端HTML5 CSS3初学者零基础入门...
css课堂笔记前端css课堂笔记
08-05
本文档详细介绍了CSS的基本概念、语法、选择器、导入方式等知识点，为读者提供了系统的CSS基础知识。 一、CSS概念 CSS（Cascading Style Sheets）是一种用来表现HTML或XML等文件样式的计算机语言。CSS可以静态地...
css笔记css笔记css笔记
04-03
2. CSS 基础选择器： - **标签选择器**（Element Selectors）：通过元素名来选中所有该类型的元素，如 `p {color: red;}` 会改变所有段落的文本颜色。 - **类选择器**（Class Selectors）：使用点号 `.class` 来...
CSS —— 界面布局
m0_73557953的博客
09-10 984
采用flex布局的元素，称为 Flex 容器（flex container），简称"容器"
富文本中去掉 HTML 和 CSS 样式，只保留纯文本
S筱潇S四维Smile
09-11 361
要从富文本中去掉 HTML 和 CSS 样式，只保留纯文本，可以使用以下几种方法：1. 纯 JavaScript 方法你可以使用 JavaScript 的innerText或来提取文本，而忽略 HTML 标签和样式。
CSS 常用元素属性
最新发布
2301_79881188的博客
09-11 929
CSS 属性有很多, 可以参考文档。
CSS“多列布局”（补充）——WEB开发系列35
一条晒干的咸鱼的博客
09-10 699
多列布局是一种非常常见的布局方式，适用于内容丰富的页面，如新闻网站、杂志或博客。
《HTML 与 CSS—— 响应式设计》
asd4353012的博客
09-11 1524
HTML 和 CSS 在响应式设计中起着至关重要的作用。通过使用语义化标签、响应式图像、媒体查询、弹性布局和响应式网格系统等技术，可以实现网页在不同设备上的自适应显示，提供最佳的用户体验。在进行响应式设计时，要遵循移动优先设计、内容优先和测试优化等最佳实践，不断提高网页的质量和性能。随着移动设备的普及和技术的不断发展，响应式设计将变得越来越重要，开发者需要不断学习和掌握新的技术和方法，以满足用户的需求。
水平居中的几种方法（总结）
致未来的你。的博客
09-11 736
水平居中的几种方法（总结）
css鼠标移动过去变成手的图标
qq_38880880的博客
09-10 365
【代码】css鼠标移动过去变成手的图标。
CSS基本语法结构
nice66660的博客
09-10 1339
*某某[属性|=属性值] 选择到有a标签,且有属性title,且属性值只有1个是link的或者属性值有多个但是得是link-开头的变 *//*某某[属性~=属性值] 选择到的是a标签且有class属性,且属性值有完整的itme词的变 *//*某某[属性=属性值] 选择到有某某标签有指定属性且属性值必须一模一样的，多一个空格都不行 *//*某某[属性^=属性值] a标签有class属性且属性值是li开头的 *//*某某[属性$=属性值] a标签有class属性且属性值结尾是t的变 */
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值