Html ve Css aynı yerde kullanmak yardım ?

12-05-2016, 11:40:46

Üyeliği durduruldu

merhaba arkadaşlar aşağıdaki linkte bulunan kutucuğu yapmak istioyrum ama css için ayrı dosya html için ayrı yerde değil tek bir yerde çalıştırmam lazım bunu daha önce birkaç yerde görmüştüm

css ve htmlyi aşağıdaki kodları nasıl tek bir yerde çalıştırabilirim ? yardım edermisiniz ?

http://www.adobewordpress.com/css-il...cuklari#result

12-05-2016, 11:58:15

#2

FSahin

Bu şekilde yapabilirsiniz.

<!DOCTYPE HTML>
<html lang="en-US">
<head>
	<meta charset="UTF-8">
	<title></title>
	<style type="text/css">
		section {
		max-height: 15px;
		overflow: hidden;
		background-color: #665847;
		border-left:8px #3D362D solid;
		width: 220px;
		padding: 4px;
		color: #FFFFFF;
		-webkit-transition: max-height 1s ease;
		-moz-transition: max-height 1s ease;
		-o-transition: max-height 1s ease;
		transition: max-height 1s ease;
		font:12px Tahoma;
		}

		section:hover {max-height: 200px;}

		span{color:#FF9900; display:block; margin-bottom:5px;}	
	</style>
</head>
<body>
	<section>
	<span>Adobewordpress.com ne yapar?</span>
	Adobe dersleri, WordPress, SEO, HTML5 ve CSS3 gibi güncel konuları ele alan Türkçe interaktif eğitim merkezi.
	</section>
</body>
</html>

12-05-2016, 12:06:26

#3

taamtaam

limonluck adlı üyeden alıntı: mesajı görüntüle

merhaba arkadaşlar aşağıdaki linkte bulunan kutucuğu yapmak istioyrum ama css için ayrı dosya html için ayrı yerde değil tek bir yerde çalıştırmam lazım bunu daha önce birkaç yerde görmüştüm

css ve htmlyi aşağıdaki kodları nasıl tek bir yerde çalıştırabilirim ? yardım edermisiniz ?

http://www.adobewordpress.com/css-il...cuklari#result

http://bootsnipp.com/snippets/featur...-with-nav-tabs

12-05-2016, 12:13:11

#4

~~limonluck~~

Üyeliği durduruldu

FSahin adlı üyeden alıntı: mesajı görüntüle

Bu şekilde yapabilirsiniz.

<!DOCTYPE HTML>
<html lang="en-US">
<head>
	<meta charset="UTF-8">
	<title></title>
	<style type="text/css">
		section {
		max-height: 15px;
		overflow: hidden;
		background-color: #665847;
		border-left:8px #3D362D solid;
		width: 220px;
		padding: 4px;
		color: #FFFFFF;
		-webkit-transition: max-height 1s ease;
		-moz-transition: max-height 1s ease;
		-o-transition: max-height 1s ease;
		transition: max-height 1s ease;
		font:12px Tahoma;
		}

		section:hover {max-height: 200px;}

		span{color:#FF9900; display:block; margin-bottom:5px;}	
	</style>
</head>
<body>
	<section>
	<span>Adobewordpress.com ne yapar?</span>
	Adobe dersleri, WordPress, SEO, HTML5 ve CSS3 gibi güncel konuları ele alan Türkçe interaktif eğitim merkezi.
	</section>
</body>
</html>

hay senin canına kurban