不要なコードを大幅に削減し、HTML CSS で簡単に Web ページをレイアウトできます。友達、あなたのコレクションに保存してください~
# 1. テキスト設定
1,font-size: フォント サイズパラメータ
font-style: フォント形式
font-weight: フォントの太さ
color: パラメータ
2. ハイパーリンクの設定
text-decoration: 参数
3. 背景
background-color: 参数
background-image: url(URL)
background-repeat: 参数
background-attachment: 参数
##4. ブロック
1. 単語の間隔
word-spacing: 间隔距离
2. 文字の間隔
letter-spacing: 字母间距
text-align: 参数
パラメータ値:
##justify:相対的な左右の揃え
## bottom: 下揃え
##baseline: ベースラインの配置
text-indent: 缩进距离
12px は、テキストの距離
に相当します。white-space: 参数
7. 表示スタイル
display: 参数
#none: 表示しません
height 高度
width 宽度
padding 内边距
margin 外边距
float(浮动):可以让块级元素在一行中排列,例如横向菜单。
clear 清除浮动
六、边框
1、样式
border-style 参数
边框样式的参数:
none:无边框
dotted:边框为点线
dashed:边框为长短线
solid:边框为实线
double:边框为双线
2、宽度
border-width:参数
3、颜色
border-color:参数
七、列表
list-style-type:列表样式
不同浏览器的列表符可能不相同,可能会影响到网页,所以网页中的列表大多都是由背景图片显示。
控制用户界面的样式
八、鼠标
cursor:鼠标形状参数
CSS鼠标形状参数表:
鼠标形状:CSS代码
style="cursor:hand" 手形 style="cursor:crosshair" 十字形 style="cursor:text" 文本形 style="cursor:wait" 沙漏形 style="cursor:move" 十字箭头形: style="cursor:help" 问号形 style="cursor:e-resize" 右箭头形 style="cursor:n-resize" 上箭头形 style="cursor:nw-resize" 左上箭头形 style="cursor:w-resize" 左箭头形 style="cursor:s-resize" 下箭头形 style="cursor:se-resize" 右下箭头形 style="cursor:sw-resize" 左下箭头形
总结:
用常用HTML+CSS的代码做一个漂亮简单的个人网页,小伙伴来试试。
推荐学习:CSS视频教程
以上がWeb デザイン CSS スタイル コードの完全なコレクション、ぜひ集めてください。の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。