<%@ Page Language="C#" AutoEventWireup="true" CodeFile="UsingCSS.aspx.cs" Inherits="UsingCSS" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
   <title>Zastosowanie CSS</title>
   <style type="text/css">
    body { background: #fffafa; margin: 1em; font: small/1.5em verdana, arial, sans-serif;   }
    h1 { background: gold; font: bold 120% verdana, helvetical, sans-serif; color: black; letter-spacing: 0.25em; padding: 0.25em; }
    .controlPanel { 
          padding: 0.5em; border: black 1px solid;
          background: #eee8a; margin: 1.5em; width: 75%; 
    }
    .pullQuoteOne { 
          padding: 0.25em;
            border: solid 7px #908070;
           border-right-width: 0;
           border-left-width: 0;
          background: lightgrey; 
          float: right;  
          margin: 0.25em 1em; 
          font: bold 90% arial, helvetica, verdana, sans-serif; 		
          width: 15em; 
    }		
    .pullQuoteTwo { 
          padding: 0.25em;
          background: #adc175; 
          float: left; 
          margin: 1.5em; 
          font: bold 105% times new roman, serif; 
          border: #82a91b 2px solid; 
          width: 10em;
    }
   </style>
</head>
<body>
   <form id="form1" runat="server">
      <h1>
         Zastosowanie styli</h1>
      <p>
         <asp:Label ID="labOne" runat="server">
  W poprzednim punkcie pokazane zostało zastosowanie niektórych wspólnych właściwości wyświetlania kontrolek serwera Web. Choć właściwości te są bardzo przydatne przy modyfikowaniu wyglądu generowanej strony, to nie dają wszystkich możliwości formatowania kaskadowych arkuszy stylów (CSS). 
         </asp:Label>
      </p>
      <p>
         <asp:Label ID="labPullQuote" runat="server">
  Na szczęście można również modyfikować wygląd kontrolek serwera korzystając z CSS.
         </asp:Label>
      </p>
      <p>
         <asp:Label ID="labTwo" runat="server">
        Dostępne są dwie metody wykorzystania możliwości CSS w kontrolkach serwera Web. 
        Pierwszym jest dołączenie deklaracji CSS do atrybutu (właściwości) Style kontrolki. 
        Na przykład, w poniższym przykładzie ustawiamy atrybut letter-spacing pozwalający zwiększyć do 
        dwóch pikseli odstępy pomiędzy literami kontrolki Label oraz atrybut zmieniający czcionkę na pochyłą.
        Innym sposobem na wykorzystanie CSS w kontrolkach serwera Web jest przypisanie klasy CSS do właściwości CssClass kontrolki.
         </asp:Label>
      </p>
      <div class="controlPanel">
         <p>
            Modyfikowanie styli przy użyciu list rozwijanych:
         </p>
         <p>
            Styl przekształcenia tekstu akapitu:
            <asp:DropDownList ID="drpParagraph" runat="server" AutoPostBack="True" OnSelectedIndexChanged="drpParagraph_SelectedIndexChanged">
               <asp:ListItem Selected="True">Wybierz przekształcenie stylu tekstu</asp:ListItem>
               <asp:ListItem Value="lowercase">małe litery</asp:ListItem>
               <asp:ListItem Value="uppercase">wielkie litery</asp:ListItem>
               <asp:ListItem Value="capitalize">kapitalizacja</asp:ListItem>
            </asp:DropDownList>
         </p>
         <p>
            Wybór klasy CSS:
            <asp:DropDownList ID="drpPull" runat="server" AutoPostBack="True" OnSelectedIndexChanged="drpPull_SelectedIndexChanged">
               <asp:ListItem Selected="True">Wybór klasy CSS</asp:ListItem>
               <asp:ListItem Value="pullQuoteOne">pullQuoteOne</asp:ListItem>
               <asp:ListItem Value="pullQuoteTwo">pullQuoteTwo</asp:ListItem>
            </asp:DropDownList>
         </p>
      </div>
   </form>
</body>
</html>
