HTML与CSS
xvzhengyang
这个作者很懒,什么都没留下…
展开
-
css实现分割线功能,各种各样的分割线(附效果图)
css hr 分割线原创 2022-07-08 18:11:07 · 15478 阅读 · 0 评论 -
CSS代码技巧
1.当class或者ID包含多个单词时,应使用连字符(-),CSS不区分大小写,因此不能使用驼峰式命名。同样,CSS中也不建议使用下划线连接的命名方式。/* 正确 */.footer-column-left { }/* 错误 */.footerColumnLeft { }.footer_column_left { }2.不要重复设置大多数CSS属性的值都是从D...转载 2019-07-02 23:37:29 · 213 阅读 · 0 评论 -
css过渡效果二
鼠标悬停看到动画过渡效果,旋转 缩放 平移以及透明度#box{ position: absolute; top: 100px; left: 100px; width: 200px; height: 200px; ...原创 2019-03-06 23:07:41 · 334 阅读 · 0 评论 -
CSS 选择器按兄弟选择
根据兄弟元素来选择元素,例如,假设你希望只选择前面有一个<h1>元素的段落,可以使用下面这个选择器 h1+p{ font-style: italic; } /* 先写前面的元素,再写一个'+'(加号),然后是兄弟元素 */ /* 这里的就是: 这个选择器会选择所有紧跟在一个...原创 2019-03-06 23:08:25 · 2022 阅读 · 0 评论 -
css中的伪元素
伪元素:可以用来选择元素的某些部分,这些部分可能不便于包围在div或span中,也不方便用其他方法来选择. 例如 first-letter伪元素可以用来选择一个块元素中文本的第一个字母,这样就能创建诸如首字母大写和首字母 下沉等效果.另外可以使用first-line伪元素选择段落的第一行.效果图如下...原创 2019-03-06 23:08:35 · 176 阅读 · 0 评论 -
表单增加css样式
代码如下<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>表单增加CSS样式</title> <!-- --> <style type="text/css"&转载 2019-03-05 22:38:46 · 1160 阅读 · 0 评论 -
form表单中其他元素
详细见代码<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>表单中其他元素</title> <style type="text/css"> div { display: t原创 2019-03-05 22:33:10 · 503 阅读 · 0 评论 -
form表单学习笔记一
<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>实现交互</title> <!-- HTML表单如何工作 1.表单:是一个包含输入域的web页面,允许你输入信息 2.提交表单时,这些信息会打包并发送到一个Web服原创 2019-03-05 22:26:00 · 234 阅读 · 0 评论 -
CSS中的表格三之表格中嵌套表格
代码如下<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>表格中嵌套表格</title> <!-- 继续学习表格中嵌套表格 1.只需要在td中在放入一个table即可 --> &l原创 2019-03-05 22:23:27 · 2375 阅读 · 4 评论 -
CSS中的表格2️⃣之合并/拆分单元格以及单元格中在存放表格(跨行或者跨列)
需求:在consequence中,增加了一条记录,并且重用了两个信息没有改变的单元格.也就是增加新行的时候,只需要列出要增加的不同的信息 consequence August 9 93 4242ft 7289 5/5 August 27 98 4/5 HTML中可以使用...原创 2019-03-05 22:20:02 · 2309 阅读 · 0 评论 -
CSS中的表格(一)
如何使用HTML来完成一个表格? <table>元素专门负责标记表格数据. <tr>每个tr元素构成表格中的一行 <th>每个th元素分别是某一列的表头;浏览器默认的会用粗体来表示表头. <td>每个td元素包含表格中的一个单元格,每个单元格分别构成一个单独的列;包含一个表格数...原创 2019-03-05 22:15:54 · 6033 阅读 · 1 评论 -
为列表增加一些样式
效果如下图,为列表ol或者ul添加标识符代码如下<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>为列表增加一些样式</title> <!-- 列表的主要属性是 list-style-type,利用这个属原创 2019-03-05 22:10:19 · 497 阅读 · 0 评论 -
HTML中的浮动元素
浮动元素: 想要浮动一个元素,必须为这个元素设置一个宽度 1.放在首位 2.浮动元素脱离了正常的文档流,相当于悬浮在文档上;注意,下面例子中主内容也就是id为first的div仍然是占据着浏览器窗口的整个宽度,不过我们为他指定了一个外边距与浮动右边的元素一样宽,这样会减少内容的宽度,结果就得到一个漂亮的两栏页面.代码如下<!DOCTYPE html><htm...原创 2019-01-27 18:44:21 · 2027 阅读 · 0 评论 -
CSS的GRID布局基础
<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>CSS的GRID布局</title> <!-- Grid 布局是网站设计的基础,CSS Grid 是创建网格布局最强大和最简单的工具。 目前主流浏览器都支持了网格布局转载 2019-01-17 19:07:56 · 184 阅读 · 0 评论