鹏鹏编程网
www.flypeng.com
常用技术,开发中遇到的坑,你想要的或许这里有。
Toggle navigation
首页
SpringCloud
编程设计
css
hadoop
ajax
javascript
Java
jetty
python
Storm
Maven
git
SpringBoot
Sublime
Gradle
zookeeper
SpringCloud
ElasticSearch
数据库
SQL Server
Memcache
MySql
Oracle
MangoDB
Hbase
Access
DB2
redis
电脑知识
(current)
网络知识
windows10
linux
常用工具
×
搜索提示
关键字不能小于2个字!
当前位置:
首页
>
编程设计
>
css
>
5个网页排版常用的CSS基础
https://www.flypeng.com
win10系统
发布时间:2015-08-29 00:00 来源:鹏鹏电脑知识网
文章目录
本文给大家介绍在文章的排版中经常会用到的几个CSS基础,当然,包括图文混排,是怎样做到的。
1、首行缩进
你知道的,从小学,老师就教我们,段落的开头应该空两格。而你使用word的时候,也有首行缩进这个功能,但在html中你的空格键好像起不了作用了。当然,你可以用 来代替一个空格,但这不是理想的方式,用CSS吧,简单、有效:
<p style="text-indent:2em;">你的内容</p>
这样的话,这个有style="text-indent:2em;"段落就会显示两个字符的缩进了。缩进更多?修改2em,2表示2个字符,你可以相应增加或者减少。
2、图文混排
在word中,我们可以用环绕来让文字显示在图片周围,而CSS中,我们可以用float,来让文字在没有清理浮动的时候,显示在图片以外的空白处。如下所示:
在下面的代码中,把float设置成left,图片会显示在左边,而right则显示在右边,而margin-right是为了不让文字和图片贴在一起需要写的,如果你设置的是float:right;刚相应应该是把 margin-right改成margin-left:
<img style="float:left;margin-right:15px;" src="图片地址" alt="图片说明">
3、设置背景色
先来看一个示例,如果你有需要引用的内容,而主题中又没有设置,或者希望自己定制一下背景颜色。如下所示:
代码如下,如果你不知道颜色是如何定义的,你可以看看web216安全,换上相用的颜色代号就可以了,比如#faf7e8表示上面的浅黄色:
<p style="background#faf7e8;border-top:1px dotted #a3a3a3;border-bottom:1px dotted #a3a3a3;text-align:center;">
4、让文字居中
如上例,只要在代码中加入text-align:center,就可以让文章在容器的宽度内水平居中。OH,容易哦!
5、显示一个边框
边框我们会用到border,添加一个边框,只要加上style="border:1px dotted #080;",1px代码边框的大小,而dotted是边框的样式,常用的样式用三个:solid(实边)、dashed(虚线)、dotted(点状虚线)。 就像上面实例的边框中,我使用的是dotted边。
好吧,就写这5个比较常用的。更多的CSS基础知识,你可以到w3school中文学习,不需要很多时间,你就可以轻松排版了。
上一篇:
CSS Bug顺口溜记住你就是高手
下一篇:
CSS表单元素不继承body字体属性
如果你有好的
win10资讯
或者
win10教程
,以及
win10
相关的问题想要获得
win10系统下载
的关注与报道。
欢迎加入发送邮件到#qq.com(#替换为@)。期待你的好消息!
最新文章>>>
CSS3如何画一个旋转的风车效果出来?
04.27
教你用CSS3实现鼠标移动到图片上时图片放大效果
04.27
鹅厂前端跟你聊聊Html5+CSS3的优势有哪些
04.27
CSS3如何画3D效果的魔方?很简单的
04.27
大神前端分享:3行css实现循环动画
04.27
如何写出让你效率更高的CSS代码
04.25
关键时刻让你不丢脸的CSS小技巧
04.25
学会这些CSS技巧,让你找份前端工作变得轻轻松松
04.25
高级前端知识:CSS必知的几个底层知识
04.25
腾讯前端小笔记:9个CSS技巧分享
04.25
相关热门>>>
12款很棒的浏览器兼容性测试工具
147
用CSS样式画横线的方法
146
CSS清除浮动常用方法小结
126
css html 鼠标手型,鼠标形状,鼠标效
99
纯 CSS 创建各种不同的图形形状
96
CSS如何把DIV永远置于页面的底部
96
CSS3如何画3D效果的魔方?很简单的
95
CSS为网站图片添加防盗链功能
92
overflow解决float浮动后高度自适应
85
CSS边距属性定义:用margin还是pa
83
A-
A+