【前端1-----CSS颜色属性,字体文本和背景属性,边框属性,margin和padding,盒模型,行内块转换,浮动,三大定位】的更多相关文章

前端1-----CSS颜色属性,字体文本和背景属性,边框属性,margin和padding,盒模型,行内块转换,浮动,三大定位

前端1-----CSS颜色属性,字体文本和背景属性,边框属性,margin和padding,盒模型,行内块转换,浮动,三大定位 一丶css选择器的优先级 行内 > id选择器 > 类选择器 > 标签选择器 > 继承 1000 100 10 1 0 # 所有的值可以累加,但不能进位 (同级别的数值可以累加) # 优先级如果相同,写在后面的生效 二丶css的颜色表示 /*RGB表示法*/ rgb: red green blue /* 光谱三原色 */ rgb(255,255,255)…

CSS 选择器、字体/文本、背景

CSS的基本使用 直接写在标签内 <p style="color: red; font-size: 40px;">段落</p> 写在 style 标签内 <style type="text/css"> span{ color: aquamarine; } </style> 使用外部 .css 文件 @import (不建议使用此方式) <style type="text/css"> @i…

CSS.02 -- 样式表 及标签分类（块、行、行内块元素）、CSS三大特性、背景属性

样式表书写位置  内嵌式写法 <head> <style type="text/css"> 样式表写法 </style> </head> 外链式写法 写在head里,<link rel="stylesheet" href = "1.css"> 行内样式表/内联式 <h1 style = "font - size : 30px ; color : red;">…

python 之 前端开发（盒子模型、页面布局、浮动、定位、z-index、overflow溢出）

11.312 盒子模型 HTML文档中的每个元素都被比喻成矩形盒子, 盒子模型通过四个边界来描述:margin(外边距),border(边框),padding(内填充),content(内容区域),如果把一个盒子比喻成一个壁挂相片,那么 外边距margin ===== 一个相框与另外一个相框之间的距离 边框border ====== 边框指的就是相框 内边距padding ===== 相片与边框的距离 宽度width/高度height ===== 指定可以存放相片的区域 1.css显示模式:块级…

1 background（复合属性）与font（复合属性） 2 行内块的间距问题 3 行内元素的margin 4 清除浮动 5定位的元素的层级 6 Border-radius: 边框半径

1 background(复合属性)与font(复合属性): background: 颜色  图片的链接  是否平铺  背景位置 是否滚动.(可以随意调动或省略) Font: 粗度 字体风格 字体大小/行高 字体样式 字体大小和样式不可省略 2 行内块的间距问题 行内块元素相邻时,行内块元素之间会有几像素的间距,只有通过浮动解决. 3 行内元素的margin 行内元素的上下外边距不起作用,左右起作用. 4 清除浮动 给父盒子设置一个高度     Clear: both      Overflow…

CSS(3)---块级标签、行内标签、行内块标签

块级标签.行内标签.行内块标签 html中的标签元素三种类型:块级标签.行内标签.行内块标签. 一.概述 1.块级标签 概念 每个块元素通常都会独自占据一整行或多整行,可以对其设置宽度.高度.对齐等属性,常用于网页布局和网页结构的搭建. 1)块级标签特点 1.每个块级元素都从新的一行开始,并且其后的元素也另起一行(独自占据一整行或多整行) 2.元素的高度.宽度.行高以及顶和底边距都可设置. 3.宽度缺省是它的容器的100%,除非设定一个宽度. 4.它可以容纳行内标签和其他块级标签. 注意 只有文…

CSS基础 行内元素/行内块元素设置垂直对齐方式及常见使用案例

vertical-align 属性值 效果 baseline 基线对齐 top 顶部对齐 middle 中心对齐 bottom 底部对齐 使用案例1:百度搜索框左边和右边底部没有对齐 使用vertical-align:top;/vertical-align:bottom; 之后效果 案例,html结构代码: <body> <input type="text" ><input type="button" value="百度&qu…

css块级标签，行内标签，行内块标签的转换（2）

        css块级标签,行内标签,行内块标签的转换 版权声明 本文原创作者:雨点的名字 作者博客地址:https://home.cnblogs.com/u/qdhxhz/ 在基础1中,我详细讲了css的常见属性,几种不同的选择器,在此基础之上我们来进一步地认识它们的特性从而更好地学习和掌握相关开发技能. HTML标签的分类 在讲标签分类的时候,我们作为初学者在刚使用标签的时候会发现有些属性在一些标签上不起作用,比如宽.高.水平居中等,其实这个属性的使用只有在块级标签上使用才起作用.个人认…

CSS的布局之文档流，与行内/块级元素的延伸

文档流,即(position:stiatic),是html布局机制的默认状态. 文档流在排列的过程中,块级元素从上到下,行内元素,从左到右. ·块级元素 <div> <h系列> <form> <table> <p> ... ·行内元素 <span> <title> <strong> <input> <select> <img> <a> ... 此处延伸文档流中块级…

CSS中的块级元素，行内元素，行内块元素

博客转载于:https://blog.csdn.net/swebin/article/details/90405950 块级元素 block 块级元素,该元素呈现块状,所以他有自己的宽度和高度,也就是可以自定义width和Height,块元素独占页面的一行,可以作为容器使用,可以容纳块级元素和行内元素.块级元素有以下特点 每个块元素都独占页面的一行 高度和宽度是可以设置的 元素的宽度不设置的话默认为父元素的宽度 常见的块元素 <address>//定义地址 <caption>//定…