一共三个块级元素标签,post为整个文章内容区域,content默认可以只加一个最小高度(如min-width:200px),mark就是那个印章了。
主要原理就是父容器post相对定位(position:relative),印章mark绝对定位(position:absolute),然后就可以随意设置mark的top/bottom和left/right属性来进行定位了,z-index一般不用设置,因为根据文档顺序,后出现的内容会挡住前面的内容。
基本的HTML结构:
<div
class="post">
<div
class="content"></div>
<div
class="mark"></div>
</div>
基本的样式:
<style
type="text/css">
.post
{
position:
relative
}
.content
{
min-width:
200px
}
.mark
{
position:
absolute
top:
100px
right:
50px
width:
150px
height:
150px
background:
url(images/mark.png)
no-repeat
center
center}
</style>
对于IE6的PNG透明问题的简易解决方法是在.mark类中追加
_background:none
_filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src="images/mark.png"
,sizingMethod="crop")
这两句,如果有问题可以继续...
1.新建画布,点击住矩形工具,之后选择椭圆工具2.画出一个正圆,方法是同时摁住shift键,这样就会出现正圆,而不是椭圆。把圆的填充去掉。
3.选择左侧菜单中的文字工具,选择其中的路径文字工具
4.将鼠标移动到刚才画出的圆的轮廓上,发现光标改变,之后点击左键,就会发现光标变成文字输入形式,并且是在圆的轮廓上。这样就可以输入你想要的内容。
5.接下来制作印章的外框,画一个正圆,调整描边,颜色,
6.之后制作印章里面的五角星,选择矩形工具里面的星形工具,注意,如果你直接画,你会发现画出来的不是直五角星,画直五角星的方法是同时摁住alt
7.调整一下各个的大小,之后对齐,关于对齐,全选图形,再在其中一个点一下,你会发现那一个变粗了,之后选择各种对齐。(原理是你选中的那个是中心,其他的都是以它为中心对齐。)
8.文字的调节,在窗口-文字-字符,之后就可以调整文字的大小,间距,行距等等。快捷键是CTRL+T