html/css
文章平均质量分 74
辞旧2031
这个作者很懒,什么都没留下…
展开
-
9.css4个要点补充
文章目录淘宝第一行,两边留白自适应,中间固定文本类元素position:absolute|float:left/right 设置之后该元素便会变为inline-block元素文本垂直对齐方式淘宝第一行的布局 一个左浮动,一个右浮动淘宝第一行,两边留白自适应,中间固定<!-- 父子结构 --> <div class="wrapper"> <div class="content"></div> </div>.w原创 2021-08-13 17:45:01 · 118 阅读 · 0 评论 -
8.文字溢出处理,背景图片,图片代替文字,元素嵌套
文章目录单行文字溢出打点展示多行文本溢出背景图片图片代替文字该怎么代替元素嵌套规则单行文字溢出打点展示 <!-- 单行文字溢出打点展示 --> <p>法国议会选举第一轮投票结束马克龙坐在党领先</p> <!-- 单行文字溢出打点展示 -->文字溢出默认换行展示了/* 单行文字溢出打点展示 *//* 文字溢出了,它换行展示了 *//* 但现在要设置它溢出不换行并且溢出部分打点展示 */p{ width:300px原创 2021-08-13 16:14:32 · 185 阅读 · 0 评论 -
7.包裹浮动元素
文章目录上一节提的父级包裹浮动元素的解决办法伪元素伪元素解决清除浮动使用触发bfc的父级元素包裹float应用场景导航栏上一节提的父级包裹浮动元素的解决办法 <div class="wrapper"> <div class="content">1</div> <div class="content">2</div> <div class="content">3</原创 2021-08-13 10:27:20 · 201 阅读 · 0 评论 -
6.两栏布局,经典bug,bfc,float
两栏布局效果图(先写右又写的左):先写右边又写的左边;先写左再写右也可以,必须是第一个出生的设置为绝对定位,下一个元素才可以上来成一排,若设置第二个出生的元素为绝对定位,就算他脱离原来位置进行定位,他也窜不到第一行来,因为第一个元素是块级元素,独占一行 <!-- 两栏布局 --> <!-- 肯定是两个div;一个固定,一个自适应 --> <!-- 思路,怎么让两个div并到一排:绝对定位,脱离原来位置进行定位 --> <d原创 2021-08-09 17:50:58 · 124 阅读 · 0 评论 -
5.css企业开发经验,习惯盒模型,层模型
css企业开发经验,习惯盒模型,层模型文本对齐方式text-align单行文本所占高度 行高 line-height文本首行缩进 text-indenttext-decoration伪类选择器标签分类四张图片排成一排先定义功能后选配标签选择器功能:初始化标签通配符选择器功能:初始化所有标签盒子模型一个盒子在另一个盒子居中盒模型计算远视图绝对定位absolute相对定位relative定位固定定位fixed(广告定位)用定位做水平垂直居中文本对齐方式text-align <!-- 文本对齐方式原创 2021-08-08 16:51:35 · 155 阅读 · 0 评论 -
4.css复杂选择器
css复杂选择器父子选择器复杂结构 浏览器底层遍历父子选择器方法直接子元素选择器并列选择器分组选择器css权重计算css属性font-sizefont-weightfont-stylefont-familycolorborder父子选择器<!-- (1)父子选择器/派生选择器 */ --><!-- 只用标签选择器选择,让123的那个span背景颜色为红色,234不变 --><!-- <div> <span>span123</spa原创 2021-08-07 16:12:05 · 208 阅读 · 0 评论 -
3.css基础选择器
css基础选择器多选框select组件,下拉菜单主流浏览器引入csscss基础选择器css权重多选框单选框type值为radio,多选框type值为checkbox.<form action="" method="get"> <h1>Choose your favourite friut</h1> <!-- 有名有值 --> <!-- 单选 radio--> 1.apple原创 2021-08-06 15:20:51 · 105 阅读 · 0 评论 -
2.高级标签
高级标签HTML编码空格回车有序列表ol无序列表ul图片img超链接a表单form请输入关键字,聚焦和失去焦点HTML编码<!-- 以&开头,以;结尾,中间是html编码的特殊字符 -->&;空格空格并不代表空格文本,有特定的语法含义,代表的是文本分隔符<!-- 1.英文并未换行 --><div style="width:100px;height:100px;background-color: red;">qwreiotiojhhsh原创 2021-07-10 21:50:14 · 312 阅读 · 0 评论 -
1.基础标签
基础标签大致结构根标签结构化标签字符集SEO搜索引擎优化技术标签大致结构根标签<html></html>结构化标签<!-- 编辑给浏览器看的,思想类的东西 --><head></head><!-- 显示给用户看的 --><body></body>字符集<meta charset="utf-8">gb2312 国家标准第2312条,包括亚裔字符集等,不包含繁体字符集gbk原创 2021-07-08 16:15:53 · 116 阅读 · 0 评论 -
htmlcss概述
术语web:互联网w3c:万维网联盟,非营利性的组织,w3.org,为互联网提供各种标准xml:可扩展的标记语言:Extension Markup Language,用于定义文档结构。例子:请在每周一 下午两点,从人人网下载最新美剧《权力的游戏》 <任务> <执行日期> 每周一 </执行日期> <执行时间> 下午两点 </执行时间> <下载地址> 人人网 </下载地址原创 2021-06-28 16:24:46 · 171 阅读 · 0 评论